Namaste Food is an innovative online food ordering website built with ReactJS and various cutting-edge technologies. This platform offers a diverse set of features designed to elevate the user experience, including real-time email functionality, a chatbot feature, online/offline status indicators, a robust login system, and more.
- Chatbot: Enhance user interaction with a Chatbot feature powered by Botpress, providing real-time assistance within the application.
- Shimmer UI: Immerse yourself in an interactive and visually appealing UI featuring shimmer effects for a modern and engaging user experience.
- Swiggy's Live API Data: Access live data from Swiggy's API to keep users informed with the latest restaurant information, menus, and more.
- React Router DOM: Enjoy seamless routing and navigation throughout the website, ensuring a smooth user experience.
- Search-Based Restaurants Filter: Easily discover desired restaurants with the search feature, making it convenient to explore new dining options.
- Real-Time Email Using EmailJS: Stay connected and informed with real-time email capabilities powered by EmailJS, enabling the delivery of updates, promotions, and more directly to users' inboxes.
- Chatbot Feature Using Botpress: Engage users with a chatbot feature powered by Botpress, providing quick answers to common queries and improving overall user interaction.
- Online and Offline Status Indicator: Keep users informed about the website's status with online or offline indicators, ensuring they are always in the loop.
- ReactJS
- Redux Toolkit
- React Router DOM
- Formik
- Tailwind CSS
- EmailJS
- Botpress
- React Hot Toast
- Parcel Bundler
- Bundler: Parcel is used as the bundler for the application.
- Components and Hooks: Utilized functional components, inbuilt hooks (e.g., useState, useEffect, useContext), and custom hooks.
- API Integration: The application fetches restaurant lists and menus using Swiggy's Public API.
- Custom Hooks: Created custom hooks, such as useRestaurant, to retrieve a list of menu items for a selected restaurant.
- Login Page: Implemented the login page using Formik.
- Shimmer Effect: Employed Shimmer to enhance the UI, providing a user-friendly experience.
- Lazy Loading: Implemented lazy loading to optimize resource loading.
- Styling: Tailwind CSS is used for designing and styling the UI.
- Routing: React Router handles routing within the application.
- State Management: Redux Toolkit is employed for state management.
- Notification Pop-ups: Utilized react-hot-toast for notification pop-ups.
To run this project locally, follow these steps:
- Clone the repository.
- Install the required dependencies by running
npm install. - Start the development server with
npm start. - Open your browser and navigate to http://localhost:3000 to experience the app.
We welcome contributions to improve and expand the project. If you have ideas or enhancements, please submit a pull request or open an issue.
- Special thanks to Swiggy for providing live API data.
Feel free to explore, contribute, and enjoy Namaste Food, your go-to platform for food discovery and ordering.