https://github.com/vikassaxena2204/quick-cart
Quick-Cart is a sleek and modern shopping app built with React.js and Tailwind-CSS. It allows users to browse a variety of products, add items to their cart, and filter products based on categories like mobile, laptop, and tablet. The app provides a seamless shopping experience with an intuitive UI and responsive design.
https://github.com/vikassaxena2204/quick-cart
react-i reactjs shopping-cart tailwindcss
Last synced: 27 days ago
JSON representation
Quick-Cart is a sleek and modern shopping app built with React.js and Tailwind-CSS. It allows users to browse a variety of products, add items to their cart, and filter products based on categories like mobile, laptop, and tablet. The app provides a seamless shopping experience with an intuitive UI and responsive design.
- Host: GitHub
- URL: https://github.com/vikassaxena2204/quick-cart
- Owner: VikasSaxena2204
- Created: 2024-12-03T17:29:30.000Z (over 1 year ago)
- Default Branch: main
- Last Pushed: 2025-01-03T08:43:37.000Z (over 1 year ago)
- Last Synced: 2025-06-22T08:48:04.091Z (12 months ago)
- Topics: react-i, reactjs, shopping-cart, tailwindcss
- Language: JavaScript
- Homepage: https://quick-cart-rho.vercel.app
- Size: 3.79 MB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Quick-Cart
**Quick-Cart** is a sleek and modern shopping app built with React. It allows users to browse various products, add items to their cart, and filter products based on categories like mobile, laptop, and tablet. The app provides a seamless shopping experience with an intuitive UI and responsive design.
---
## 🛠 Features
- **Homepage**: View a list of available products with key details like name, price, and category.
- **Product Page**: Detailed information about individual products.
- **Cart Functionality**: Add products to the cart, view them in the cart, and manage quantities.
- **Category Filters**: Easily filter products by categories (Mobile, Laptop, Tablet).
- **Responsive Design**: Fully responsive UI built with Tailwind CSS for an optimized experience across devices.
- **Dynamic Routing**: Navigation using `react-router-dom` for a single-page application (SPA) experience.
- **Icons**: Integrated `react-icons` for visually appealing icons throughout the app.
---
## 🖥️ Technologies Used
- **React**: For building a dynamic, component-based UI.
- **React Router DOM**: For managing navigation and routing within the app.
- **Tailwind CSS**: For crafting responsive and modern styling.
- **React Icons**: For beautiful and reusable icons.
---
## 🚀 Getting Started
Follow these instructions to set up and run the project locally.
### Prerequisites
Make sure you have the following installed:
- [Node.js](https://nodejs.org/)
- [npm](https://www.npmjs.com/) or [yarn](https://yarnpkg.com/)
### Installation
1. Clone the repository:
```bash
git clone https://github.com/VikasSaxena2204/Quick-Cart.git
cd Quick-Cart
2. Install dependencies and Start the development server:
```bash
npm install
npm start
3. Open your browser and navigate to http://localhost:3000.
## 🛒 Functionality Overview
- Homepage: Displays a list of products.
- Product Page: Allows users to view detailed product information.
- Cart: Enables users to add/remove items and manage cart content.
- Filters: Helps users sort products by category.
## 🧑💻 Author
- Vikas Saxena
- GitHub: VikasSaxena2204
- LinkedIn: linkedin.com/in/2204-vikas-saxena
- Portfolio: my-portfolio-vikas.vercel.app
## 📜 License
This project is licensed under the MIT License - see the LICENSE file for details.
## 🌟 Support
If you like this project, don't forget to give it a ⭐ on GitHub!
## 📸 Screenshots
### Homepage 1
### HomePage 2
### Cart Page
### Order Successful Page
