Flipkart Clone using MERN Stack with proper File Structure and also follow MVC architecture. You can view live app.

Related tags

Learning resource react redux nodejs javascript ecommerce express mongodb clone react-router shop mongoose rest-api material-ui cart ecommerce-website paytm flipkart flipkart-clone
Overview

Flipkart Clone MERN APP

Dhaval Patel's Flipkart Clone is done with top-notch features for the entrepreneur startups like Flipkart.

  • It has strong authentication system with SMS OTP verification.
  • It has Paytm Integration so that it can get money from anywhere.

Features

  • Login / Signup with Mobile Number
  • SMS OTP Verification
  • Use Encryption for Password
  • Use Cookies to Authenticate User
  • One time Login (valid up to 30 days)
  • View & Update Account
  • Add / Remove Multiple Addresses
  • Add / Remove item to Cart
  • Add / Remove item to Wishlist
  • Make Order with COD / Online Payment
  • View Orders History

🚀 LIVE APP

https://flipkart-clone-js.herokuapp.com/

🖥️ Tech Stack

Client :   React, Redux, Material UI, Firebase, React Router Dom

Server :  Node, Express, Mongoose, MongoDB, JSON WEB Token, Bcrypt JS

Sneak Peek of Site

App Screenshot 1 App Screenshot 2 App Screenshot 3 App Screenshot 4 App Screenshot 5

Installation

Clone the project

  git clone https://github.com/dhavalnpatel/flipkart-clone.git

Go to the project directory

  cd flipkart-clone

For Client and Server both

Install dependencies

  npm install

Start the server

  npm run start

Environment Variables

To run this project, you will need to add the following environment variables to your .env file

Server

DB

SECRET_KEY

MERCHANT_KEY

WEBSITE

HOST_NAME

INDUSTRY_TYPE

CHANNEL_ID

Client

REACT_APP_API_KEY

REACT_APP_AUTH_DOMAIN

REACT_APP_PROJECT_ID

REACT_APP_STORAGE_BUCKET

REACT_APP_MESSAGING_SENDER_ID

REACT_APP_ID

REACT_APP_MEASUREMENT_ID

👋 Contact Me

If any query please contact on

linkedin

You might also like...

It is a solo Project and In this repo I try to build a E-Commerce full-stack website with MERN stack technologies. For Practice purpose.

Getting Started with Create React App This project was bootstrapped with Create React App. Available Scripts In the project directory, you can run: np

Aug 3, 2022

A single-page application that allows users to keep track of their books. Users can add the book details (book title and author) and also, and the books can also be removed. Built with JavaScript, HTML, and CSS

Project Name Awesome book with ES6 Description the project. This is a single page application that allows users to keep track of their books. Users ca

Oct 13, 2022

Online Inventory Control System for an apparel manufacturing company "CASANOVA" (Pvt) Ltd. Technology stack: Node.js, Express.js, MongoDB Atlas, React.js (MERN Stack).

Project Name - Online Inventory Control System for an apparel manufacturing company "CASANOVA". The project was given a "A" grade. Group Leader - IT20

Dec 26, 2021

QuizApp - A simple Quiz App app using MVC

QuizApp - A simple Quiz App app using MVC

Quiz App Hey folks! I'm still learning Swift and I made a simple app again. This

Jun 29, 2022

This repo contains the templates used in my automated obsidian weekly review video and also an accompanying vault with the folder structure expected and plugins

This repo contains the templates used in my automated obsidian weekly review video and also an accompanying vault with the folder structure expected and plugins

This repo contains the templates used in my automated obsidian weekly review video and also an accompanying vault with the folder structure expected and plugins (periodic note settings etc)

Dec 21, 2022

The app helps you to add todo items to your list, mark completed ones and also delete finished items. Its a handy tool for your day today activies. Check out the live demo.

The app helps you to add todo items to your list, mark completed ones and also delete finished items. Its a handy tool for your day today activies. Check out the live demo.

Todo List App The app helps you to add todo items to your list, mark completed ones and also delete finished items. Its a handy tool for your day toda

Apr 22, 2022

A simple To-do app project made using JavaScript ES6 and Webpack - Microverse. You can add, remove, check tasks, and remove all the tasks that were done at the same time. Feel free to see the live version, if you like it please give it a star!

To Do List a to do list javascript app buit using webpack and es6. Built With HTML CSS JavaScript Wepack Live Demo (if available) Live Demo Link Getti

Dec 17, 2022

MERN stack application which serves as an online map journal where users can mark and rate the places they've been to.

MERN stack application which serves as an online map journal where users can mark and rate the places they've been to.

PlaceRate PlaceRate is a MERN stack application which serves as an online map journal where users can mark and rate the places they've been to. You ca

May 17, 2022

Todo application is a web app that helps to organise your daily activities. It lists all the activities that you need to be completed and allows you to mark them as complete or not. Tasks can also be dragged and dropped in any position. It's a minimalistic website built using JavaScript ES6, Webpack and CSS

Todo Application Todo application is a web app that helps to organise your daily activities. It lists all the activities that you need to be completed

May 3, 2022
Owner
Dhaval Patel
Dhaval Patel
GitHub https://flipkart-clone-js.herokuapp.com/
🚀👩‍🚀This repo contains all the files to follow along and implement a MultiChain NFT MarketPlace! Be sure to watch my Youtube tutorials so you can learn and follow along!

Multi-Chain NFT Marketplace ?? ??‍?? This repo contains all the files to follow along and implement a MultiChain NFT MarketPlace! Be sure to watch my

Net2Dev 30 Jan 5, 2023
A quickstart AWS Lambda function code generator. Downloads a template function code file, test harness file, sample SAM deffiniation and appropriate file structure.

Welcome to function-stencil ?? A quickstart AWS Lambda function code generator. Downloads a template function code file, test harness file, sample SAM

Ben Smith 21 Jun 20, 2022
A social network where you can share posts, view your profile metrics and follow other users.

Getting Started with Create React App This project was bootstrapped with Create React App. Available Scripts In the project directory, you can run: np

Rui Neto 16 Aug 21, 2022
The to-do list project is an app that allows users to successfully organize their day by inputting prioritized tasks. The project also allows users to carry out the CRUD operations for (add, edit and delete). Two special features of the app are that it saves tasks in the local storage of the user's browser, so when the user reloads or revisits the app, the user can view a list of tasks formerly inputted, and it allows users to prioritize their tasks by dragging up and down the list section.

TO-DO-LIST This is a To Do List Project that dynamically displays tasks to be done with interactions for removing and adding task when completed or no

Francis Ugorji 9 Nov 1, 2021
A plugin for Strapi CMS that adds a preview button and live view button to the content manager edit view.

Strapi Preview Button A plugin for Strapi CMS that adds a preview button and live view button to the content manager edit view. Get Started Features I

Matt Milburn 53 Dec 30, 2022
A remake of the previous project (awsm-books) using proper ES6 syntax.

Awesome-Books-ES6 A remake of the previous project (awsm-books) using proper ES6 syntax. Built With: HTML CSS SCSS JavaScript Live Demo: Live Demo Get

Gabriel Fonseca 4 Jun 23, 2022
A technology stack solution using the AWS Serverless architecture.Atlas stack for building applications focused on generating value.

Atlas A technology stack solution using the AWS Serverless architecture.Atlas stack for building applications focused on generating value. Description

Atlas 9 Dec 15, 2022
In this exercise, I will write a few practical tests for JavaScript functions using the Jest library. I will make sure to follow the AAA pattern to make my tests easier for other developers to read and understand. I will also try to use the TDD approach in practice.

Testing Practices To get a local copy up and running follow these simple example steps. (NPM) Ope your terminal Navigate to the directory where you wa

Didier Peran Ganthier 5 Dec 20, 2022
This is a website for creating to-do tasks. "To-do list" is a tool that helps to organize your day. The main objective is to understand how to use proper ES6 syntax.

TO DO LIST To Do List This is a website for creating to-do tasks. "To-do list" is a tool that helps to organize your day. This project is part of the

Aleksandra Ujvari 2 Oct 3, 2022
DoMe is a ToDo App. you can add, delete and reorder elements of the todo list using drag and drop. You can also toggle between dark&light mode

DO ME Todo App Live Preview : DO ME Built With : - ReactJS - TailwindCSS Make sure you have: - Git - Nodejs version 14 or higher (we recommend using

Medjahdi Islem 5 Nov 18, 2022