Git Product home page Git Product logo

ecommerce-admin's Introduction

Full Stack E-Commerce + Dashboard & CMS: Next.js 13 App Router, React, Tailwind, Prisma, MongoDB, 2023

For DEMO, use Stripe Testing Cards

This is a repository for a Full Stack E-Commerce + Dashboard & CMS: Next.js 13 App Router, React, Tailwind, Prisma, MongoDB

Key Features:

  • We will be using Shadcn UI for the Admin!
  • Our admin dashboard is going to serve as both CMS, Admin and API!
  • You will be able to control mulitple vendors / stores through this single CMS! (For example you can have a "Shoe store" and a "Laptop store" and a "Suit store", and our CMS will generate API routes for all of those individually!)
  • You will be able to create, update and delete categories!
  • You will be able to create, update and delete products!
  • You will be able to upload multiple images for products, and change them whenever you want!
  • You will be able to create, update and delete filters such as "Color" and "Size", and then match them in the "Product" creation form.
  • You will be able to create, update and delete "Billboards" which are these big texts on top of the page. You will be able to attach them to a single category, or use them standalone (Our Admin generates API for all of those cases!)
  • You will be able to Search through all categories, products, sizes, colors, billboards with included pagination!
  • You will be able to control which products are "featured" so they show on the homepage!
  • You will be able to see your orders, sales, etc.
  • You will be able to see graphs of your revenue etc.
  • You will learn Clerk Authentication!
  • Order creation
  • Stripe checkout
  • Stripe webhooks
  • MongoDB + Prisma

Prerequisites

Node version 14.x

Cloning the repository

git clone https://github.com/Korabi123/ecommerce-admin.git

Install packages

npm i

Setup .env file

# This was inserted by `prisma init`:
# Environment variables declared in this file are automatically made available to Prisma.
# See the documentation for more detail: https://pris.ly/d/prisma-schema#accessing-environment-variables-from-the-schema

# Prisma supports the native connection string format for PostgreSQL, MySQL, SQLite, SQL Server, MongoDB and CockroachDB.
# See the documentation for all the connection string options: https://pris.ly/d/connection-strings

DATABASE_URL=""


# Clerk Auth
NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY=
CLERK_SECRET_KEY=
NEXT_PUBLIC_CLERK_SIGN_IN_URL=/sign-in
NEXT_PUBLIC_CLERK_SIGN_UP_URL=/sign-up
NEXT_PUBLIC_CLERK_AFTER_SIGN_IN_URL=/
NEXT_PUBLIC_CLERK_AFTER_SIGN_UP_URL=/

# Next-Cloudniary
NEXT_PUBLIC_CLOUDINARY_CLOUD_NAME=""

# Stripe
STRIPE_API_KEY=
STRIPE_WEBHOOK_SECRET=

# Front End Store
FRONTEND_STORE_URL=

Connect to MongoDB and Push Prisma

npx prisma generate
npx prisma db push

Start the app

npm run dev

Available commands

Running commands with npm npm run [command]

command description
dev Starts a development instance of the app

ecommerce-admin's People

Contributors

korabi123 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.