Fat Daddy's Texas BBQ

View the active demo site here

Details

This project initially started as something to practice coding back in March of 2021. My cousin said she and her husband were going to open a restaurant called Fat Daddy's Texas BBQ so I thought Why not attempt to build them a website?. At that time, with beginners knowledge, I created everything with vanilla HTML, CSS, JS. After attending GA, I have learned a lot of new techniques that really cleaned up my code. I found this project a few days ago and decided it needed an overhaul.

I created this new version using React, Tailwind, and Hygraph CMS for the data management.

Hygraph Content API Endpoint:

'https://api-us-east-1.hygraph.com/v2/cl83s5iwu1bgg01ug5cjx6s6d/master'

Menu Page

Mobile - Home Page

This project was bootstrapped with Create React App.

Available Scripts

In the project directory, you can run:

yarn dev

Runs the app in the development mode.
Open http://localhost:3000 to view it in your browser.

The page will reload when you make changes.
You may also see any lint errors in the console.

yarn build

Builds the app for production to the build folder.
It correctly bundles React in production mode and optimizes the build for the best performance.

The build is minified and the filenames include the hashes.
Your app is ready to be deployed!

See the section about deployment for more information.

Todo:

1. Go through each page and double-check that everything is included in the Hygraph CMS schemas
2. Set up image paths to accept a url string or an image object. If the imageString is used in Hygraph, prioritize imageString over the image object.
3. Implement the Framer image carousel on the main Home page instead of the current image carousel.
4. Update the index.html with new title
5. Center the Navigation Menu in the Header and push out the Company Name and Social Icons.
6. Fix the links on the social icons to navigate externally.
7. Fix Home page on mobile. Where did that big empty gap come from...?
8. Make the section titles on the food menu sticky beneath the nav menu when scrolling on mobile.
9. Create icon and update index.html with browswer icon