yamisagi/feast-flow

A food order app named Feat Flow I built with React and Tailwind CSS + Shacdn/UI, powered by Vite. And I'm using local backend server for the API.

Feat Flow App

About Me ♥️»

📫 How to reach me

About The Project

product.mov

Feast Flow is a simple meal management application that incorporates technologies such as React, Tailwind CSS, shacdn/ui, Context, useReducer, custom hooks, and zod - react-hook-form. The application utilizes Tailwind CSS and shacdn/ui for a sleek design. Effective state management is ensured through React Context and useReducer, while zod and react-hook-form optimize form processes. Feast Flow reflects modern React development with its modular approach and user-friendly design.

Do not forget to create a .env.local file in the root folder and add 👇🏻

VITE_API_URL=http://localhost:3000

How To Run Backend 🚀

• Clone the repo

  cd backend

• Install NPM packages

  npm install

• Run the project

  npm start app.js 

• Done! Local server is running on your machine 🚀

  http://localhost:3000/

• Let's go to the frontend! 🎉

How To Run This Project 🚀

• Clone the repo

  git clone

• Install NPM packages

  bun install

• Run the project

  bun run dev

• Open the project on your browser

  http://localhost:5173/

• Enjoy! 🎉

(back to top)

Roadmap

• Project Setup
• Add Tailwind CSS
• Add SHACDN/UI
• Create Header Component
• Update Styles
• Create Body Component
• Implement Backend API
• Create Card Component with SHACDN/UI
• Implement Services
• Implement useHttp Custom Hook
• Implement Form Component with SHACDN/UI
• Add Form Validation
• Implement Drawer & Modal Components with SHACDN/UI
• Implement Cart Context
• Implement Reducer for Cart Context
• Fix Fetching & Posting Data Bugs
• Create Shimmer Effect for Loading State
• Implement Error & Loading fallbacks
• Clean up the code 🧹
• Project Finished 🎉
• Deploy the app to Vercel 🚀

(back to top)