Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/chandraprakash-bathula/hunger-bites-restaurant_app

A React.JS Application with live API data from SWIGGY.
https://github.com/chandraprakash-bathula/hunger-bites-restaurant_app

babel css html javascript jsx parcel postcss react-hooks react-js react-router tailwindcss

Last synced: 2 days ago
JSON representation

A React.JS Application with live API data from SWIGGY.

Awesome Lists containing this project

README 

        
# 🍔 Hunger Bites - Ultimate Online Food Expedition ( React JS, Swiggy Public API, Parcel, Babel ) 🌐 



Welcome to Hunger Bites, the avant-garde online food ordering haven 🏡 designed meticulously with React JS and enhanced by the extensive database of the Swiggy public API, ensuring a wide spectrum of restaurant selections 🍲. At Hunger Bites, we're dedicated to delivering a seamless, captivating food ordering experience 🌟, accentuated by cutting-edge features such as Shimmer UI for sophisticated loading aesthetics, lazy loading for streamlined content presentation, and a universally responsive design ensuring an unmatched usability across diverse devices 📱💻.



## Core Features 🌈



- **Sophisticated User Interface:** 🎨 Leveraging Shimmer UI, we guarantee smooth and visually appealing content loading animations.

- **Vast Selection of Restaurants:** 🍴 With the Swiggy public API integration, delight in a broad variety of dining venues.

- **Advanced Search Functionality:** 🔍 Effortlessly find your preferred restaurants with our intuitive search mechanism.

- **Customized Filtering Options:** 🎛️ Tailor your search results with filters such as highest ratings or quickest delivery times for a personalized browsing experience.

- **Dynamic Cart Interaction:** 🛒 Experience our easy-to-navigate cart for a streamlined order management process.

- **Internet Connectivity Check:** 🔌 Our custom React hook continuously monitors your internet connection to promise a smooth, uninterrupted exploration.

- **Optimized for Mobile Use:** 📱 Enjoy a flawless browsing experience on mobile devices thanks to our responsive design ethos.

- **Efficient Content Delivery:** ⏳ Benefit from our lazy loading feature, designed for enhanced speed and efficiency in content delivery.



## Innovations in Technology 🚀



- **UI Library:** React JS 🖌️ - Crafting dynamic and responsive user interfaces with efficiency and elegance.

- **State Management:** Redux Toolkit 🔧 - Utilizing Redux for global state management, ensuring a cohesive and scalable architecture.

- **Bundling and Compiling:** Parcel and Babel 📦 - For seamless application bundling and ES6+ code compilation, optimizing performance and compatibility.

- **Navigation and Routing:** React Router v6 🚦 - Implementing modern routing solutions for seamless navigation within the application.

- **Styling:** Tailwind CSS 💅 - Adopting Tailwind for intuitive and responsive design, accelerating UI development.

- **Parcel:** Dev Build, Local Server, HMR (Hot Module Replacement), File Watching Algorithm, Caching, Image Optimization, Minification, Bundling, Compress, Consistent Hashing, Code Splitting, Differential Bundling, Diagnostic, Error Handling, HTTPs, Tree Shaking, Different dev and prod bundles.

- **Hunger Bites Restaurant APP Components:** 

  - **Header:** Logo, Nav Items

  - **Body:** Search, RestaurantContainer, RestaurantCard (Img, Name of Res, Star Rating, cuisine, delivery time)

  - **Footer:** Copyright, Links, Address, Contact

- **React Hooks:** useState(), useEffect()

- **Types of Routing in Web Apps:** Client Side Routing, Server Side Routing

- **Redux Toolkit:** Store building, Connection to the app, Slices (cartSlice), Dispatching actions, Selectors

- **Types of Testing (Developer):** Unit Testing, Integration Testing, End to End Testing - e2e testing

- **Setting up Testing in our app:** Installation of React Testing Library, Jest, Babel dependencies, Configuration of Babel and Parcel Config file, Jest initialization, Installation of jsdom library, Installation of @babel/preset-react, npm i -D @testing-library/jest-dom



Embark on a journey with Hunger Bites for a swift 🏃‍♂️💨, delightful 😋, and comprehensive online food ordering experience. Blending speed, functionality, and a diverse array of culinary options 🥗🍔🍣, Hunger Bites stands as your go-to platform for both quick bites and explorative dining adventures, catering to every palate and preference 🌍.