A full-featured, modern e-commerce platform built with Next.js 15, featuring a complete shopping experience with admin dashboard, user management, and multiple payment options.
- Product Browsing: Browse products with advanced filtering and search
- Shopping Cart: Add/remove items with persistent cart across sessions
- User Authentication: Secure login/register with NextAuth.js
- Order Management: Complete checkout process with order tracking
- Product Reviews: Rate and review products with verified purchase badges
- Responsive Design: Optimized for desktop, tablet, and mobile devices
- Dark/Light Mode: Theme switching with system preference detection
- Multiple Payment Methods: PayPal, Stripe, and Cash on Delivery
- Secure Transactions: PCI-compliant payment processing
- Order Confirmation: Email receipts and order confirmations
- Product Management: Create, edit, and manage product inventory
- Order Management: View and update order status
- User Management: Manage customer accounts and roles
- Analytics Dashboard: Sales overview and performance metrics
- Inventory Tracking: Real-time stock management
- Role-based Access Control: Admin and user role management
- Protected Routes: Secure checkout and admin areas
- Session Management: Persistent login sessions
- Password Encryption: Secure password hashing
- Next.js 15 - React framework with App Router
- React 19 - Latest React features
- TypeScript - Type-safe development
- Tailwind CSS - Utility-first CSS framework
- Radix UI - Accessible component primitives
- Lucide React - Beautiful icons
- Next Themes - Dark/light mode support
- Prisma ORM - Type-safe database client
- PostgreSQL - Robust relational database
- Neon Database - Serverless PostgreSQL
- NextAuth.js - Authentication solution
- Stripe - Credit card processing
- PayPal - PayPal payments integration
- UploadThing - File upload service
- Resend - Email delivery service
- React Email - Email template system
- Jest - Testing framework
- ESLint - Code linting
- TypeScript - Static type checking
- Zod - Schema validation
- Node.js 18+
- npm or yarn
- PostgreSQL database (or Neon account)
-
Clone the repository
git clone https://github.com/rumduth/ProStore.git cd ProStore -
Install dependencies
npm install
-
Environment Setup Create a
.env.localfile in the root directory:# Database DATABASE_URL="your_postgresql_connection_string" # NextAuth NEXTAUTH_SECRET="your_nextauth_secret" NEXTAUTH_URL="http://localhost:3000" # Payment Providers PAYPAL_CLIENT_ID="your_paypal_client_id" PAYPAL_CLIENT_SECRET="your_paypal_client_secret" STRIPE_PUBLISHABLE_KEY="your_stripe_publishable_key" STRIPE_SECRET_KEY="your_stripe_secret_key" STRIPE_WEBHOOK_SECRET="your_stripe_webhook_secret" # File Upload UPLOADTHING_SECRET="your_uploadthing_secret" UPLOADTHING_APP_ID="your_uploadthing_app_id" # Email RESEND_API_KEY="your_resend_api_key" SENDER_EMAIL="your_sender_email" # App Configuration NEXT_PUBLIC_APP_NAME="ProStore" NEXT_PUBLIC_APP_DESCRIPTION="A modern ecommerce store built with NextJs" NEXT_PUBLIC_SERVER_URL="http://localhost:3000" # Default Test Credentials (Development) DEFAULT_TEST_EMAIL="[email protected]" DEFAULT_TEST_PASSWORD="123456" DEFAULT_TEST_NAME="Admin User" # Payment Methods (comma-separated) PAYMENT_METHODS="PayPal, Stripe, CashOnDelivery" DEFAULT_PAYMENT_METHOD="PayPal" # Pagination PAGE_SIZE="10" LATEST_PRODUCTS_LIMIT="4" # User Roles USER_ROLES="admin, user"
-
Database Setup
# Generate Prisma client npx prisma generate # Run database migrations npx prisma migrate dev # Seed the database with sample data npm run seed
-
Start the development server
npm run dev
-
Open your browser Navigate to http://localhost:3000
- Email: [email protected]
- Password: 123456
pro-store/
├── app/ # Next.js App Router
│ ├── (auth)/ # Authentication pages
│ ├── (root)/ # Public pages
│ ├── admin/ # Admin dashboard
│ ├── api/ # API routes
│ └── user/ # User account pages
├── components/ # Reusable components
│ ├── admin/ # Admin-specific components
│ ├── shared/ # Shared components
│ └── ui/ # UI components (Radix UI)
├── lib/ # Utility functions
│ ├── actions/ # Server actions
│ └── constants/ # App constants
├── prisma/ # Database schema and migrations
├── public/ # Static assets
├── types/ # TypeScript type definitions
└── tests/ # Test files
Run the test suite:
# Run all tests
npm test
# Run tests in watch mode
npm run test:watchThe project includes responsive email templates for:
- Order confirmations
- Purchase receipts
- Account notifications
Preview emails in development:
npm run emailnpm run dev- Start development servernpm run build- Build for productionnpm run start- Start production servernpm run lint- Run ESLintnpm test- Run testsnpm run email- Preview email templatesnpx prisma studio- Open Prisma Studio (database GUI)
- Persistent cart across browser sessions
- Automatic cart merging when users log in
- Real-time price calculations including tax and shipping
- Multi-step checkout process
- Address validation
- Payment method selection
- Order confirmation emails
- Real-time sales analytics
- Product inventory management
- Order status updates
- User role management
- Protected API routes
- Role-based access control
- Secure payment processing
- Input validation with Zod
- Fork the repository
- Create a feature branch (
git checkout -b feature/amazing-feature) - Commit your changes (
git commit -m 'Add some amazing feature') - Push to the branch (
git push origin feature/amazing-feature) - Open a Pull Request
This project is licensed under the MIT License - see the LICENSE file for details.
- Next.js for the amazing React framework
- Prisma for the excellent ORM
- Tailwind CSS for the utility-first CSS framework
- Radix UI for accessible component primitives
- Stripe and PayPal for payment processing
If you have any questions or need help with setup, please open an issue on GitHub.
Built with ❤️ using Next.js and modern web technologies