Skip to content
Tucson Burger using Sequelize
JavaScript HTML CSS
Branch: master
Clone or download

Latest commit

Fetching latest commit…
Cannot retrieve the latest commit at this time.


Type Name Latest commit message Commit time
Failed to load latest commit information.

Sequelized_Tucson_Burger 🍔 🌶️

Welcome to Tucson Burger, the "hottest" burger joint in this part of the Southwest! Tucson Burger is a fun, dynamic, user-interactive full-stack web app that allows the user to order a burger, either from one of the Tucson favorites, or a made-to-order custom burger that you get to name yourself. Then, when the order is submitted, pick up the burger (or send back to kitchen to remake the burger). And finally, the best part is to devour the burger! Responsive web design with media queries is incorporated, so the burger ordered on the beautiful web app looks as delicious on your mobile device as on the larger desktop display. Note, this version of the app utilizes Sequelize, a promise-base Node.js Object Relational Mapping (ORM) for MySQL/JawsDB database instead of the homemade ORM.

Technical overview

This full-stack application utilizes the Model/View/Controller (MVC) design pattern in which the Controller serve as the interface to handle the logic and routing between Model or the application database core and View to dynamically render HTML content in response to the user/client requests. Specifically, the app is built with Node.js, Express.js, and Handlebars to handle the logic and to route the client requests to MySQL database (mysql2) using Sequelize to retrive information to dynamically build HTML pages to display the content back to the client. To run the server codes, the app is deployed live on Heroku. If you wish to clone or download the code from GitHub to run on the localhost, make sure you uncomment out the connection for MySQL (use your own MySQL password) and comment out the JAWSDB connection code.

Built with or topics covered

  • HTML5
  • CSS3
  • JavaScript
  • jQuery
  • Model View Controller (MVC)
  • Object Relational Mapping (ORM)
  • Sequelize ORM
  • Express.js
    • HTTP Requests (GET, POST)
    • Routes and static content
    • Handlebars engine integration
  • Node.js
    • Backend API calls
  • Handlebars Templates and Layouts
  • Node Package Manager (npm)
  • Media queries
  • MySQL/JawsDB
  • Heroku deployment

npm packages:

Directory structure

All the recommended files and directories should look like the following structure:

├── config
│   ├── config.json
│   └── keys.js
├── db
│   ├── schema.sql
│   └── seeds.sql
├── models
│   ├── burger.js
│   └── index.js
├── node_modules
├── package.json
├── public
│   └── assets
│       ├── css
│       │   └── style.css
│       ├── img
│       │    └── background.jpg
│       │    └── hot.png
│       │    └── mobilepreview.gif
│       │    └── webpreview.gif
│       └── js
│            └── burgers.js
├── routes
│   └── apiRoutes.js
│   └── htmlRoutes.js
├── server.js
└── views
    ├── index.handlebars
    ├── layouts
    │    └── main.handlebars
    └── partials
        └── burgers
                └── burger-block.handlebars


Here are the previews of the web application:

You can’t perform that action at this time.