Code Monkey home page Code Monkey logo

snowrobert / mern-ecommerce Goto Github PK

View Code? Open in Web Editor NEW

This project forked from anantduhan/mern-ecommerce

0.0 1.0 0.0 17.42 MB

Built a feature-rich e-commerce app with Node.js, MongoDB, React.js, and Redux. Integrated Stripe for payments, advanced product search, an intuitive Admin Dashboard, user reviews, ratings, Wishlist, and coupon code functionality. Conducted backend unit tests with Mocha and Chai. Leveraged AWS-S3 for scalable storage of avatars and product images.

JavaScript 83.06% CSS 16.81% HTML 0.13%

mern-ecommerce's Introduction

Order Planning - An Ecommerce Platform

This full-stack e-commerce application is built using cutting-edge technologies to provide users with a seamless shopping experience. Below are some key features and technologies used in the development:

Features

  • Browse and Shop:

    • Buyers can explore store categories, products, and brands.
    • Intuitive filtering options for price, rating, and categories to enhance the search experience.
  • Admin Dashboard:

    • Comprehensive admin dashboard to manage and control various components of the store.
  • User Engagement:

    • Enabled user reviews, ratings, and Wishlist features to enhance user interaction.
  • Payment Integration:

    • Integrated Stripe for secure and convenient payment processing.
  • Additional Functionality:

    • Implemented advanced product searching and filtering functionalities.
    • Integrated coupon code functionality for discounts.
    • Seamless return and refund features for a smooth user experience.

Technologies Used

  • Backend:

    • Node.js provides the backend environment.
    • Express middleware handles requests, routes, and user authentication.
    • MongoDB with Mongoose schemas models the application data.
  • Frontend:

    • React.js for building dynamic and responsive UI components.
    • Redux for managing the application's state.
    • Redux Thunk middleware for handling asynchronous redux actions.
  • Testing:

    • Unit tests performed using Mocha and Chai in the backend to ensure robust code quality.
  • Storage:

    • AWS-S3 utilized for efficient storage of user avatars and product images, ensuring scalability and performance.

Install

Some basic git commands are:

$ git clone https://github.com/AnantDuhan/MERN-Ecommerce.git
$ cd MERN-Ecommerce
$ npm install

For Backend - npm install For Frontend - cd frontend npm install

Env Variables

Make Sure to Create a config.env file in backend/config directory that include:

  • DB_URI & JWT_SECRET_KEY & JWT_EXPIRES_IN
  • PORT, FRONTEND_URL & RESULT_PER_PAGE
  • STRIPE_PUBLISHABLE_KEY & STRIPE_SECRET_KEY
  • COOKIE_EXPIRES
  • SMTP_HOST, SMTP_PORT & SMTP_SERVICE
  • SMTP_MAIL & SMTP_PASSWORD
  • AWS_ACCESS_KEY_ID, AWS_SECRET_ACCESS_KEY, AWS_BUCKET_NAME & AWS_BUCKET_REGION

Heroku Deployment

> Create a Procfile in the root directory of your application with the following command **web: npm run start:production**

Simple build for production

$ npm run production

Run the application for development

for frontend

$ npm start

for backend

$ npm run dev

Run the application for production

$ npm run start:production

Languages & tools

Code Formatter

  • Add a .vscode directory
  • Create a file settings.json inside .vscode
  • Install Prettier - Code formatter in VSCode
  • Add the following snippet:
    {
      "editor.formatOnSave": true,
      "prettier.singleQuote": true,
      "prettier.arrowParens": "avoid",
      "prettier.jsxSingleQuote": true,
      "prettier.trailingComma": "none",
      "javascript.preferences.quoteStyle": "single",
    }

mern-ecommerce's People

Contributors

anantduhan avatar

Watchers

 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.