TasteBit Express is a comprehensive project developed using React and Parcel bundler. It serves as an educational platform aimed at providing an in-depth understanding of various concepts related to React, a popular JavaScript library for building user interfaces.
- About The Project
- Table of Contents
- Demo Video
- Live Website
- Description
- Technologies Used
- What I've Learned
- π Main Features
- π Pages
- π Getting Started
Watch the demo video to see the portfolio website in action:
TasteBit-Express.mp4
Visit the live website to explore your Taste: Website
TasteBit Express revolutionizes the online food ordering experience by seamlessly integrating the Swiggy API to provide users with access to a diverse array of restaurants and cuisines. From the enticing visuals and detailed descriptions on the Restaurant Card Page to the streamlined checkout process on the Cart Page, every aspect of TasteBit Express is meticulously designed to offer convenience, reliability, and satisfaction. Whether users are exploring new dining options on the Restaurant Menu Page, learning about the platform's mission and values on the About Page, or reaching out to the team for support on the Contact Page, TasteBit Express prioritizes user experience, engagement, and accessibility. With features like secure authentication on the Login Page and informative error handling on the 404 Error Page, TasteBit Express ensures a seamless and enjoyable journey for every user, reaffirming its commitment to culinary excellence and customer satisfaction.
The website is built using the following technologies:
Throughout the development of TasteBit Express, I've gained proficiency in various aspects of React and its ecosystem. Here's a summary of what I've learned:
- Utilizing Parcel bundler for efficient project setup and management.
- Implementing client-side routing with react-router-dom to create dynamic, single-page applications.
- Mastering the use of React hooks for state management, side effects, and context sharing.
- Exploring UI libraries like ShimmerUI to enhance the visual appeal and user experience of applications.
- Integrating Redux for centralized state management in complex React applications.
- Leveraging Tailwind CSS for rapid UI development and responsive design.
- Writing unit tests using Jest to ensure the reliability and stability of React components and functions.
- And much more, including understanding the core concepts of React, working with functional and class components, managing component lifecycle, handling events, and organizing code efficiently.
Throughout this journey, I've not only gained theoretical knowledge but also practical experience in building robust, interactive web applications using React and its associated technologies.
-
Location - Based Restaurant Suggestions - Discover nearby restaurants tailored to your location for a personalized dining experience.
-
Live Data - Access real-time updates on restaurant availability, menu items, and delivery times.
-
User-Friendly UI - Enjoy a seamless browsing experience with our intuitive and easy-to-navigate interface.
-
Responsive Design - Access TasteBit Express from any device - desktop, tablet, or mobile - with consistent performance and layout.
-
Customizable Orders - Tailor your orders with special instructions and dietary preferences to ensure a personalized dining experience.
From the project folder, run these commands in the console (terminal) to install dependencies and run the app:
# Install the dependencies
npm install
# Run the app
npm run dev
# or
# Install the dependencies
yarn add
# Run the app
yarn dev