Your project must fulfill the following requirements:
-
Use React for the front end.
-
Use GraphQL with a Node.js and Express.js server.
-
Use MongoDB and the Mongoose ODM for the database.
-
Use queries and mutations for retrieving, adding, updating, and deleting data.
-
Be deployed using Heroku (with data).
-
Have a polished UI.
-
Be responsive.
-
Be interactive (i.e., accept and respond to user input).
-
Include authentication (JWT).
-
Protect sensitive API key information on the server.
-
Have a clean repository that meets quality coding standards (file structure, naming conventions, best practices for class and id naming conventions, indentation, high-quality comments, etc.).
-
Have a high-quality README (with unique name, description, technologies used, screenshot, and link to deployed application).
You own a bustling café, and you don't want your customers to waste their time waiting for their order up. Or you want to open your cafe business but can't afford to rent a shop. This Web App is the solution for all of you! With this App, your customers can drop their drink orders, take notes, make a payment, and everything is online with a few clicks.
"Save More Time - Give Good Services - Earn More Money!".
* As a Café owner
I WANT my website shows all the drinks menu,
SO THAT my customers can pick any of them, take note if needed, and make payment
GIVEN an Online Cafe Store
WHEN I load App
THEN I am presented with a menu, navBar, and Login/Signup, and a photo with a description of the store
WHEN I click on an order button takes me to the main menu
THEN I am presented with all drinks lists and an add cart button, and a customized button
WHEN I am not logged in and enter the site
THEN I still can see all the store menu, choose the foods/drink I want
WHEN I click on the Login/Signup menu option
THEN a modal appears on the screen with a toggle between the option to log in or sign up
WHEN the toggle is set to Signup
THEN I am presented with three inputs for a username, an email address, a password, and a signup button
WHEN the toggle is set to log in
THEN I am presented with two inputs for an email address and a password and login button
WHEN I enter a valid email address and create a password and click on the signup button
THEN my user account is created, and I am logged in to the site
WHEN I enter my account’s email address and password and click on the login button
THEN I, the modal closes, and I am logged in to the site
WHEN I am logged in to the site
THEN I can use all the functions, an option to see my cart remove any item, and it can take me to the check out page if need
THEN that book’s information is saved to my account
WHEN I click on the option to see my cart
THEN I am presented with the drinks/foods I have chosen to my cart, each featuring their customization
WHEN I click on the Remove button on an item
THEN that item is deleted from my cart list
WHEN I click on the Logout button
THEN I am logged out of the site and presented with the home page
The following image shows the web application's appearance and functionality:
fork the repo
git clone to local
npm install
Run the following command at the root of your project and answer the prompted questions:
--FROM LOCAL--
npm run seed
npm start
This how you can contribute to this project:
> Clone the project to your local
> Create your own branch
> Add contribution codes/commit/push to remote repo
> Create a pull request
Distributed under the MIT. Please see for https://opensource.org/licenses/MIT more details.
© 2022 Final Project - Thai Hoang, Pham(Adam): Online Café