https://github.com/alekrish-12/ecommerce-app

Shopping Website (Frontend) - Forever Shopping is a user-friendly e-commerce platform built with React.js (or Angular). It features easy login, product search, pagination, and a simple cart system. The responsive design ensures smooth browsing on all devices, with role-based access for personalized experiences. http://localhost:5173/
https://github.com/alekrish-12/ecommerce-app

config css3 github-config html5 javascript jsx node-module package-json reactjs tailwind-css vite

Last synced: about 1 month ago
JSON representation

Shopping Website (Frontend) - Forever Shopping is a user-friendly e-commerce platform built with React.js (or Angular). It features easy login, product search, pagination, and a simple cart system. The responsive design ensures smooth browsing on all devices, with role-based access for personalized experiences. http://localhost:5173/

• Host: GitHub
• URL: https://github.com/alekrish-12/ecommerce-app
• Owner: Alekrish-12
• Created: 2024-09-13T16:37:24.000Z (4 months ago)
• Default Branch: main
• Last Pushed: 2024-09-13T20:21:31.000Z (4 months ago)
• Last Synced: 2024-10-12T19:42:49.495Z (3 months ago)
• Topics: config, css3, github-config, html5, javascript, jsx, node-module, package-json, reactjs, tailwind-css, vite
• Language: JavaScript
• Homepage: http://localhost:5173/
• Size: 8.33 MB
• Stars: 1
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# **E-commerce Website**

## **Overview**

This project is a front-end eCommerce web application built using React.js and Tailwind CSS. It offers a seamless user experience for customers to browse products, manage carts, place orders, and access their accounts. It also provides an admin interface for product and order management. The website includes features like authentication, product filtering, sorting, and search.

## **Features**

### **Customer Features**

- **Home Page:** Displays the latest products, best-selling products, a newsletter subscription box, and a footer.

![Screenshot (140)](https://github.com/user-attachments/assets/906ef785-c6c3-405c-896a-5ae3e7244022)

- **Product Collection Page:** Displays all products with filter, sort, and search functionalities.

  ![Screenshot (141)](https://github.com/user-attachments/assets/d1c8daf0-43ee-4722-8fbd-beb2ea67a4db)

- **Product Page:** Shows product details such as image gallery, title, price, description, add-to-cart button, and related products.

- **Cart Page:** View items in the cart, adjust quantities, and remove items.

  ![Screenshot (145)](https://github.com/user-attachments/assets/90019ddf-e860-4ed3-a1a1-cf3fcdce6409)

- **Place Order Page:** Finalize and place orders based on the cart contents.

  ![Screenshot (144)](https://github.com/user-attachments/assets/b9438b54-7c80-4f81-8734-3809ba503dc1)

- **My Order List Page:** View the history of placed orders.

- **Login & Signup Pages:** 

  - **Signup Page:** New users can create an account by providing necessary details.

  ![Screenshot (148)](https://github.com/user-attachments/assets/07b37fd0-c5cd-4d4f-9c99-a47e2c763108)

  - **Login Page:** Registered users can log in to access their accounts, view order history, and manage their profiles.

    ![Screenshot (149)](https://github.com/user-attachments/assets/203258e3-f48f-4537-aabf-6f20e1b504fd)

- **Additional Pages:** 

  - **About Page:** Provides information about the company.

    ![Screenshot (146)](https://github.com/user-attachments/assets/03d9120c-0010-46c8-8a28-5ee81003c694)

  - **Contact Page:** Users can contact the company for inquiries or support.

    

## **Technologies Used**

- **Frontend:** React.js

- **Styling:** Tailwind CSS

- **State Management:** React Context API or Redux (if applicable)

## **Getting Started**

### **Prerequisites**

- Node.js installed on your system.

### **Installation**

1. Clone the repository:

   

   git clone [https://github.com/Alekhya-12/ecommerce-website.git](http://localhost:5173/)

2. Navigate to the project directory:

   cd .\frontend\

3. Install dependencies:

  

   npm install

### **Running the App**

1. Start the application:

 

   npm run dev

2. Open [http://localhost:5173/] in your browser to view the app.

## **Project Structure**

- **Login & Signup Pages:** Enable user authentication. The signup page allows new users to create accounts, while the login page grants access to existing users. The authentication flow ensures secure access to customer features like cart, order history, and profile management.

- **Home Page:** Highlights product categories, featured products, and a newsletter subscription.

- **Products Collection Page:** Displays all products with filter, search, and sort functionalities.

- **Product Page:** Detailed product view with image gallery and related products.

- **Cart and Order Pages:** Manage cart items and place orders.

- **Admin Panel:** Provides admin functionalities for product and order management.

## **Contributing**

Contributions are welcome! Feel free to submit issues or pull requests.

## **License**

This project is licensed under the MIT License.

---

This version includes more details about the login and signup pages and their role in user authentication and account management.