Skip to content

Latest commit

 

History

History
291 lines (164 loc) · 6.36 KB

README.md

File metadata and controls

291 lines (164 loc) · 6.36 KB

HungryHub - Food Delivery App React Badge


Description: You can quickly order your favorite food with a user-friendly interface. Easily search for your desired restaurant and select dishes and add them to your cart for a seamless ordering experience.

Table of Contents

  1. Hero Section Component
  2. Search Component
  3. Category Component
  4. Menu Component
  5. Cart Component
  6. Header Component
  7. Auth Component
  8. Loader and Shimmer Component
  9. Filters Component
  10. About and Help Component
  11. Checkout Component
  12. Network off Notification
  13. Tech Stack

Installation

  1. Clone the repository
git clone https://github.com/siddhesh-coder/HungryHub.git
  1. Go to the project directory and install dependencies for both the client and server(server is available on https://github.com/siddhesh-coder/HungryHub-Razorpay-Server.git), below cmd will be the same for server
npm install
npm start
  1. To run tests.
npm watch-test

Components:

Hero Section Component:

• Listing of restaurants, cuisines, and greeting with user name:

• Layout: FlexBox

Hero Section

Hero Section

Hero Section

🔝 Back to Top

Search Component:

• It provides a list of restaurants based on the input given by the user.

• Debouncing which reduces the API call for every key stoke.

Hero Section

Hero Section

🔝 Back to Top

Category Component:

• List of food items based on selected cuisine.

Hero Section

Hero Section

🔝 Back to Top

Menu Component:

• List of menus based on the selected restaurant.

• Child Component:

  1. Carousal
  2. Accordion

Menu Section

Menu Section

🔝 Back to Top

Cart Component:

• List of food items that the user has selected to purchase.

• User can increment, decrement or remove the count of food in their cart.

• The "Clear Cart" button is used to remove all the items from the cart.

Menu Section

Menu Section

Header Component:

• Navigate to different sections in the application.

Menu Section

🔝 Back to Top

Auth Component:

• User Authentication by using Formik(form handling) and yup(validation).

Menu Section

Menu Section

🔝 Back to Top

Loader and Shimmer Component:

Loader

🔝 Back to Top

Filters Component:

• Based on filter it sort the list of restaurants

Filter

🔝 Back to Top

About and Help Component:

Filter

Filter

🔝 Back to Top

Checkout Component:

Filter

Filter

Filter

🔝 Back to Top

Network off Notification:

Filter

🔝 Back to Top

Tech Stack:

Frontend:

React Badge React Badge React Badge React Badge React Badge React Badge React Badge React Badge React Badge

Backend:

React Badge

Authentication:

React Badge

Payment Gateway:

React Badge

Tests

React Badge React Badge

IDE

React Badge

Linters

React Badge

Terminal

React Badge

Improvement

  1. Enhance the styling and design of the components to create a more visually appealing interface.

🔝 Back to Top