qagencia
Sesión 4 · De mockup a desarrollo realPrompts por ruta: A local o B servidor
PROMPT 00

Punto de partida

Antes de elegir ruta

Prompt para copiar
Venimos de crear un mockup HTML estático del Mini CRM Comercial.

Ahora quiero convertir ese mockup en una primera versión funcional.

Antes de generar código, ayúdame a elegir la forma más adecuada de desarrollo.

Plantea dos opciones:

A) Versión local sencilla, sin base de datos, guardando los datos en LocalStorage o JSON simulado.
B) Versión para servidor con PHP + MySQL/MariaDB.

Para cada opción indica:

- dificultad,
- requisitos,
- ventajas,
- limitaciones,
- para quién es recomendable,
- qué pasos habría que seguir.

No generes código todavía. Primero quiero elegir la ruta.
PROMPT 01

Elegir ruta

Aquí decides A o B

Prompt para copiar
Perfecto.

Para esta primera versión quiero elegir una ruta de desarrollo.

Elijo la opción:

[ESCRIBIR AQUÍ: A o B]

A = versión local sencilla sin base de datos, guardando los datos en LocalStorage o JSON simulado.
B = versión para servidor con PHP + MySQL/MariaDB.

A partir de ahora, adapta todos los siguientes pasos a la opción elegida.

No generes código todavía.
Primero confirma qué vamos a construir, qué archivos necesitaremos y cuál será el orden correcto.
PROMPT A1

Arquitectura local

Sin servidor ni base de datos

Prompt para copiar
He elegido la opción A: versión local sencilla sin base de datos, guardando los datos en LocalStorage o JSON simulado.

Ahora actúa como arquitecto senior de software.

Diseña la arquitectura mínima para convertir el mockup HTML en una herramienta funcional que pueda probarse en local.

Condiciones:

- No usar base de datos.
- No usar PHP.
- No depender de servidor.
- Guardar los datos en LocalStorage del navegador.
- Incluir datos de ejemplo al cargar por primera vez.
- Mantener todo lo más sencillo posible.
- Priorizar que una persona sin conocimientos técnicos pueda abrirlo y probarlo.

Define:

1. Archivos necesarios.
2. Responsabilidad de cada archivo.
3. Cómo se guardarán los datos.
4. Cómo se crearán oportunidades.
5. Cómo se editarán oportunidades.
6. Cómo se actualizará el dashboard.
7. Limitaciones de esta versión.
8. Qué quedaría para una versión real con servidor.

No generes código todavía. Primero quiero validar el plan.
PROMPT A2

Estructura local

Archivos mínimos

Prompt para copiar
Perfecto.

Ahora define la estructura exacta de archivos para la versión local sin base de datos.

Quiero una versión muy sencilla, fácil de descargar y abrir en navegador.

Propón la estructura con:

- index.html
- assets/css/app.css
- assets/js/app.js

Para cada archivo indica:

- qué contiene,
- para qué sirve,
- si es imprescindible,
- qué parte del mockup original reutiliza.

No generes todavía el código.
Solo quiero validar la estructura.
PROMPT A3

Generar versión local

HTML + CSS + JS

Prompt para copiar
Perfecto.

Ahora genera la primera versión funcional local del Mini CRM Comercial.

Debe funcionar sin base de datos y sin servidor.

Condiciones:

- Usar HTML, CSS y JavaScript.
- Guardar los datos en LocalStorage del navegador.
- Incluir datos de ejemplo al cargar por primera vez.
- Permitir crear oportunidades.
- Permitir editar oportunidades.
- Permitir cambiar estado.
- Permitir guardar próxima acción y fecha.
- Actualizar el dashboard automáticamente.
- Mantener una estética similar al mockup HTML anterior.
- No usar librerías externas.
- Mantener el código claro y separado.

Dame los archivos completos uno por uno:

1. index.html
2. assets/css/app.css
3. assets/js/app.js

Indica claramente la ruta antes de cada archivo.
PROMPT A4

Probar en local

Abrir y comprobar

Prompt para copiar
Perfecto.

Ahora genera una guía muy sencilla para probar esta versión local.

Explícala para una persona sin conocimientos técnicos.

Debe incluir:

1. Cómo crear la carpeta del proyecto.
2. Qué archivos debe guardar.
3. Dónde colocar cada archivo.
4. Cómo abrir index.html en el navegador.
5. Cómo comprobar que se pueden crear oportunidades.
6. Cómo borrar datos de prueba del navegador si hace falta.
7. Qué limitaciones tiene esta versión local.

No uses lenguaje técnico innecesario.
PROMPT A5

Siguiente paso

De local a servidor

Prompt para copiar
Perfecto.

Ahora explícame qué habría que cambiar para convertir esta versión local en una versión real instalada en servidor.

Compara:

Versión local con LocalStorage
vs
Versión servidor con PHP + MySQL/MariaDB

Indica:

- qué partes se podrían reutilizar,
- qué partes habría que rehacer,
- por qué hace falta base de datos en una versión real,
- qué riesgos tiene dejarlo solo en LocalStorage,
- cuál sería el siguiente paso lógico.

No generes código.
PROMPT B1

Arquitectura servidor

PHP + MySQL/MariaDB

Prompt para copiar
He elegido la opción B: versión para servidor con PHP + MySQL/MariaDB.

Ahora actúa como arquitecto senior de software.

Diseña la arquitectura técnica inicial del proyecto.

La solución debe estar pensada para:

- PHP 8.x
- MySQL / MariaDB
- Hosting normal con Plesk o cPanel
- Instalación sencilla
- Fácil de ampliar más adelante

Define:

1. Estructura de carpetas.
2. Archivos principales.
3. Base de datos necesaria.
4. Tablas y relaciones.
5. Flujo de navegación.
6. Si incluirías login desde el inicio o no.
7. Qué partes deben mantenerse separadas para facilitar futuras ampliaciones.
8. Riesgos técnicos iniciales.

No generes código todavía. Quiero primero validar la arquitectura.
PROMPT B2

Validar alcance

Evitar sobredimensionar

Prompt para copiar
Perfecto.

Antes de generar código, quiero cerrar el plan de desarrollo de la primera versión.

Revisa tu propuesta con estos criterios:

1. Que sea sencilla.
2. Que pueda instalarse en un hosting normal con Plesk o cPanel.
3. Que no esté sobredimensionada.
4. Que sea fácil de ampliar más adelante.
5. Que pueda construirse por partes.

Confírmame:

- Si mantendrías las 2 tablas o si simplificarías a 1 tabla para la primera versión.
- Si mantendrías login desde el inicio o si harías primero una versión sin login.
- Qué archivos son imprescindibles para empezar.
- Qué funcionalidades dejarías para una segunda fase.
- Cuál sería el orden correcto para construirlo.

No generes código todavía. Quiero cerrar el plan antes de empezar.
PROMPT B3

Base de datos

schema.sql

Prompt para copiar
Perfecto.

Ahora genera el archivo SQL inicial para la base de datos del proyecto.

Necesito un archivo schema.sql sencillo para MySQL/MariaDB.

Debe incluir:

1. Tabla de usuarios, si finalmente mantenemos login.
2. Tabla de oportunidades.
3. Campos mínimos definidos en el Documento Maestro.
4. Estados comerciales controlados.
5. Fechas de creación y actualización.
6. Datos de ejemplo si ayudan a probar.

No generes todavía los archivos PHP.
Primero quiero revisar la base de datos.
PROMPT B4

Estructura PHP

Carpetas y archivos

Prompt para copiar
Perfecto.

Ahora define la estructura exacta de archivos que vamos a crear para la primera versión funcional en PHP.

Quiero que mantengas el proyecto sencillo y modular.

Para cada archivo indica:

- ruta,
- función,
- si es obligatorio para la primera versión,
- y qué responsabilidad tendrá.

No generes todavía el contenido de los archivos.
Solo quiero validar la estructura final antes de empezar a programar.
PROMPT B5

Archivos base

Config, conexión y layout

Prompt para copiar
Perfecto.

Ahora genera los primeros archivos base del proyecto.

Quiero empezar por:

1. src/config.php
2. src/db.php
3. src/helpers.php
4. templates/header.php
5. templates/sidebar.php
6. templates/footer.php
7. public/assets/css/app.css

Condiciones:

- Código claro.
- Comentarios mínimos pero útiles.
- Preparado para PHP 8.x.
- Pensado para instalar en hosting con Plesk o cPanel.
- Sin complicar la estructura.

Dame cada archivo por separado, indicando claramente la ruta antes del código.
PROMPT B6

Primera versión PHP

Aplicación funcional

Prompt para copiar
Perfecto.

Ahora genera la primera versión funcional del Mini CRM Comercial en PHP + MySQL/MariaDB.

Debe incluir:

1. Dashboard con tarjetas resumen.
2. Listado de oportunidades.
3. Formulario para crear oportunidad.
4. Formulario para editar oportunidad.
5. Cambio de estado.
6. Próxima acción y fecha de próxima acción.

Mantén la estructura modular ya definida.

No generes todo mezclado en un único archivo.

Dame los archivos necesarios por bloques, indicando siempre:

- ruta del archivo,
- qué hace,
- código completo.

Prioriza que la primera versión sea fácil de instalar, probar y entender.
PROMPT B7

Instalar en servidor

Plesk/cPanel + File Manager + BD

Prompt para copiar
Perfecto.

Ahora genera una guía de instalación sencilla para una persona sin conocimientos técnicos avanzados.

La guía debe explicar:

1. Qué archivos hay que subir al servidor.
2. En qué carpeta deberían colocarse.
3. Cómo crear la base de datos en Plesk o cPanel.
4. Cómo importar el archivo schema.sql.
5. Cómo configurar los datos de conexión.
6. Cómo probar que la aplicación funciona.
7. Qué errores habituales pueden aparecer y cómo detectarlos.

Explícalo paso a paso, sin dar nada por supuesto.
ComúnRuta ARuta B