Saltar a contenido

Stack Tecnológico

Runtime y Framework

Tecnología Uso Versión
Cloudflare Workers Runtime serverless
Hono Framework HTTP 4.x
@hono/zod-openapi Rutas tipadas + OpenAPI
Vite Build tool + Dev server 7.x
TypeScript Lenguaje 5.x

Base de Datos

Tecnología Uso
Cloudflare D1 Base de datos SQLite distribuida
Drizzle ORM ORM con type-safety

Frontend (Dashboard)

Tecnología Uso
hono/jsx/dom Rendering (NO React)
hono/client (hc) RPC tipado al backend
Tailwind CSS v4 Estilos
@tailwindcss/vite Plugin de Vite

No es React

El dashboard usa hono/jsx/dom que tiene API similar a React pero imports diferentes. Usar useState de hono/jsx, no de react.

Documentación

Tecnología Uso
Scalar UI de docs OpenAPI en /docs
MkDocs Material Documentación técnica

CI/CD

Tecnología Uso
Bitbucket Pipelines CI/CD
Wrangler CLI de Cloudflare
pnpm Package manager

Estructura del proyecto

src/
├── index.tsx                 # App principal, export AppType
├── renderer.tsx              # jsxRenderer + Tailwind
├── style.css                 # @import "tailwindcss"
├── client.tsx                # Mount del dashboard
├── app.tsx                   # Layout del dashboard
├── components/               # Componentes dashboard (hono/jsx/dom)
├── db/
│   ├── index.ts              # createDb()
│   ├── schema.ts             # Tablas Drizzle
│   └── helpers.ts
├── lib/
│   ├── api.ts                # hc<AppType> para dashboard
│   ├── api-key.ts            # CRUD API keys
│   ├── database.ts           # Todas las queries
│   ├── mercadopago.ts        # mpRequest() centralizado
│   ├── pkce.ts               # PKCE helpers
│   ├── cron.ts               # Token refresh automático
│   ├── error.ts              # Error codes
│   ├── result.ts             # Result helpers
│   └── webhook.ts            # Webhook log helpers
├── middleware/
│   ├── security.ts           # adminToken(), clientToken()
│   ├── activity-log.ts       # Log de operaciones
│   ├── error-handler.ts
│   └── logger.ts
├── routes/
│   ├── oauth.ts
│   ├── store.ts
│   ├── terminals.ts
│   ├── orders.ts
│   ├── webhook.ts
│   ├── api-key.ts
│   ├── admin.ts
│   ├── dashboard.ts
│   └── health.ts
├── schemas/                  # Zod schemas + OpenAPI
└── types/
    └── app.ts                # AppEnv