An ecommerce store built with MERN stack, and utilizes third party API's. This ecommerce store enable three main different flows or implementations:
- Buyers browse the store categories, products and brands
- Sellers or Merchants manage their own brand component
- Admins manage and control the entire store components
- features:
- Node provides the backend environment for this application
- Express middleware is used to handle requests, routes
- Mongoose schemas to model the application data
- React for displaying UI components
- Redux to manage application's state
- Redux Thunk middleware to handle asynchronous redux actions
- Add a payment method solution to enable checkout and collecting payments
- Associate each Merchant to a payment account
This application is deployed on Heroku. Please check it out ๐ here.
See admin dashboard demo
Some basic Git commands are:
$ git clone https://github.com/mohamedsamara/mern-ecommerce.git
$ cd project
$ npm install
Create .env file that include:
* MONGO_URI & JWT_SECRET
* PORT & BASE_SERVER_URL & BASE_API_URL & BASE_CLIENT_URL
* MAILCHIMP_KEY & MAILCHIMP_LIST_KEY => Mailchimp configuration
* MAILGUN_KEY & MAILGUN_DOMAIN & MAILGUN_EMAIL_SENDER => Mailgun configuration
* GOOGLE_CLIENT_ID & GOOGLE_CLIENT_SECRET & GOOGLE_CALLBACK_URL => Google Auth configuration
* FACEBOOK_CLIENT_ID & FACEBOOK_CLIENT_SECRET & FACEBOOK_CALLBACK_URL => Facebook Auth configuration
* AWS_ACCESS_KEY_ID & AWS_SECRET_ACCESS_KEY & AWS_REGION & AWS_BUCKET_NAME => AWS configuration
> Create a Procfile in the root directory of your application with the following command **web: npm run start:production**
$ npm run production
$ npm start
$ npm run start:production
- 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",
}