Shopster is a shopping cart interface developed as a part of my front-end internship at Foothill Technology Solutions. The application allows users to browse a variety of products, add them to a shopping cart, view cart details, remove items, and proceed to checkout. This project showcases my ability to manage state using React Contexts, Reducers, and Providers.
- Product Grid: Displays products in a grid format with name, image, and price.
- Add to Cart: Allows users to add products to the shopping cart.
- Cart Details: Lists all items added to the cart.
- Item Removal: Provides an option to delete individual items from the cart.
- Total Amount: Displays the cumulative price of the items in the cart.
- Checkout: Includes a form for users to input their name and email for order submission.
- Search Feature: Enables users to search for products by name.
-
Clone the Repository
git clone https://github.com/Jamal-SaadEddin/Shopster.git
-
Navigate to the Project Directory
cd Shopster -
Install Dependencies
npm install
-
Start the Application
npm start
The application will run on
http://localhost:3000
- React: JavaScript library for building user interfaces
- Material-UI (MUI): React components for faster and easier web development
- React Router: Library for routing in React applications
- This task is part of the Foothill Technology Solutions Internship Cycle.
- Big thanks to my trainer @Huthaifa
Thank you for visiting my project! Feel free to star or contribute to the repository if you find it useful.