Skip to content

Gatby's Pizza - A Modern Pizza Website (Search, Sell, Add to Cart & Checkout) featuring a frontend build with react.js and a sanity backend. The app uses a Gatsby frontend framework, thus I created a UI to be be themed from The Great Gatsby, a 1925 novel by American writer F. Scott Fitzgerald. Deployed to Netlify!

Notifications You must be signed in to change notification settings

johnsonr84/gatsbys-pizza

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 
 
 
 
 
 
 
 
 

Repository files navigation

Description

Gatby's Pizza - A Modern Pizza Website (Search, Add to Cart & Checkout) featuring a frontend build with react.js and a sanity backend. The app uses a Gatsby frontend framework, thus I created a UI to be be themed from The Great Gatsby, a 1925 novel by American writer F. Scott Fitzgerald. Deployed to Netlify!

github-follow project-languages-used project-top-language license

Built With

React.js Gatsby.js GraphQL Node.js JavaScript MongoDB Express.js Netlify

Table of Contents

Outcome

  • It is responsive to different screen sizes of devices such as mobile, tablet, and desktop.

Project URL

Deployment

Demo/Screenshots

Gatsby's Pizza
screenshot of Gatsby's home page
Pizza Menu
screenshot of pizza menu
Slice Masters Page
screenshot of gatsby employees
Order Page
screenshot of order page

Technologies

React.js, GraphQL, Gatsby, Node.js, JavaScript, Express.js, MongoDB, REST-API, SEO Meta Tags, Sanity, Grid and CSS-Variables

Installation

  • Access to GitHub.com and a code editor such as vscode is necessary
  • Go to https://github.com/johnsonr84/gatsbys-pizza
  • Click on the green button that says Clone or Download
  • Choose how you would like to download: using the SSH/HTTPS keys or download the zip file
  • Using SSH/HTTPS Key: You will copy the link shown and open up either terminal (mac: pre-installed) or gitbash (pc: must be installed). Once the application is open, you will type git clone paste url here. Once you have cloned the git repo, cd into the repo and type open. to open the folder which contains all files used for the website. Once inside the folder, click on index.html to open the website in the browser.
  • Using Download ZIP: Click on Download Zip. Locate the file and double click it to unzip the file. Locate the unzipped folder and open it. All the files for the website will be within this folder. Click on index.html to open the website in the browser.

Usage

  • In order to use this APP, you need terminal (mac: pre-installed) or gitbash (pc: must be installed). You also need to download and install node.js and npm or yarn package manager. Open the cloned REPO in your favorite code editor, and then in terminal, enter the command “npm i“ or “yarn add” to install the dependencies in both gatsby and sanity folders. Now you are ready to start using the app by entering “npm start” or "yarn start" on your terminal or gitbash in both gatsby and sanity folder. It's recommended to have two terminal windows going at the same time. One for your server side folder (sanity) and the other for your client facing folder (gatsby). If you just want to try how the app works, you can go to the link here

Credits

I would like to credit Wes Bos's Master Gatsby Course for teaching me the skills necessary to complete this wonderful website and to improve my understanding of building modern websites in React and latest technologies.

License

This project is mit licensed.

Resources

Contact

Email: [email protected]

Author

Author(s): Rob Johnson
GitHub: https://github.com/johnsonr84/

About

Gatby's Pizza - A Modern Pizza Website (Search, Sell, Add to Cart & Checkout) featuring a frontend build with react.js and a sanity backend. The app uses a Gatsby frontend framework, thus I created a UI to be be themed from The Great Gatsby, a 1925 novel by American writer F. Scott Fitzgerald. Deployed to Netlify!

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages