https://github.com/uttammane1/sephora-full-stack
Sephora Clone: A full-stack e-commerce website built with the MERN stack (MongoDB, Express, React, Node.js). 🌐✨ It mimics the Sephora experience with a responsive and interactive UI for browsing, searching, and purchasing beauty products. 🛒💄🔍
https://github.com/uttammane1/sephora-full-stack
css expressjs html5 javascript mongodb nodejs postman reactjs redux
Last synced: 11 months ago
JSON representation
Sephora Clone: A full-stack e-commerce website built with the MERN stack (MongoDB, Express, React, Node.js). 🌐✨ It mimics the Sephora experience with a responsive and interactive UI for browsing, searching, and purchasing beauty products. 🛒💄🔍
- Host: GitHub
- URL: https://github.com/uttammane1/sephora-full-stack
- Owner: uttammane1
- Created: 2024-09-06T14:31:24.000Z (over 1 year ago)
- Default Branch: main
- Last Pushed: 2025-03-08T05:10:09.000Z (about 1 year ago)
- Last Synced: 2025-03-25T06:23:40.742Z (12 months ago)
- Topics: css, expressjs, html5, javascript, mongodb, nodejs, postman, reactjs, redux
- Language: JavaScript
- Homepage: https://sephora-full-stack.vercel.app/
- Size: 5.84 MB
- Stars: 5
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Sephora Clone 🌟
## About the Project
Project Description:- Sephora Clone is a full-stack e-commerce website built using the MERN stack. This project replicates the user experience of the Sephora website, providing a seamless and interactive interface for users to browse, search, and purchase beauty products. It includes both frontend and backend components, offering a fully responsive and pleasant user interface.
You can view the deployed project here: [Sephora Clone](https://sephora-clone-pi.vercel.app/) 🚀
## Tech Stack 🛠️
- **Frontend**: React, Chakra UI
- **State Management**: Redux
- **Backend**: Node.js, Express
- **Database**: MongoDB
- **Authentication**: bcrypt, JWT
- **Packages**: npm (e.g., react-slick for carousels)
## Features ✨
- **Great UI**: Designed with Chakra UI for a modern and responsive layout.
- **Proper Routing**: Implemented to ensure smooth navigation between pages.
- **Responsive Design**: Fully adaptable to different screen sizes.
- **Search Functionality**: Allows users to search for products efficiently.
- **Sorting Options**: Helps users to sort products based on various criteria.
- **Multiproduct Page**: Displays a list of products with filtering options.
- **Single Product Page**: Provides detailed information about each product.
- **Cart Page**: Allows users to view and manage their selected items.
- **Login and Signup**: Secure authentication with JWT and password hashing with bcrypt.
## Frontend 🖥️
- Utilized **React** and **Chakra UI** to create a visually appealing and responsive user interface.
- Managed application states (login, cart, loading) using **Redux**.
- Implemented various packages via **npm**, including `react-slick` for carousel functionality.
## Backend ⚙️
- Developed server-side logic using **Node.js** and **Express**.
- Used **bcrypt** for password hashing and **JWT** for token-based authentication.
- **MongoDB** serves as the database to store user and product data.
- Sensitive information such as `MONGO_URL` and `JWT_SECRET` is protected using a `.env` file.
## Images 🖼️
### Homepage
### Multiproduct Page
### Single Product Page
### Cart Page
### Login Page
### Signup Page
