City Sling E-com Website Overview
Project Images :-
Project Description :-
The CitySling Bag E-Commerce Website is a fully functional online store that offers a wide range of stylish and affordable bags for men, women, kids, and travel enthusiasts. Built with a robust full-stack architecture, this project ensures seamless shopping experiences while maintaining security, performance, and user-friendly navigation. The website allows users to browse through an extensive collection of bags, add items to their cart, and securely place orders. It features user and admin authentication, secure password encryption, and email verification to ensure data privacy and protection. The admin panel enables efficient product management, order tracking, and user management. With JWT authentication, the system ensures safe login sessions, while flash messages provide real-time alerts for a smooth user experience. The website follows the MVC (Model-View-Controller) architecture, ensuring a clean and scalable codebase. Data is stored in MongoDB Atlas, while images are securely uploaded using Multer. This project is a perfect blend of modern technologies and best development practices, making it a highly scalable and secure e-commerce platform.
Key Features :-
- Secure JWT-based authentication for users and admin.
- Bcrypt password encryption to ensure user data protection.
- Email verification to validate users before they can access their accounts.
1. User Authentication & Security
- Users can browse categories: Mens Bags, Womens Bags, Kids Bags, and Trolley Bags.
- View product details with high-quality images and descriptions.
- Add items to the shopping cart and proceed to checkout.
- Receive flash messages for login, registration, and order updates.
2. User Dashboard & Shopping Experience
- Manage products (add, edit, delete bags from inventory).
- View and manage users (approve, delete, or restrict user access).
- Track orders and update order statuses.
- Monitor website performance and customer activity.
3. Admin Dashboard
- Multer for image encoding and secure storage.
- Efficiently handles large image uploads without performance issues.
4. Image Handling & Storage
- Users receive instant flash messages for login/logout, cart updates, and order confirmations.
5. Flash Messages & Alerts
- Nodemon for development (auto-reloading for better efficiency).
- Dotenv for environment variables, keeping API keys and sensitive data secure.
6. Development & Deployment
Technology Use :-
- EJS (Embedded JavaScript) - For dynamic rendering of pages.
- Tailwind CSS - For fast, efficient, and responsive styling.
Frontend:
- Node.js - For building the backend logic and APIs.
- Express.js - For handling server-side routes and requests.
Backend:
- MongoDB Atlas - For storing user data, products, and orders.
- Mongoose - For efficient data handling and schema validation.
Database & Storage:
- JWT (JSON Web Token) - For secure authentication.
- Bcrypt - For hashing and encrypting passwords.
- Multer - For secure image upload and encoding.
- Dotenv - For managing environment variables securely.
Authentication & Security:
- Flash Messages - For real-time user notifications.
- Config Package - For easy management of configurations.
Admin & User Management:
- Nodemon - For auto-reloading during development.
- MVC Architecture - Ensuring a structured, maintainable, and scalable codebase.