Revision-React-2

Folder Structure

E-Commerce-App

├── public
├── src
│   ├── assets
│   ├── Components
├        ├── AllRoutes.jsx
├        ├── Navbar.jsx
│   ├── Pages
├        ├── Home.jsx
├        ├── Login.jsx
├        ├── Login.css
├        ├── SingleProducts.jsx
├        ├── Products.jsx
│   ├── Context
├        ├── AuthContextProvider.jsx
│   ├── App.jsx
│   ├── App.css
│   ├── main.jsx
│   ├── index.css
├── gitignore
├── index.html
├── package-lock.json
└── package.json

Description

This is mini Project like E-Commerce Website.It is made by frontend with Chakra-UI and also for Online shopping website. In this project we have used many thing and many functionality like filter , sorting and routes.

Features

Home Page: Displays various categories, featured products, and promotional banners.
Login Page: you can login with reqres.api and password.
Logout Page: direct you can logout with toast alert.
Product Listing: Allows users to browse products by category with filters and sorting options.
Product Details: Provides detailed information about a selected product, including images, price, and description.
sorting Functionality: Users can sort by price or category.
filtering Functionality: Users can filter for products by name or category.
Cart Management: Users can add products to the cart, view cart items, and remove items from the cart.
User Authentication: Sign up, log in, and log out functionality.
Responsive Design: The application is fully responsive and works well on all devices.

Tech Stack

React.js: For building the user interface.
React Router Dom: For routing and navigation.
Netlify: For deployment.
github: For deployment.
Html: For making code .
css: For making style.
axios: For fetchin data.
js: For functionality.
Chakra UI: For Everything build style with chakra UI.

Screenshots

Installation

Follow these steps to set up the project locally:

Clone the repository:

git clone https://github.com/Rahulkrsharma2004/Revision-React-2.git
cd Revision-React-2/E-Commerce-App
npm run start