Here's the sneak peak of Food Ordering App.
Have a look at site: …d-ordering-for-restaurants.vercel.app
Source Code:
github.com/siddiqss/food-…

#100devs #100DaysOfCode #buildinpublic

Day 34, 35 of #100DaysOfCode

Food Ordering Web App Project for Restaurants with Next.js and Mongo DB

Worked on admin panel where admin can add more items to menu.
Using cloudinary to host images.
Updated theme colors of whole app.

#100devs #buildinpublic

Day 32, 33 of #100DaysOfCode

Food Ordering Web App Project for Restaurants with Next.js and Mongo DB

Assuming the restaurant will be managed by single admin, added cookie based authentication for admin. Also created a login page for admin.

#100devs #buildinpublic

Day 26 of #100DaysOfCode

Food Ordering Web App Project for Restaurants with Next.js and Mongo DB

Created a page for admin where they can add/edit/delete products and view the orders.

Worked on GET & Delete reqs. Have to work on PUT/edit products.

#buildinpublic #React

Day 24 & 25 of #100DaysOfCode

Food Ordering Web App Project for Restaurants with Next.js and Mongo DB
Created a modal box for taking user input like Address, Phone number for home delivery (can be viewed at the end of video)

Fixed issues with PUT request
#buildinpublic #React

Day 22 & 23 of #100DaysOfCode

Food Ordering Web App Project for Restaurants with Next.js and Mongo DB

Integrated PayPal as a payment method using react-paypal-js lib. After successful payment, user is routed to order status page.
#buildinpublic #React

Day 20 & 21 of #100DaysOfCode

Food Ordering Web App Project for Restaurants with Next.js and Mongo DB

Worked on central state management with redux toolkit. Created a redux store for cart’s state which includes a list of products, quantity & total price
#buildinpublic #React

Day 18 & 19of #100DaysOfCode

Food Ordering Web App Project for Restaurants with Next.js and Mongo DB

Fixed issue with fetching data from DB. getServerSideProps in Next.js was creating an error. Fn I’m using useEffect to fetch data from API.
#buildinpublic #React

Day 17 of #100DaysOfCode

Food Ordering Web App Project for Restaurants with Next.js and Mongo DB

Wrote GET and PUT endpoint to fetch and update a single product.
Ran into an error. Tried hard to fix that but haven’t yet figured out what’s causing it 😣

#buildinpublic #React

Day 16 of #100DaysOfCode

Food Ordering Web App Project for Restaurants with Next.js and Mongo DB

👉 Created GET API to fetch an array of all products from MongoDB
👉 Implemented SSR in Next.js by using getServerSideProps instead of useEffect hook.

#buildinpublic #React

Day 15 of #100DaysOfCode

Food Ordering Web App Project for Restaurants with Next.js and Mongo DB

👉 Created POST API for Products. Used Postman to test API and stored dummy data into MongoDB

#buildinpublic #React

Day 14 of #100DaysOfCode

Food Ordering Web App Project for Restaurants with Next.js and Mongo DB

👉 Established connection between MongoDB and Frontend.

👉 Created Schema for Products and Orders using mongoose.

#buildinpublic #React

Day 13 of #100DaysOfCode

Food Ordering Web App Project for Restaurants with Next.js, Express.js and Mongo DB

🐞Fixed some minor CSS issues in the frontend.
💪🏼 Created a new cluster on MongoDB Atlas.

#buildinpublic #React

Haven’t been able to carry on #100DaysOfCode for quite some time because I was too occupied with work. Will continue sharing my journey on #buildinpublic from tomorrow.

Day 12 of #100DaysOfCode

Food Ordering Web App Project for Restaurants with Next.js, Express.js and Mongo DB

✔ Worked on media queries to make application responsive. Using flex box for positioning elements 🤩
Frontend done ✅ . Will move to backend

#buildinpublic #React

Day 11 of #100DaysOfCode

Food Ordering Web App Project for Restaurants with Next.js, Express.js and Mongo DB

✔ Worked on media queries to make application responsive. Using flex box for positioning elements 🤩
Frontend done ✅ . Will move to backend

#buildinpublic #React

Day 11 of #100DaysOfCode

Food Ordering Web App Project for Restaurants with Next.js, Express.js and Mongo DB

✔ Designed an Orders page which shows the order details and status like processing, on the way or delivered.

#buildinpublic #techtwitter

Day 10 of #100DaysOfCode

Food Ordering Web App Project for Restaurants with Next.js, Express.js and Mongo DB

✔ Done with cart component styling.

#buildinpublic #techtwitter

Day 9 of #100DaysOfCode

Food Ordering Web App Project for Restaurants with Next.js, Express.js and Mongo DB

🔸 Started working on Cart component which contains Product img, name, extras, quantity and total.
Have to work on CSS yet.

#buildinpublic #techtwitter

Day 8 of #100DaysOfCode

Food Ordering Web App Project for Restaurants with Next.js, Express.js and Mongo DB

✅ Added an input box for product quantity and Add to Cart button on product page. Done working with product page 😌

#buildinpublic #techtwitter