Lemony DeliverEat

.gitignore

@@ -3,3 +3,4 @@
 /static/bundle.js
 /static/bundle.js.map
 .DS_Store
+.env

README.md

@@ -1,83 +1,74 @@
-# Delivereat
+# Cullercoats Coffee
 
-In this project we will create a database backed version of Delivereat. We will build it as a new project, but feel free to use your original Delivereat project as reference. Be aware that because the data structures we will be working with here are likely to be different, it may not be possible to directly re-use your UI components.
+### Order takeaway coffee and snacks online for delivery
 
-A few notes before we get started
+**Cullercoats Coffee** is a much-loved cafe in my hometown whose coffee-snacks menu I am using as the basis for an online delivery service. It presents a single page mobile-view menu, drawn from a database of menu items. As the customer you can browse and add one or more items to the basket, which then shows a full breakdown of costs including delivery, and outputs an order id.
 
-* Fork and clone this repo
-* Start by building the simplest thing that works. Add to it as you go along. Test your application as frequently as possible to make sure it does what you expect
-* Commit frequently and push to Github
-* Implement features one at a time
-* Make sure your app is responsive
-* You may want to design the API first, before implementing the UI that uses and API
+The app also provides a view for the cafe-owner so they can see what each incoming order consists of.
 
-## Features
+---
 
-**Database and API**
+## Installation and set up
 
-* Design a database that will allow you to store a menu and orders. Start out with pen and paper first sketching out the tables and columns you will need, as well as the relationships between the tables.
-* The database will need to store a menu which will contain item name and price. We will also need to store orders. Each order can have multiple menu items and each menu item can appear in multiple orders. Each menu item ordered will also need to have a quantity.
-* Store the SQL commands used to create database and populate with initial data in a `database.sql` file in your repo. It will allow us to review your database code and also make it easy for you to rebuild database.
-* Create a RESTful API that will allow you to get the menu and save new orders
-* Test the API using Postman
+- Clone the project and run `npm install`
+- Create your own local PostreSQL database instance and create the tables by running `pgweb` navigating to localhost:8081 and running the query in the `database.sql` file.
+- Create a `.env` file with the following variables
 
-**Menu**
-* Design and build a front end UI that will load the menu from the API and display it to the user
-
-**Order**
+```
+DB_HOST=localhost
+DB_NAME=
+DB_USERNAME=
+DB_PASSWORD=
 
-* Update the menu page to make it an order page
-* It should allow the user to specify quantities of items to order
-* It should add a delivery charge and display the total order cost
-* Create functionality to submit orders to the API and display a notification to the user with order id
+```
 
-## Stretch goals
+- Run `npm start` to launch the app and navigate to localhost:8080
+- Use `npm run dev -- --watch` to build React
+- Navigate to `localhost:8080` in your browser to view
 
-**Own feature**
+---
 
-* Design and implement a feature of your choosing
+### Tech stack
 
-**SMS notification**
+- React
+- PostgreSQL
+- Node.js
+- Express
+- Handlebars
+- SCSS
+- Classnames
+- Git
 
-* Add a phone number input to your UI and a column in orders table to store it.
-* Update the API to receive the phone number as part of the order
-* Sign up for an account with Twilio. It's an API that allows you to send SMS messages and do lots of other cool things with phones. Use the signup code WELOVECODE to receive $20 credit.
-* Implement SMS notification using Twilio to send an SMS notification to a user letting them know that the order has been received.
+### Build tools
 
-**Unit tests**
+- Webpack
+- Babel
 
-* Add unit tests to your application where appropriate
+### Stages of development
 
-## Technical notes
+- Plan database tables and relationships [https://dbdiagram.io](https://dbdiagram.io)
+- Compile .sql file and create tables with seed data,
+- Set up and creat core functionality in React
+- SCSS to style the UI
+- Implemented functionality for:
+  - menu listing page with visual feedback and error messaging for adding / removing items
+  - shopping basket
+  - free delivery calculation
+  - list of incoming orders
 
-* Run `npm install` after cloning to download all dependencies
-* Use `npm run dev -- --watch` to build React
-* You will need to create a `.env` file to store your database credentials. Make sure you add it to `.gitignore` file so that the credentials do not get commit to git and end up in public.
-* Use `node server.js` to run the Node server in another tab
-* Place all static files such as images and CSS in the `static` folder. When requesting those files from the server use `/static` at the beginning of the URL. For example `<link rel="stylesheet" type="text/css" href="/static/styles.css">`
-* `bundle.js` produced by webpack will be output in the `static` folder
-* To send data server using a POST, PUT or PATCH request you can do something the example below, where `order` is an object we want to send to the server and `http://localhost:8080/api/order` is URL we want to send it to.
+### Functionality and features
 
-```js
-fetch('http://localhost:8080/api/order', {
-    method: 'post',
-    body: JSON.stringify(order),
-    headers: {
-      'Content-Type': 'application/json'
-    }
-  }).then(function(response) {
-    return response.json();
-  }).then(data => {
-    // handle response
-  });
-```
+- Menu items can be added, removed from the basket and increase/decreased in quantity
+- Added menu items can be viewed in the basket menu with a breakdown of costs
+- A booking can be placed with order ID output
 
-* Check out [Nodemon](https://nodemon.io/) to automatically rebuild and restart your server when changes are saved.
+### Desired features with more time
 
-## README
+- A booking can then be make by adding your name and number
+- Add Twilio functionality - receive a booking confirmation by text with booking ID
+- You can view your order by clicking on the member icon entering your order ID
+- To calculate the estimated time of delivery based on the customer's location
+- To enable customers to track their order on their phone
+- Allow customers to amend their order within a limited time period
 
-* Produce a README.md which explains
-  * what the project does
-  * what technologies it uses
-  * how to build it and run it
-  * any unresolved issues the user should be aware of
+![Screenshot](./static/images/coffee_screenshots.png)

database.sql

@@ -0,0 +1,52 @@
+-- ORIGIN TABLE (to amend use drop as below)
+
+--CREATE DATABASE lemonycafe_db
+
+DROP TABLE IF EXISTS menu_order;
+DROP TABLE IF EXISTS "order";
+DROP TABLE IF EXISTS menu;
+
+-- IMMUTABLE BASE TABLE FOR MENU ITEMS (ONE-)
+CREATE TABLE menu (
+id serial,
+name TEXT NOT NULL UNIQUE,
+price NUMERIC(4,2) NOT NULL,
+PRIMARY KEY (id)
+);
+
+-- DYNAMIC TABLE FOR ORDER ITEMS (MANY-)
+CREATE TABLE "order" (
+id serial,
+ordertime TIMESTAMP NOT NULL,
+orderstatus TEXT,
+phone CHAR(13),
+PRIMARY KEY (id)
+);
+
+-- DYNAMIC MAPPING TABLE FOR ORDER-MENU ITEMS (MANY-)
+CREATE TABLE menu_order (
+id serial,
+order_id INT NOT NULL,
+menu_id INT NOT NULL,
+quantity INT NOT NULL,
+PRIMARY KEY (id),
+FOREIGN KEY (order_id) REFERENCES "order" (id),
+FOREIGN KEY (menu_id) REFERENCES menu (id)
+);
+
+INSERT INTO menu VALUES (1, 'Cappuccino', 2.5);
+INSERT INTO menu VALUES (2, 'Latte', 2.5);
+INSERT INTO menu VALUES (3, 'Flat White', 2.3);
+INSERT INTO menu VALUES (4, 'Cortado', 2);
+INSERT INTO menu VALUES (5, 'Macchiato', 1.8);
+INSERT INTO menu VALUES (6, 'Tiffin', 1.8);
+INSERT INTO menu VALUES (7, 'Rocky Road', 1.8);
+INSERT INTO menu VALUES (8, 'Scone', 1.5);
+INSERT INTO menu VALUES (9, 'Apple cake', 2.5);
+INSERT INTO menu VALUES (10, 'Breakfast wrap', 5);
+INSERT INTO menu VALUES (11, 'Eggs on toast', 3.5);
+INSERT INTO menu VALUES (12, 'Pancake stack', 4.5);
+INSERT INTO menu VALUES (13, 'Sausage sammidge', 3.5);
+INSERT INTO menu VALUES (14, 'Porridge', 2.5);
+ALTER SEQUENCE menu_id_seq RESTART WITH 15 INCREMENT BY 1;
+

index.js

@@ -0,0 +1,2 @@
+require('dotenv').config();
+