Ordering System

Sistema de pedidos para restaurantes o negocios de comida: Los meseros son asistidos por una carta y anotan(para consumir en el local o llevar), mientras que en cocina se registran en tiempo real todos esos pedidos a preparar.

Flujo Principal:

1. El mesero accede al menú.
2. Explora y selecciona insumos.
3. Agrega insumos al carrito.
4. Ordena el pedido.
5. Cocina recibe y prepara el pedido.
6. El estado del pedido se actualiza en tiempo real desde cocina o caja.

Características

• Menú del cliente: catálogo de insumos por categoría, búsqueda por nombre y paginación.
• Carrito y listado de pedidos: pedidos de tipo local (LOCAL) o para llevar (TAKEAWAY) y listado de ordenes pendientes y finalizadas.
• Panel de insumos: gestión de insumos (con subida de imágenes a Cloudinary), categorías y pedidos, con filtros por estado y rango de fechas.
• Tiempo real: streams SSE para el estado del negocio (abierto/cerrado), actualizaciones de precios, nuevos pedidos e insumos disponibles.
• Autenticación: login/registro con JWT + refresh token en cookies httpOnly y sesiones persistidas.
• Roles y suscripciones: USER, ADMIN y planes de suscripción (FREE_TRIAL, MONTHLY, SEMI_ANNUAL, ANNUAL).

Stack tecnológico

Capa	Tecnologías
Frontend
Backend
Infra

Estructura del proyecto

ordering-system/
├─ backend/
│  ├─ prisma/
│  │  ├─ schema.prisma          # Modelo de datos
│  │  ├─ migrations/            # Migraciones SQL
│  │  └─ seed.ts                # Datos iniciales
│  └─ src/
│     ├─ cloudinary/            # Servicios de cloudinary.
│     ├─ common/                # Filtros, interceptores, decoradores
│     ├─ config/                # Configuración por entorno (@nestjs/config)
│     ├─ features/*				  # Módulos de dominios (auth, orders, supplies, etc)
│     └─ main.ts                # Bootstrap (prefix /api, CORS, filtros)
│
└─ frontend/
   └─ src/
      ├─ components/            # UI (shadcn/ui + componentes propios)
      ├─ hooks/                 # Data fetching (TanStack Query).
      ├─ interfaces/            # Interfaces y tipos del frontend
      ├─ lib/                   # Utilidades y configuraciones compartidas
      ├─ pages/                 # Vistas por ruta
      ├─ schemas/               # Esquemas zod para formularios.
      ├─ services/              # Funciones para peticiones a backend.
      ├─ skeletons/             # Estados de carga de componentes
      ├─ stores/                # Estado global (Zustand)
      └─ interfaces/            # Tipos compartidos con el API

Requisitos previos

• Node.js >= 20
• pnpm >= 9
• Docker (solo para el Postgres local de respaldo) o una base Supabase

Puesta en marcha

1. Instalar dependencias

pnpm install

Si ya existía un lockfile desactualizado, usa pnpm install --force.

2. Configurar variables de entorno

Backend:

cp backend/.env.example backend/.env

Frontend:

cp frontend/.env.example frontend/.env

Completa los valores según la sección Variables de entorno.

3. Base de datos

La conexión se define en backend/.env mediante DATABASE_URL.

Opción A — Supabase (principal): pega tu connection string (session pooler) en DATABASE_URL:

postgres://postgres.<project-ref>:<db-password>@aws-<region>.pooler.supabase.com:5432/postgres

Opción B — PostgreSQL local con Docker (fallback): levanta el contenedor y descomenta la DATABASE_URL local en backend/.env.

pnpm --filter backend docker:up

4. Generar cliente Prisma, aplicar migraciones y sembrar datos

pnpm --filter backend exec prisma generate
pnpm --filter backend exec prisma migrate deploy
pnpm --filter backend db:seed

Con Supabase usa prisma migrate deploy (aplica las migraciones versionadas). Con Docker local también funciona prisma migrate dev para crear una migración nueva durante el desarrollo.

5. Iniciar en modo desarrollo

pnpm --filter backend start:dev     # API en http://localhost:3003/api
pnpm --filter frontend dev          # Frontend en http://localhost:5173

Scripts

Raíz

Comando	Descripción
pnpm back:lint	Lint del backend.
pnpm front:lint	Lint del frontend.
pnpm format:check	Verifica formato con Prettier.
pnpm format:fix	Corrige formato con Prettier.

Calidad

• Lint: ESLint en backend/ y frontend/ (sin variables sin usar en backend).
• Formato: Prettier (comillas simples, punto y coma, sangría de 2 espacios).
• Hooks de Git: husky + lint-staged (ESLint fix + Prettier en *.{ts,js,tsx,jsx}) y commitlint con Conventional Commits.
• Tests: Jest unitarios en backend/src y end-to-end en backend/test. Vitest unitarios en frontend/src.

Autor

Juan Ramirez