Dropship Admin

Dropship Admin is a full-stack e-commerce starter built on Next.js 13 App Router that combines a storefront, an admin dashboard, a CMS, and generated API routes in one repository.

What is Dropship Admin?

Dropship Admin is a GitHub repository for a full-stack e-commerce application built with Next.js 13 App Router, React, Tailwind CSS, Prisma, and MySQL. It takes store configuration, product data, orders, and media uploads as input and produces a customer-facing e-commerce storefront plus an admin dashboard that acts as CMS, admin panel, and API provider. The project was published by vishwavinoth and uses PlanetScale for MySQL hosting, Clerk for authentication, Cloudinary for image uploads, and Stripe for checkout.

Key Features

• Multi-store control — one admin dashboard manages multiple stores, and the CMS generates separate API routes for each store (example stores include a shoe store, laptop store, and suit store).
• Categories and products — full create, update, and delete workflows for categories, products, and product images, with multiple images per product that can be replaced.
• Filters and billboards — manage color and size filters, attach billboards (large homepage banners) to categories or use them standalone, with API routes generated for each case.
• Search and pagination — search through categories, products, sizes, colors, and billboards with included pagination.
• Featured products and analytics — mark products as "featured" for the homepage and view orders, sales, and revenue graphs in the dashboard.
• Authentication and checkout — Clerk Authentication for admin users, Stripe checkout, and Stripe webhooks for order creation.
• Tech stack — Next.js 13 App Router with Tailwind CSS, Shadcn UI, Prisma ORM, MySQL, and PlanetScale.

Who is it for?

• Developers launching a dropshipping store — they get a pre-built storefront and admin dashboard and only need to configure Clerk, Stripe, Cloudinary, and PlanetScale credentials.
• Agencies building multi-store e-commerce sites — the single CMS can manage multiple client stores with independent products, filters, billboards, and API routes.
• Next.js developers learning full-stack patterns — the project demonstrates the App Router, Prisma schema setup, Stripe webhooks, and Clerk integration in one codebase.

What can you do with Dropship Admin?

• Dropshipping entrepreneurs: set up a storefront with Stripe checkout and manage inventory, featured products, and orders from one dashboard.
• Store admin teams: add categories, products, colors, sizes, and billboards through a Shadcn UI admin interface without touching code.
• API consumers: use the generated API routes per store to build custom front-ends or connect the storefront to other services.

How does Dropship Admin work?

1. Clone the repository, install packages with npm i, and create a .env file with Clerk, Stripe, Cloudinary, database, and store front URL values.
2. Connect to PlanetScale and push the Prisma schema using npx prisma generate and npx prisma db push.
3. Start development with npm run dev and access the storefront and dashboard locally.

FAQ

Is Dropship Admin free?

The project is a public GitHub repository, so you can clone and run it yourself. Costs come from third-party services you connect: PlanetScale for MySQL, Stripe for payments, Cloudinary for image hosting, and Clerk for authentication.

What Node version do I need?

The prerequisites section specifies Node version 14.x, and commands are run through npm.

What environment variables does the template need?

The .env file needs Clerk publishable and secret keys, Clerk sign-in and sign-up URLs, a Prisma database URL, a Cloudinary cloud name, Stripe API keys, a storefront URL, and a Stripe webhook secret.