E-Commerce Website
This is a full-stack e-commerce website built using the MERN stack (MongoDB, Express.js, React, Node.js). The application includes functionalities such as a shopping cart, payment processing, real-time notifications, and secure user authentication.
Features
-
Shopping Cart: Manage and review items in the shopping cart.
-
Payment Integration: Secure payment processing using Razorpay.
-
Real-Time Notifications: Receive live updates and alerts.
-
User Authentication: Secure login and registration using JWT and OAuth.
-
Email Notifications: Automated emails for order confirmation and updates.
-
State Management: Efficient state management using Redux.
Tech Stack
-
Frontend:
-
React: JavaScript library for building user interfaces.
-
Tailwind CSS: Utility-first CSS framework for styling.
-
Material UI (MUI): React component library for modern UI design.
-
Redux: State management library for handling complex application state.
-
Backend:
-
Node.js: JavaScript runtime for server-side development.
-
Express.js: Web application framework for Node.js to build the API.
-
Database:
-
Payment Gateway:
-
Razorpay: Payment gateway for processing transactions securely.
-
Modules:
-
JWT: JSON Web Tokens for user authentication.
-
OAuth: Authorization framework for secure access.
-
Bcrypt: Password hashing for security.
-
UID: Generating unique identifiers.
-
Nodemailer: Email sending library for notifications.
-
Session: Session management for user sessions.
Installation
Frontend
-
Clone the repository:
git clone https://github.com/saurabhkumardev/recycle.git
-
Navigate to the frontend directory:
cd recycle/frontend
-
Install dependencies:
npm install
Backend
-
Navigate to the backend directory:
cd recycle/backend
-
Install dependencies:
npm install
-
Create a .env file in the backend directory and add your environment variables. For example:
MONGO_URI=your_mongodb_atlas_connection_string
JWT_SECRET=your_jwt_secret
RAZORPAY_KEY=your_razorpay_key
RAZORPAY_SECRET=your_razorpay_secret
Usage
-
Start the backend server:
cd recycle/backend
npm start
-
Start the frontend development server:
cd recycle/frontend
npm start
-
Open your browser and visit http://localhost:3000
to access the application.
Deployment
- Frontend: Deployed on Netlify. Visit [your-frontend-netlify-url] to view the live application.
- Backend: Deployed on Cyclic. Visit [your-backend-cyclic-url] to access the backend services.
Contributing
-
Fork the repository.
-
Create a new branch:
git checkout -b feature/your-feature
-
Commit your changes:
git commit -m "Add your commit message"
-
Push to the branch:
git push origin feature/your-feature
-
Create a pull request with a description of your changes.