Skip to content

Latest commit

 

History

History
115 lines (74 loc) · 2.6 KB

README.md

File metadata and controls

115 lines (74 loc) · 2.6 KB
Raw

One Stop EShop (MERN-Shopping-App)

One Stop EShop - A Modern Fullstack E-commerce Website Built with the React, Redux Toolkit, Express, Tailwind CSS, Heroicons, Mongo DB and Payment Gateway.

Features

  • User Authentication and Registration using Tokens
  • Home Page for Product Listing
  • Product Listing with Pagination
  • Option to Add Item To Cart
  • Option to edit User Profile Details
  • Ability to pay for orders
  • Modern Payment Gateway using Paypal Client SDK
  • much more

Preview Link

✅ [Live] [https://one-stop-eshop.vercel.app/] 😊

Walkthrough of Payment

✅ [Overview] [https://youtu.be/QjBAAmpt8oM]

Run This Application

Following steps are required to run the application:

  • Open Terminal

  • Clone One Stop EShop Repository

    git clone https://github.com/iamsomraj/MERN-Shopping-App.git

  • Go to Root Directory of MERN-Shopping-App

  • Setup Environment Variables

To run this project, you will need to add the following environment variables to your .env.example file for both the backend and frontend folders:

Backend:

  • MONGODB_URI: Your MongoDB URI
  • PORT: Port for the backend server
  • NODE_ENV: Node environment (e.g., "development" or "production")
  • PAYPAL_CLIENT_ID: PayPal client ID
  • SECRET: Your secret key
  • PRODUCTION_CLIENT_ORIGIN: Client origin for production
  • DEVELOPMENT_CLIENT_ORIGIN: Client origin for development

Frontend:

  • VITE_NODE_ENV: Vite Node environment (e.g., "development")
  • VITE_PRODUCTION_BASE_URL: Production base URL for the frontend
  • VITE_DEVELOPMENT_BASE_URL: Development base URL for the frontend
  • VITE_PRODUCTION_API: Production API URL for the frontend
  • VITE_DEVELOPMENT_API: Development API URL for the frontend

Create these environment variables, save them in respective folders. File name can be .env.

  • Start One Stop Stop
  cd backend
  npm run dev

  cd frontend
  npm run dev

Tech Stack

Frontend:

  • React
  • Tanstack Query (React Query)
  • Tailwind
  • React Paypal SDK
  • Redux Toolkit
  • React Router DOM

Backend:

  • Node
  • Express
  • Mongoose
  • MongoDB

Language Used:

  • Typescript
  • Javascript

Developer

LinkedIn : iamsomraj 😊

Portfolio: Somraj Mukherjee 😊

Show Your Support

Give me a star ⭐

if this project helped you 👦 👧

Contributing

Pull requests are welcome. 🤝 For major changes, please open an issue first to discuss what you would like to change. 🙏

Please make sure to update tests as appropriate. ✌

License

MIT 📰