A modern e-commerce platform for generator sales built with Next.js, featuring both new and second-hand generator products with admin management capabilities.
- Product Management: Full CRUD operations for generators with image upload
- Category System: Organize products by categories
- Second-hand Products: Support for both new and used generators
- Admin Panel: Complete admin interface for product and settings management
- Responsive Design: Mobile-first responsive design with Tailwind CSS
- SEO Optimized: Built-in SEO optimization with Next SEO
- Shopping Cart: Add to cart functionality with WhatsApp integration
- Corporate References: Showcase client testimonials and references
- Contact Integration: Phone and WhatsApp contact integration
- Framework: Next.js 15.4.1 with TypeScript
- Database: PostgreSQL with Prisma ORM
- Authentication: NextAuth.js
- Styling: Tailwind CSS
- UI Components: Framer Motion for animations
- Icons: Lucide React
- File Upload: Multer for image handling
- State Management: TanStack Query (React Query)
- Node.js 18+
- PostgreSQL database
- Bun (recommended) or npm/yarn
- Clone the repository:
git clone https://github.com/sw3do/satiscore-ecommerce.git
cd satis- Install dependencies:
bun install
# or
npm install- Set up environment variables:
cp .env.example .envUpdate the .env file with your configuration:
DATABASE_URL="postgresql://username:password@localhost:5432/satis_db"
NEXTAUTH_URL="http://localhost:3000"
NEXTAUTH_SECRET="your-secret-key-here"
ADMIN_EMAIL="[email protected]"
ADMIN_PASSWORD="admin123"
SITE_URL="http://localhost:3000"
COMPANY_PHONE="+1 XXX XXX XXXX"
WHATSAPP_NUMBER="1XXXXXXXXXX"- Set up the database:
bun prisma generate
bun prisma db push- Run the development server:
bun dev
# or
npm run devOpen http://localhost:3000 to view the application.
src/
├── components/ # Reusable UI components
├── hooks/ # Custom React hooks
├── lib/ # Utility libraries (Prisma, SEO)
├── pages/ # Next.js pages
│ ├── admin/ # Admin panel pages
│ ├── api/ # API routes
│ ├── products/ # Product pages
│ └── index.tsx # Homepage
├── styles/ # CSS styles
└── types/ # TypeScript type definitions
Access the admin panel at /admin with the credentials set in your .env file:
- Products Management: Add, edit, delete products
- Categories Management: Manage product categories
- Settings: Configure site settings, company information
- File Upload: Upload and manage product images
GET /api/products- Fetch productsPOST /api/products- Create new product (admin)PUT /api/products/[id]- Update product (admin)DELETE /api/products/[id]- Delete product (admin)GET /api/settings- Fetch site settingsPUT /api/settings- Update settings (admin)
- Push your code to GitHub
- Connect your repository to Vercel
- Set environment variables in Vercel dashboard
- Deploy
- Build the application:
bun run build- Start the production server:
bun start| Variable | Description | Required |
|---|---|---|
DATABASE_URL |
PostgreSQL connection string | Yes |
NEXTAUTH_URL |
Application URL | Yes |
NEXTAUTH_SECRET |
NextAuth secret key | Yes |
ADMIN_EMAIL |
Admin login email | Yes |
ADMIN_PASSWORD |
Admin login password | Yes |
SITE_URL |
Public site URL | No |
COMPANY_PHONE |
Company phone number | No |
WHATSAPP_NUMBER |
WhatsApp number for contact | No |
- Fork the repository
- Create a feature branch
- Make your changes
- Add tests if applicable
- Submit a pull request
This project is licensed under the MIT License.
For support, please contact [email protected] or create an issue in the repository.