Eat The Burger

Eat The Burger is an app that allows you to add different types of burgers and then "devour" them later.

Live version

Go here to view the app.

About the Application

Getting Started

These instructions will get you a copy of the project up and running on your local machine.

Prerequisites

Install the following programs if they aren't on your local machine.

Node (LTS) - http://nodejs.org

MySQL Workbench - https://dev.mysql.com/downloads/workbench/

GIT - https://git-scm.com/book/en/v2/Getting-Started-Installing-Git

Installing

Clone this github repository to a folder on your computer using a command line program.

git clone https://github.com/crystalodi/burger.git

Navigate to the folder the repository was cloned into and run npm install to create the node_modules folder needed to run the application

cd burger
npm install

Open MySQL Workbench program installed in the Prerequisites section. Open schema.sql in db folder and execute the query. Do the same for seeds.sql located in the folder.

Start the server and application

npm start

Open a web browser and type http://localhost:3000. Your should see this:

Folder Structure

The app utilizes the MVC (Model-View-Controller) design pattern to organize functionality. After following the steps in the Installation section, your folder should look like this:

├───config
├───controllers
├───db
├───images
├───models
├───node_modules
├───public
│   └───assets
│       ├───css
│       ├───img
│       └───js
└───views
    ├───layouts
    └───partials
        └───burgers

• /config contains the logic that connects to the MySQL database and the ORM used to create, read, and update burgers submitted by user.
• /db contains sql scripts to create schema and populate tables with test data
• /models contains Burger model that passes data to the orm in /config (Model)
• /controllers contains api routes for retrieving, adding, and updating burgers (Controller)
• /public contains front end ui used to display the page. (View)
• /views contains express handlebars templates used to render eaten and uneaten burgers. (View)

How to Use

Add a burger

Enter the type of burger into the burger message area and press the Add Burger Button. The burger should now appear under the Uneaten Burgers section underneath the add burger section.

Eat a Burger

Under the uneaten burgers section below the add burger form, click on the eat it link

After the burger is eaten, then the burger will appear under the eaten burgers section

Built With

• NodeJS - The web framework used
• Express - Used to create web server
• Express Handlebars - Used to generate layout
• Materialize CSS - CSS Framework used to add styling to layout.
• Body Parser - Middleware for parsing body sent for POST requests.
• MySQL - Node Package used to query MySQL database

Authors

• Crystal Odi - Initial work - crystalodi

Acknowledgments

• MySQL Documentation