A feature-rich food browsing web application built with Vite and React, styled using Tailwind CSS. This app allows users to browse food items, filter by origin, and sort items, all managed with the Context API.
The Foodie React App is designed to help users explore various food items using TheMealDB API, filter by origin, and sort by alphabetical order. It leverages React's Context API for state management, making data handling efficient across components.
- Responsive Design: Optimized for both desktop and mobile.
- Filter & Sort Options: Users can filter food items by origin and sort them alphabetically.
- Vite + React: Provides a fast development experience.
- Tailwind CSS: Enables efficient styling.
- Context API: Centralized state management.
- React Icons: Adds visual appeal with a library of icons.
-
Clone the repository:
git clone https://github.com/girish104/foodie-react-app.git
-
Navigate into the project folder:
cd foodie-react-app
-
Install dependencies:
npm install npm install react-icons
-
Run the application:
npm run dev
- Browse Food Items: View a range of food items with images, names, and descriptions.
- Filter by Origin: Filter the displayed food items by their country of origin.
- Sort Options: Sort items alphabetically