Urban-Trends-E-Commerce

Building an e-commerce site for a fictional company - Urban Trends

Project Overview

Urban Trends is a comprehensive, user-friendly e-commerce platform developed for a fictional retail brand as part of a university project. This project focuses on creating an effective online shopping experience, showcasing products across main fashion categories—Kids, Women, Men, and Accessories—with further subcategories for easy browsing. Users can seamlessly navigate through a clean, well-organized UI, with quick links in the footer for added convenience.

This platform demonstrates modern e-commerce capabilities, including product search and filtering by price, style, color, and promotions, backed by a dynamic backend database for real-time updates. A mobile-responsive design ensures smooth usability across devices, enhancing accessibility and user satisfaction.

Features

• Product Catalog and Categories: Products are displayed with clear category separation (Kids, Women, Men, Accessories) and additional subcategories to improve browsing.
• Search and Filter Options: Users can search products and apply filters by minimum/maximum price, style, color, and promotional offers, allowing for precise searches.
• User Authentication: Secure login and signup pages with password hashing for data protection. Users need to create an account to access the cart and wish list.
• Shopping Cart and Wish List: Items can be added or removed from the cart and wish list. These features are accessible only to registered and logged-in users.
• Responsive Design: Optimized for both desktop and mobile devices, ensuring a consistent and smooth experience.
• Visual Engagement: Carousels for bestsellers, new arrivals, and promotional banners enhance the site’s visual appeal and drive user engagement.
• Newsletter Subscription: Allows users to subscribe to personalized offers and updates from Urban Trends, helping build customer relationships.

Tech Stack

• Frontend: React, HTML, CSS
• Backend: Node.js
• Database: MySQL
• Authentication: bcrypt for secure password hashing
• Environment Management: dotenv for environment variables

Setup

1. Clone Repository

git clone https://github.com/Saniya-S/Urban-Trends-E-Commerce.git
cd Urban-Trends-E-Commerce

2. Install Dependencies

npm install

3. Set Up Environment Variables Copy .env.example to .env and fill in the required variables

4. Run the Application

npm start

5. Start the Node.js Server

node server

Acknowledgments

This project was developed as part of a university assignment, demonstrating a full-stack approach to building a dynamic e-commerce platform with a focus on usability, security, and responsiveness.