Overview

The open-source Next.js E-Commerce Storefront with Admin Panel project offers a powerful solution for building and managing e-commerce websites using TypeScript, Tailwind CSS, and Prisma. With features such as an admin dashboard, dynamic sitemap generation, and file uploads using next-cloudinary, this project provides flexibility and functionality for e-commerce development.

Features

• Next.js 14 App Router and React Server Components
• Custom dynamic Sitemap.xml generation
• Admin dashboard with products, orders, and payments
• File uploads using next-cloudinary
• Authentication using middleware.ts and httpOnly cookies
• Storefront with blog, products, and categories
• Database-Stored blogs powered by MDX templates
• Email verification and invoices using react-email-tailwind-templates
• TailwindCSS for utility-first CSS
• UI built with Radix and stunning UI components from shadcn/ui
• Type-Validation with Zod
• Next Metadata API for SEO handling
• Comprehensive implementations for i18n

Installation

1. Clone the repository.
2. Navigate to each folder in the apps folder (admin and storefront) and set the variables.
3. Install dependencies using npm install.
4. Push the database schema to bring your database to life using bun run db.
5. Set the DATABASE_URL in your .env file for Prisma ORM to work with any PostgreSQL database.
6. Modify the prisma/schema.prisma file for database schema changes.

Summary

The Next.js E-Commerce Storefront with Admin Panel project combines technologies like TypeScript, Tailwind CSS, and Prisma to provide a robust solution for e-commerce website development. With features ranging from authentication and UI components to database management and SEO handling, this project offers a comprehensive toolkit for building and managing online stores. The project’s modular structure with separate admin and storefront apps allows for flexible deployment options, while its open-source nature and MIT license make it a versatile choice for developers looking to create customized e-commerce solutions.