DEV Community

Narottam04
Narottam04

Posted on

Storebay: An E-commerce Application With Custom Admin And Checkout functionality

Overview of My Submission

Storebay is an E-Commerce platform. It is built on the MERN stack (MongoDB, Express, React, Node js). It has features like a custom admin panel to manage users, PayPal checkout, reviews,android and ios app and more.

Submission Category:

E-Commerce

Link to Code

MongoDB Atlas Hackathon

Storebay: A cross-platform ecommerce application [Android, IOS, Web]

Overview of My Submission

Storebay is an E-Commerce platform. It is built on the MERN stack (MongoDB, Express, React, Node js). It has features like a custom admin panel to manage users, PayPal checkout, reviews,android and ios app and more.

Submission Category:

E-Commerce

Live Url 🎉🎉🥳

https://storebayapp.herokuapp.com/

Main Tech Stack

React - For Frontend Tailwind CSS - For Styling Node Js, Express - For Backend PayPal : For Payment MongoDB Atlas : For Database MongoDB Atlas Search : For autocomplete search functionality Capacitor Js: For converting existing web app to android and ios

Installation Guide

Step 1: Clone Github Repository

git clone https://github.com/Narottam04/StoreBay.git
Enter fullscreen mode Exit fullscreen mode

Step 2: Install dependencies in backend and frontend on root of the folder

npm install
Enter fullscreen mode Exit fullscreen mode
cd frontend
npm install 
Enter fullscreen mode Exit fullscreen mode

Step 3 : Add .env

NODE_ENV = development/production
PORT = 5000
MONGO_URI = ADD_YOUR_MONGO_URI
JWT_SECRET
Enter fullscreen mode Exit fullscreen mode

Live Url 🎉🎉🥳

https://storebayapp.herokuapp.com/

Main Tech Stack

React - For Frontend
Tailwind CSS - For Styling
Node Js, Express - For Backend
PayPal : For Payment
MongoDB Atlas : For Database
MongoDB Atlas Search : For autocomplete search functionality
Capacitor Js: For converting existing web app to android and ios

App Preview & Features

HomePage

Home Page
Home Page

Login Page

Login and Sign up is created using Node Js && MongoDB

Login Page

Login Page

Profile Page

Profile Page

Admin Page

Using a custom admin panel, a user can make other users admins, manage products, add new ones, update existing ones, and mark a delivery as successful.

Admin Page
Admin Page

Admin Page

Product overview

Product

Reviews

Each signed in user can only add one review per products.

review

Cart

Cart

Checkout Process

Step1

User must add their shipping address for step 1

Checkout1

Step2

User must choose a payment method. Currently only paypal payment method is working

Checkout2

Step 3

Step 3 is order summary where you can view your product,shipping and payment details

Step 4 [IMP]

Payment using paypal

Checkout3
Checkout4

Checkout5

That's all folks, I hope you enjoy this project

Discussion (0)