Med1233/NutriShop

★ 0Forks 0TypeScriptGitHub ↗Compare

README

NutriShop

A full-stack e-commerce platform for nutrition products, built with Next.js, Express, and PostgreSQL.

Features

  • Product Catalog — Browse, search, and filter nutrition products by category
  • Shopping Cart — Guest cart (localStorage) with automatic merge on login
  • Order Management — Place orders, track status, manage stock
  • Authentication — Email/password + Google OAuth, email verification via Resend
  • Role-Based Access — Customer, Manager, Stockist, and Admin roles
  • AI Chatbot — NutriBot powered by Claude, with product and order context
  • Internationalization — English, French, and Arabic (RTL) support
  • Design System — Shared @nutrishop/ui component library with Storybook

Tech Stack

Layer Technology
Frontend Next.js 14 (App Router), TypeScript, Tailwind CSS
Backend Express.js, Node.js
Database PostgreSQL 16
Design System React, Tailwind CSS, Storybook, Vitest
Auth JWT (HttpOnly cookies), Google OAuth 2.0
Email Resend API
AI Claude Haiku 4.5 (SSE streaming)
Testing Vitest, Cypress + Gherkin, Testing Library
CI/CD GitHub Actions (7 workflows), Docker
Deployment DigitalOcean, Nginx, Let's Encrypt SSL

Quick Start

Prerequisites

1. Clone and configure

git clone https://github.com/your-username/nutrishop.git
cd nutrishop
cp .env.example .env   # Edit with your credentials

2. Start development

docker-compose -f docker-compose.dev.yml up

3. Start production

docker-compose up --build

Environment Variables

Create a .env file in the project root:

# Database
POSTGRES_USER=admin
POSTGRES_PASSWORD=password
POSTGRES_DB=appdb
DATABASE_URL=postgresql://admin:password@postgres:5432/appdb

# Auth
JWT_SECRET=your-random-64-char-string
JWT_REFRESH_SECRET=another-random-64-char-string

# Google OAuth
GOOGLE_CLIENT_ID=
GOOGLE_CLIENT_SECRET=
GOOGLE_CALLBACK_URL=http://localhost:4000/api/auth/google/callback

# URLs
FRONTEND_URL=http://localhost:3000

# Default admin account
ADMIN_EMAIL=[email protected]
ADMIN_PASSWORD=your-admin-password
ADMIN_NAME=Admin

# AI Chatbot
ANTHROPIC_API_KEY=

# Email verification
RESEND_API_KEY=
EMAIL_FROM=NutriShop <[email protected]>

Project Structure

nutrishop/
├── frontend/                  # Next.js 14 App Router
├── backend/                   # Express API server
├── packages/ui/               # @nutrishop/ui design system
├── e2e/                       # Cypress E2E tests (Gherkin)
├── docs/                      # Documentation
├── .github/workflows/         # CI/CD (7 workflows)
├── docker-compose.yml         # Production
├── docker-compose.dev.yml     # Development (hot-reload)
└── docker-compose.test.yml    # Test database

Testing

# UI component tests
pnpm --filter @nutrishop/ui test

# Frontend tests
pnpm --filter frontend test

# Backend tests (start test DB first)
docker-compose -f docker-compose.test.yml up -d
pnpm --filter backend test

# E2E tests (start full stack first)
docker-compose -f docker-compose.dev.yml up -d
cd e2e && pnpm cypress:run
Layer Framework Tests
UI Components Vitest + Testing Library 57
Frontend Vitest + Testing Library 41
Backend Unit Vitest 25
Backend Integration Vitest + Supertest 44
E2E Cypress + Gherkin 8 features, 26 scenarios

Linting & Formatting

pnpm lint          # ESLint check
pnpm lint:fix      # Auto-fix
pnpm format        # Format with Prettier
pnpm format:check  # Check formatting

Design System

The @nutrishop/ui package provides shared components used by the frontend.

pnpm --filter @nutrishop/ui storybook   # Launch Storybook on port 6006

Components include: Button, Input, Card, Badge, Table, Tabs, Alert, FormField, EmptyState, FilterPills, and more.

Documentation

Full documentation is available in docs/

npx docsify-cli serve docs --port 4500
Section Topics
Architecture System diagram, services, data flow
Authentication JWT, OAuth, roles, sessions
Internationalization EN, FR, AR with RTL
Frontend Pages, hooks, API client
Backend Routes, middleware, database
E-Commerce Products, cart, orders, stock
Testing All test layers and strategies
Design System Components, Storybook
CI/CD GitHub Actions workflows
Deployment DigitalOcean, Nginx, SSL
AI Chatbot NutriBot, Claude, SSE
Email Verification Resend, verification flow

License

This project is private and not licensed for public use.

Contributors

Med1233

Issues