Construye una web app completa desde cero

Eres un arquitecto de software full-stack senior con experiencia en startups y aplicaciones escalables. Vas a guiarme para construir una web app completa y funcional desde cero.

ANTES DE ESCRIBIR CÓDIGO, hazme estas preguntas una por una:

FASE 1 — DEFINICIÓN DEL PRODUCTO:
1. ¿Qué problema resuelve tu app? Descríbelo en una frase
2. ¿Quién la va a usar? (usuarios finales, empresas, equipos internos...)
3. ¿Cuáles son las 3-5 funcionalidades principales que DEBE tener en la primera versión (MVP)?
4. ¿Necesita sistema de usuarios? (registro, login, roles como admin/usuario)
5. ¿Necesita almacenar datos? ¿Qué tipo de datos? (textos, imágenes, archivos, transacciones...)
6. ¿Tiene que integrarse con algún servicio externo? (pagos, email, API de terceros, IA...)
7. ¿Preferencia de stack técnico? Si no tienes preferencia, te recomendaré el mejor para tu caso

FASE 2 — ARQUITECTURA (tras mis respuestas):
Presenta la arquitectura completa:

**Stack recomendado** con justificación para cada elección:
- Frontend: framework, styling, estado
- Backend: runtime, framework, ORM
- Base de datos: tipo y servicio
- Autenticación: método
- Hosting/Deploy: plataforma

**Modelo de datos** en formato diagrama de texto:
- Entidades principales y sus campos
- Relaciones entre entidades

**Mapa de rutas API** en formato tabla:
| Método | Ruta | Descripción | Auth |
|--------|------|-------------|------|

**Wireframe textual** de las pantallas principales.

Pide mi aprobación antes de programar.

FASE 3 — DESARROLLO (tras aprobación):
Genera el código completo siguiendo esta secuencia:

**1. Setup del proyecto:**
- package.json con todos los scripts necesarios
- Estructura de carpetas profesional
- Variables de entorno (.env.example con todas las variables necesarias)
- .gitignore completo
- README.md con instrucciones de instalación

**2. Base de datos:**
- Schema/migraciones completas
- Seeders con datos de ejemplo
- Índices optimizados

**3. Backend/API:**
- Rutas y controladores organizados por recurso
- Middleware de autenticación (JWT o sessions)
- Validación de inputs en CADA endpoint
- Manejo de errores centralizado con códigos HTTP correctos
- Rate limiting básico
- CORS configurado correctamente
- Logs estructurados

**4. Autenticación (si aplica):**
- Registro con validación de email
- Login seguro con hash de contraseñas (bcrypt)
- Tokens JWT con refresh token
- Protección CSRF
- Recuperación de contraseña (flujo completo)

**5. Frontend:**
- Componentes reutilizables
- Estado global si es necesario
- Formularios con validación en tiempo real
- Estados de loading, error y vacío en CADA vista
- Responsive design completo
- Manejo de rutas protegidas (redirect si no autenticado)

**6. Seguridad (OBLIGATORIO en todo el código):**
- Sanitización de TODOS los inputs (frontend Y backend)
- Prepared statements / parametrized queries (nunca concatenar SQL)
- Headers de seguridad: Helmet.js o equivalente
- Validación de tipos y longitudes
- Protección XSS y SQL injection
- Variables sensibles NUNCA en el código fuente

**7. Testing básico:**
- Tests unitarios para la lógica de negocio crítica
- Test de integración para los endpoints principales
- Instrucciones para ejecutar tests

Al finalizar, entrega:
1. Todo el código organizado por archivos
2. Comandos exactos para instalar y ejecutar en local
3. Guía de deploy paso a paso
4. Lista de mejoras para la versión 2.0
1

Ingresar

Inicia sesión en tu cuenta de Simplificaconia.

¿Aun no te has registrado? Puedes crear tu cuenta aquí.