Programación y Desarrollo de Aplicaciones Web I · Clase 01

Antes de programar: análisis, arquitectura y decisiones tecnológicas

Una clase teórico-práctica para convertir una necesidad real en una propuesta técnica comprensible, viable y comprobable antes de pedirle código a una persona o a una inteligencia artificial.

Caso guía: AulaDesk Producto: propuesta técnica justificada No se programa un CRUD

1 El proceso de desarrollo de software

Programar es una etapa del proceso, no el punto de partida. Una solución útil comienza entendiendo el problema y termina —siempre provisionalmente— cuando puede operar, medirse y evolucionar.

Problema
→
Requisitos y alcance
→
Arquitectura y tecnología
→
Plan
→
Desarrollo y pruebas
→
Despliegue y operación
↺

La flecha de regreso representa aprendizaje: usuarios, errores y métricas producen una nueva iteración.

01 · Problema

Identificación

Describir la situación observable, a quién afecta y qué consecuencia provoca. Ejemplo: “las solicitudes llegan por mensajes dispersos y se pierden”, no “necesitamos React”.

02 · Entender

Levantamiento y análisis

Entrevistas, observación, documentos y datos permiten descubrir necesidades, reglas, excepciones y vocabulario del dominio.

03 · Delimitar

Alcance

Define qué resolverá esta versión y qué queda fuera. AulaDesk v1 registra, asigna y consulta solicitudes; no incluye app móvil nativa ni pagos.

04 · Estructurar

Arquitectura

Organiza responsabilidades y comunicaciones: interfaz web, backend, base de datos, correo y alojamiento.

05 · Elegir

Selección tecnológica

Compara experiencia del equipo, costo, soporte, restricciones y operación. La elección responde al contexto, no a una moda.

06 · Ordenar

Planificación

Descompone entregables en tareas pequeñas, dependencias, responsables, estimaciones y riesgos. Primero se construye el camino crítico.

07 · Construir

Desarrollo e integración

Se implementan partes verificables y se conectan temprano. Integrar al final aumenta sorpresas y retrabajo.

08 · Comprobar

Testing y depuración

Las pruebas comparan el resultado con criterios de aceptación; depurar significa localizar y corregir la causa de una falla.

09 · Publicar

Despliegue

Se entrega una versión a un entorno, con configuración, datos, dominio, seguridad y plan de reversión.

10 · Sostener

Operación, mantenimiento y evolución

Monitorear, respaldar, corregir, actualizar y mejorar. El software útil cambia porque su contexto también cambia.

Idea clave: el proceso es iterativo. Scrum, Kanban, cascada, prototipado y enfoques híbridos ordenan el trabajo de maneras distintas. Ninguna metodología elimina la necesidad de entender, decidir y validar.

Microactividad

Convierte “queremos un sistema moderno” en una descripción de problema que incluya usuario, situación y consecuencia. Después identifica qué dato necesitarías para comprobar que mejoró.

↑ Volver al inicio

2 Sitio web, aplicación web, aplicación móvil y API

Estas piezas pueden coexistir, pero tienen propósitos y formas de interacción distintas.

Sitio web

Qué es: páginas navegables orientadas principalmente a consultar contenido.

Ejemplo: portal informativo de una universidad.

Aplicación web

Qué es: software usado desde el navegador para realizar tareas y manejar datos.

Ejemplo: AulaDesk, correo web o banca en línea.

Aplicación móvil

Qué es: software instalado en iOS o Android, con acceso controlado a funciones del dispositivo.

Ejemplo: app de reparto con cámara y GPS.

API

Qué es: contrato para que dos sistemas intercambien datos u operaciones.

Ejemplo: GET /api/solicitudes/42 devuelve JSON.

Vocabulario para seguir el recorrido

Frontend / cliente

La interfaz que recibe acciones y presenta resultados. Un navegador es un cliente.

Backend / servidor

Aplica reglas, autoriza acciones, consulta datos y construye respuestas. “Servidor” puede referirse al programa o a la máquina.

Base de datos

Organiza y conserva información para consultarla y modificarla de forma controlada.

Petición HTTP

Mensaje del cliente: método, URL, encabezados y, a veces, cuerpo. Ejemplo: enviar una solicitud.

Respuesta JSON

Datos estructurados que el backend devuelve; no es una pantalla. El frontend decide cómo mostrarlos.

Hosting

Infraestructura donde el software y sus archivos están disponibles para usuarios autorizados.

Recorrido de una consulta

🌐 Navegador
GET /solicitudes
→
⚙️ API / Backend
valida permiso
→
🗄️ Base de datos
consulta filas
→
⚙️ Backend
crea JSON
→
🌐 Navegador
renderiza tabla
HTTP/1.1 200 OK
Content-Type: application/json

{"solicitudes":[{"id":42,"asunto":"Proyector","estado":"asignada"}]}
No confundir: alojar una web no convierte automáticamente su código en una API; JSON no es una base de datos; y el frontend nunca debe decidir por sí solo si un usuario tiene permiso para una acción sensible.
↑ Volver al inicio

3 Cómo definir requisitos antes de programar

AulaDesk es el caso provisional: una institución necesita registrar solicitudes, asignarlas, dar seguimiento y notificar cambios.

ElementoPregunta que respondeEjemplo en AulaDesk
Requisito funcional¿Qué debe poder hacer el sistema?Una persona solicitante puede consultar el estado de sus propias solicitudes.
Requisito no funcional¿Con qué cualidad o límite debe hacerlo?La vista principal debe cargar en menos de 2 s con 100 usuarios concurrentes, bajo el entorno acordado.
Actor y rol¿Quién interactúa y qué responsabilidad tiene?Solicitante crea; responsable atiende; coordinador asigna y supervisa.
Caso de uso¿Qué objetivo logra un actor?“Asignar solicitud”: el coordinador elige responsable, fecha y prioridad.
Alcance y límite¿Qué entra ahora y qué no?Incluye correo al cambiar estado; excluye SMS y aplicación móvil en v1.
MVP¿Cuál es la versión mínima que entrega valor y aprendizaje?Acceso, registro, asignación, estados, comentarios e historial básico.
Prioridad¿Qué va primero?Must: seguridad de acceso. Should: filtros. Could: tablero de métricas.
Riesgo¿Qué incertidumbre puede dañar el proyecto?No existe catálogo acordado de áreas responsables.
Restricción¿Qué condición no podemos ignorar?Presupuesto mensual limitado y servidor PHP ya contratado.
Criterio de aceptación¿Cómo sabremos que está terminado?Dada una solicitud nueva, cuando el coordinador la asigna, el responsable la ve y queda registro de fecha y autor.

De una frase vaga a una condición comprobable

Vago: “El sistema debe ser rápido, fácil y mandar notificaciones.” No define quién, cuándo, cuánto ni cómo verificarlo.
Comprobable: “Cuando un responsable cambie el estado a ‘resuelta’, el solicitante verá el nuevo estado al recargar y recibirá un correo dentro de 5 minutos.”

Historia breve con aceptación

Como coordinador, quiero asignar una solicitud a un responsable para que exista una persona claramente encargada.

  • Solo el rol coordinador puede asignar.
  • El responsable debe estar activo y pertenecer al área correspondiente.
  • La asignación registra responsable, autor y fecha.
  • Si no hay responsables disponibles, se informa el problema sin perder datos.
Priorización práctica: usar MoSCoW (Must, Should, Could, Won’t por ahora) obliga a distinguir necesidad de deseo. Prioridad no significa “todo es urgente”.
↑ Volver al inicio

4 Comparación de tecnologías

Primero distinguimos categorías. Un lenguaje expresa instrucciones; un framework organiza una aplicación e impone convenciones; una biblioteca aporta piezas que el programa llama; un entorno de ejecución ejecuta código.

TecnologíaQué es / para qué sirveCuándo convieneCuándo no convieneEjemplo
HTMLLenguaje de marcado: estructura y significado del contenido.En toda interfaz web accesible.No resuelve lógica de servidor ni persistencia.Formulario de solicitud.
CSSLenguaje de estilos: presentación, layout y adaptación a pantallas.En toda experiencia web visual.No valida permisos ni guarda datos.Tablero responsivo.
JavaScriptLenguaje del navegador y también del servidor.Interacción dinámica, fetch, validación de ayuda.No debe ser la única barrera de seguridad.Actualizar estados sin recargar.
PHPLenguaje de servidor muy extendido en la web.Hosting disponible, equipo conoce PHP, aplicaciones CRUD y APIs.Si la organización solo opera otra plataforma y no mantendrá PHP.Portal institucional y AulaDesk.
Node.jsEntorno de ejecución de JavaScript fuera del navegador.Equipo unificado en JS, APIs y tiempo real con ecosistema npm.Si agrega una segunda plataforma sin beneficio operativo.API de colaboración en tiempo real.
PythonLenguaje general, legible y fuerte en datos, automatización e IA.Procesamiento, ML, scripts y APIs con experiencia Python.Cuando el hosting o el equipo no puede operarlo.Clasificar solicitudes por tema.
C# / .NETLenguaje y plataforma para web, servicios, escritorio y nube.Entornos empresariales, Azure, tipado fuerte y ecosistema Microsoft.Proyectos mínimos en hosting PHP sin soporte .NET.Sistema corporativo integrado con Microsoft Entra.
LaravelFramework PHP con rutas, ORM, validación, colas y convenciones.Aplicación PHP mediana/grande que aprovecha su estructura.Una página estática o ejercicio pequeño donde añade peso innecesario.Plataforma de solicitudes modular.
ReactBiblioteca JavaScript para construir interfaces por componentes.Interfaz con estado complejo, equipo preparado y API clara.Sitio de contenido simple o cuando duplicará complejidad.Tablero interactivo con múltiples paneles.
VueFramework progresivo de interfaces, basado en componentes.Adopción gradual o SPA con curva accesible.Cuando HTML del servidor ya resuelve bien la experiencia.Panel de seguimiento interactivo.

Tres decisiones, tres contextos

A · Portal de 8 páginas

Contenido estable, formulario externo, edición ocasional. Elección razonable: HTML, CSS y poco JS. Un framework SPA sería costo sin valor claro.

B · AulaDesk v1

Equipo aprende PHP, hosting PHP/MySQL ya existe. Candidata: PHP + HTML del servidor + JS puntual + MySQL/MariaDB. Laravel se evalúa cuando alcance y dominio lo justifiquen.

C · Analítica con IA

Clasificación y procesamiento intensivo de texto. Candidata: servicio Python especializado, integrado mediante API; no obliga a reescribir todo AulaDesk.

No hay ganador universal. Evalúa ajuste al problema, habilidades, comunidad, seguridad, mantenibilidad, costo total, compatibilidad y operación. “Es popular” no basta como justificación.
↑ Volver al inicio

5 Bases de datos

Persistencia significa que los datos sobreviven al cierre del programa. El modelo elegido debe representar el dominio y sus consultas importantes, no solo guardar “cosas”.

SQL / relacional

Organiza datos en tablas con columnas, filas, llaves y relaciones. Favorece reglas de integridad, consultas declarativas y transacciones.

AulaDesk: usuarios, solicitudes, estados y asignaciones tienen relaciones claras.

NoSQL

Agrupa modelos distintos a tablas relacionales, por ejemplo documentos o clave-valor. Puede dar flexibilidad o velocidad para patrones específicos.

No significa: “sin estructura”, “más rápido siempre” ni “sin diseño”.

MotorModelo y fortalezasConviene cuando…Precaución / ejemplo
MySQL / MariaDBRelacional, extendido, buen soporte en hosting y PHP. Son proyectos distintos aunque compatibles en mucho.CRUD, portales y aplicaciones transaccionales habituales.Excelente candidata para AulaDesk si ya está disponible.
PostgreSQLRelacional robusto, SQL avanzado, extensibilidad y tipos ricos.Consultas complejas, integridad exigente o capacidades geoespaciales/JSON avanzadas.Requiere que equipo y plataforma sepan operarlo.
SQLiteRelacional embebido en un archivo, sin servidor separado.Prototipos, apps locales, pruebas o baja concurrencia.No es la opción normal para una plataforma web multiusuario en crecimiento.
MongoDBDocumentos JSON-like, esquema flexible y anidación.Datos naturalmente documentales y patrones de acceso bien entendidos.Las relaciones fuertes de AulaDesk no desaparecen por usar documentos.
RedisAlmacén clave-valor en memoria, muy rápido; soporta expiración y estructuras.Caché, sesiones, contadores, colas o datos efímeros.Suele complementar una base relacional; no sustituye en general los datos principales y su historial.

Criterios de selección

Modelo de datos, relaciones, transacciones, consultas, volumen, concurrencia, consistencia, respaldo, habilidades, alojamiento, costo, herramientas y migración futura. La pregunta correcta no es “¿cuál es mejor?”, sino “¿qué riesgo reduce y qué costo introduce en este contexto?”.

Recomendación provisional para AulaDesk: una base relacional ya soportada por la institución. La trazabilidad de asignaciones y estados se beneficia de relaciones, restricciones y transacciones.
↑ Volver al inicio

6 Herramientas de desarrollo local

Una herramienta se incorpora cuando resuelve una necesidad del flujo. Instalar todo desde el primer día no mejora automáticamente el proyecto.

HerramientaQué es / para qué sirveCuándo es necesaria o útil
VS CodeEditor con navegación, terminal, extensiones y depuración.Editar el proyecto; elegir extensiones mínimas y confiables.
GitControl de versiones distribuido: registra cambios y facilita colaboración.Desde la primera documentación; no reemplaza los respaldos externos.
DBeaverCliente gráfico para explorar y consultar bases de datos.Administrar y aprender SQL; no es la base de datos.
PHP / MAMPPHP ejecuta backend; MAMP empaqueta servidor web, PHP y base local.Probar una aplicación PHP sin publicarla.
ComposerGestor de dependencias PHP y autoload.Cuando el proyecto usa paquetes PHP; requiere fijar y revisar versiones.
Node.js / npmRuntime JavaScript y gestor de paquetes.Backend Node o herramientas frontend; no son requisito para HTML/CSS puro.
DockerEmpaqueta procesos y dependencias en entornos repetibles.Cuando diferencias entre equipos/servidores justifican la complejidad.
DevToolsHerramientas del navegador para DOM, CSS, red, consola, rendimiento y móvil.Siempre que se construye o depura una web.
CodexAgente de desarrollo asistido por IA que puede analizar, editar y verificar dentro del alcance autorizado.Para acelerar tareas con requisitos claros y revisión humana.

Docker con una analogía precisa

Imagen = plano sellado

Plantilla inmutable con sistema, runtime, dependencias y configuración base.

Contenedor = instancia en ejecución

Proceso aislado creado desde una imagen. Puede iniciarse, detenerse y reemplazarse.

Volumen = datos durables

Espacio separado del ciclo de vida del contenedor. Evita perder la base al reemplazarlo.

Hoy no es requisito instalar Docker. Primero comprendemos el problema y el entorno disponible; después decidimos si la reproducibilidad compensa su curva de aprendizaje.

Tres entornos, tres propósitos

Local

Máquina del desarrollador. Datos ficticios, cambios rápidos, errores visibles.

Pruebas / staging

Se parece a producción y permite validar integración sin afectar usuarios reales.

Producción

Servicio real: máxima cautela, secretos protegidos, monitoreo, respaldo y cambios controlados.

↑ Volver al inicio

7 Infraestructura y despliegue

La infraestructura sostiene la aplicación. Debe ser suficiente, recuperable y operable por el equipo, no simplemente “la más grande”.

OpciónQué ofreceConvieneNo conviene
Hosting compartidoRecursos compartidos y panel administrado, bajo costo.PHP/MySQL pequeño, tráfico moderado y presupuesto limitado.Procesos especiales, control fino o escalamiento exigente.
VPSMáquina virtual con mayor control.Configuración propia y equipo capaz de administrar seguridad/actualizaciones.Si nadie puede operarla de forma responsable.
DedicadoServidor físico para una organización.Cargas o requisitos muy específicos.MVP con demanda incierta y poco personal operativo.
Nube públicaRecursos bajo demanda y servicios administrados.Variabilidad, integración y necesidad de automatización.Sin gobierno de costos, habilidades o una necesidad concreta.
AWS / Google Cloud / AzureProveedores amplios de cómputo, datos, redes e IA.Cuando sus servicios y ecosistema encajan con organización/equipo.Elegirlos solo por prestigio puede elevar costo y complejidad.
Plataforma administradaDespliega aplicaciones ocultando parte de la operación.Equipos pequeños que priorizan entrega y aceptan sus límites.Requisitos de infraestructura muy personalizados.

Dirección y confianza en Internet

  • Dominio: nombre legible, por ejemplo auladesk.institucion.mx.
  • DNS: traduce el dominio hacia el servicio correcto mediante registros.
  • HTTPS: cifra y autentica la comunicación HTTP mediante TLS.
  • Certificado: vincula criptográficamente una identidad/dominio con una clave; debe renovarse.

Arquitectura simple y arquitectura compleja

AulaDesk inicial

Navegador
   ↓ HTTPS
Hosting PHP
   ├─ Aplicación
   └─ MySQL administrado
        ↳ respaldo diario

Menos piezas, menor costo operativo, fácil de comprender. Debe medir uso y límites.

Escala comprobada

DNS + CDN + balanceador
          ↓
  varias instancias de app
      ↓          ↓
 base gestionada  cola/workers
 réplica/backup   archivos objeto

Mejora capacidad o resiliencia, pero exige observabilidad, automatización y más presupuesto.

Evita sobredimensionar. Escalabilidad es la capacidad de crecer; disponibilidad, la proporción de tiempo que funciona; respaldos, copias recuperables. Ninguna se obtiene dibujando más cajas. Se define un objetivo, se mide y se prueba la recuperación.

Costos fijos: dominio, plan base, soporte. Variables: cómputo por uso, transferencia, almacenamiento, mensajes, usuarios o llamadas a APIs. El costo total también incluye horas de administración.

↑ Volver al inicio

8 Servicios adicionales y notificaciones

“Notificar” no es una sola función: cambia el canal, la autorización, el costo, la entrega y la experiencia.

CanalInfraestructura y permisosCosto / complejidadUso apropiado
InternaTabla de notificaciones y UI; usuario autenticado.Bajo–medio; no avisa si no entra.Bandeja e historial dentro de AulaDesk.
CorreoProveedor SMTP/API, dominio configurado, plantillas y rebotes.Bajo al inicio; entrega no instantánea garantizada.Cambios importantes y resumen.
Push webService worker, claves y permiso explícito del navegador.Medio; soporte y permisos variables.Usuarios frecuentes aun con pestaña cerrada.
Push móvilApp instalada, token y servicios Apple/Google.Medio–alto; depende de app móvil.Eventos oportunos para personal móvil.
SMSProveedor, números válidos, consentimiento y normativa.Costo por mensaje; alcance alto.Alertas críticas, breves y justificadas.
WebSocketConexión bidireccional persistente y servidor preparado.Mayor operación.Chat o edición colaborativa en tiempo real.
SSECanal persistente servidor→navegador sobre HTTP.Menor que bidireccional cuando solo se envían eventos.Progreso y actualizaciones en vivo.

Más integraciones posibles

Archivos

Almacenamiento local u objeto; validar tipo/tamaño, controlar acceso, analizar malware y definir retención.

Pagos

Pasarela especializada, webhooks, conciliación y obligaciones legales. Nunca guardar datos sensibles sin necesidad.

APIs externas

Contrato, autenticación, límites, disponibilidad, costo y manejo de errores ajenos.

IA

Modelo/proveedor, instrucciones, contexto, privacidad, evaluación, latencia y costo por uso. Siempre considerar errores plausibles.

WebSockets

Bidireccionales: cliente y servidor envían eventos; útiles cuando ambos lados hablan con frecuencia.

SSE

Unidireccional servidor→cliente; más simple para notificaciones o progreso continuo en navegador.

AulaDesk MVP: notificación interna como registro confiable y correo para eventos seleccionados. Push, SMS y tiempo real se justifican después con evidencia de urgencia, adopción y presupuesto.

Criterios: urgencia, audiencia, permiso, confirmación requerida, sensibilidad, frecuencia, conectividad, costo por evento, accesibilidad y capacidad de soporte.

↑ Volver al inicio

9 Desarrollo de software asistido por IA

Codex puede acelerar el trabajo, pero no transforma una intención ambigua en una decisión correcta por arte de magia. La calidad del resultado depende del contexto, las restricciones y la verificación.

Codex puede apoyar

  • Analizar y aclarar requisitos.
  • Proponer diseños técnicos y alternativas.
  • Generar estructura de proyectos.
  • Programar cambios delimitados.
  • Refactorizar sin cambiar comportamiento.
  • Diagnosticar y depurar.
  • Crear y ejecutar pruebas.
  • Documentar decisiones y uso.

El desarrollador responde por

  • Decisiones arquitectónicas.
  • Validación con usuarios.
  • Seguridad, privacidad y permisos.
  • Diseño y revisión de pruebas.
  • Comprender el comportamiento final.
  • Controlar costos y dependencias.
  • Revisar cada cambio antes de publicar.
  • Aceptar o rechazar propuestas.

Prompt incorrecto

“Créame un sistema de inventarios completo.”

Faltan problema, usuarios, alcance, reglas, tecnología, seguridad, datos, criterio de éxito y entregables. “Completo” no es verificable.

Prompt técnico estructurado

Actúa como analista técnico. NO escribas código todavía.

Problema: una institución pierde solicitudes recibidas por mensajes dispersos.
Usuarios: solicitante, responsable y coordinador.
Requisitos iniciales: registrar, asignar, comentar, cambiar estado y consultar historial.
Restricciones: equipo principiante en PHP; hosting PHP 8.1 y MySQL existente;
presupuesto bajo; interfaz web responsiva; no app móvil en el MVP.
Tecnologías candidatas: PHP sin framework o Laravel; MySQL/MariaDB;
HTML del servidor con JavaScript puntual.
Criterios de aceptación: propón escenarios Given/When/Then para cada flujo crítico.
Pruebas: incluye permisos, validación, errores, integración y recorrido de usuario.
Entregables de esta fase: preguntas abiertas, alcance/MVP, 2 alternativas de
arquitectura con ventajas y riesgos, recomendación justificada, modelo conceptual,
plan por etapas y estimación con supuestos.

Primero: detecta ambigüedades y riesgos. Haz preguntas o declara supuestos.
Después presenta propuestas. Espera aprobación antes de generar código.
Flujo seguro: analizar → preguntar/suponer explícitamente → proponer alternativas → decidir → implementar un cambio pequeño → probar → revisar el diff → repetir. Nunca aceptar una salida solo porque “se ve profesional”.

Revisión mínima de una contribución de IA

  • ¿Resuelve el requisito y nada más?
  • ¿Respeta convenciones y datos existentes?
  • ¿Valida permisos en el servidor?
  • ¿Maneja entradas, errores y secretos?
  • ¿Las pruebas fallarían si la función se rompe?
  • ¿Entiendo cada archivo modificado?
  • ¿El costo operativo sigue siendo razonable?
↑ Volver al inicio

10 Práctica de la clase

Caso: “Una institución necesita una aplicación web para registrar solicitudes, asignarlas a responsables, dar seguimiento, consultar estados y notificar cambios.”

Producto: una propuesta técnica de 2–4 páginas o 5 diapositivas. Esta práctica consiste exclusivamente en diseñar y justificar la solución antes de programar. No se crea un CRUD, no se instala software y no se inicia un repositorio.

Se puede utilizar inteligencia artificial para investigar conceptos y comparar alternativas, pero cada elección debe explicarse con criterio propio, evidencia y supuestos visibles.

1 · Problema

¿Qué ocurre hoy, a quién afecta y cómo se medirá una mejora?

2 · Usuarios y roles

¿Quién usa, administra, recibe información o se ve afectado? ¿Qué puede y no puede hacer cada actor?

3 · Requisitos

Define requisitos funcionales y no funcionales verificables.

4 · MVP

¿Cuál es el flujo mínimo de principio a fin y qué queda fuera?

5 · Tecnologías candidatas

Identifica alternativas viables según el contexto, el equipo y las restricciones.

6 · Frontend y backend

Compara opciones para ambas capas y explica sus ventajas, límites y compatibilidad.

7 · Base de datos

Elige y justifica el modelo o motor según relaciones, consultas, integridad y operación.

8 · Notificaciones

¿Qué evento, receptor, canal y urgencia tiene cada aviso?

9 · Servicios externos

¿Qué servicios externos serían necesarios y qué costo, dependencia o riesgo agregan?

10 · Infraestructura inicial

¿Dónde se ejecutaría el MVP, cómo se protegería y cómo se respaldaría?

11 · Herramientas locales

¿Qué herramientas serían útiles durante el desarrollo y qué función cumpliría cada una?

12 · Restricciones, riesgos y costos

Enumera límites y riesgos principales, su mitigación y los costos fijos, variables o desconocidos.

13 · Verificación

¿Cómo se comprobaría que la solución funciona y satisface sus criterios de aceptación?

14 · Arquitectura propuesta

Representa componentes, responsabilidades, datos, integraciones y comunicaciones.

15 · Instrucciones para Codex

Redacta el contexto, alcance, restricciones, criterios y preguntas que Codex debe considerar antes de generar código.

Escenarios de decisión

Escenario 1 · Presupuesto mínimo y 80 usuarios
Ya existe hosting PHP/MySQL, el equipo conoce PHP y el uso es horario escolar. Comparen una aplicación PHP monolítica con una SPA + API separada. Justifiquen cuál reduce más riesgo hoy y qué señal haría reconsiderarla.
Escenario 2 · Personal en campo con mala conexión
Los responsables adjuntan fotos desde zonas con conectividad irregular. Decidan entre web responsiva, PWA o app móvil; consideren trabajo sin conexión, cámara, sincronización, costo y soporte.
Escenario 3 · 20,000 solicitudes y picos estacionales
El sistema creció y el tablero tarda demasiado. Antes de “migrar a microservicios”, propongan medición, índices, caché, paginación, escalamiento vertical u horizontal y pruebas de carga.
Escenario 4 · Notificación crítica
Una solicitud de seguridad requiere atención inmediata. Comparen notificación interna, correo, push y SMS por urgencia, costo, permiso, trazabilidad y fallas de entrega.
Cierre de la práctica: registra una decisión difícil, la evidencia o supuesto que la sostiene y la condición que obligaría a cambiarla. Justificar importa más que coincidir en la misma tecnología.
↑ Volver al inicio

11 Primer contacto con el proyecto integrador

Durante el cuatrimestre se construirá gradualmente una aplicación web funcional con apoyo de IA. AulaDesk es una propuesta provisional que puede adaptarse cuando se defina el proyecto definitivo.

Propósito de esta etapa: documentar el problema, los objetivos, los requisitos, el alcance, la arquitectura, las decisiones tecnológicas, los riesgos y el plan de pruebas. Todavía no se crea un CRUD, una base de datos ni un framework.

Ejemplo conceptual de organización documental

El siguiente árbol sirve como mapa del contenido que conviene documentar; no es una instrucción para crear carpetas o archivos en esta práctica.

auladesk/
├── README.md
└── docs/
    ├── 01-problema-y-objetivos.md
    ├── 02-requerimientos.md
    ├── 03-arquitectura.md
    ├── 04-decisiones-tecnicas.md
    └── 05-plan-de-pruebas.md

README.md

Propósito, estado, alcance, equipo y cómo navegar la documentación.

Problema y requisitos

Contexto, usuarios, objetivos, alcance, historias, prioridades y aceptación.

Arquitectura y decisiones

Diagrama, componentes, alternativas, elección, razones y consecuencias.

Riesgos y restricciones

Limitaciones, probabilidad, impacto, mitigaciones, costos y supuestos que deben validarse.

Plan de pruebas

Qué riesgos se prueban, nivel de prueba, datos y criterios de salida.

↑ Volver al inicio

12 Cierre de la clase

Glosario esencial

Arquitectura

Organización de componentes, responsabilidades, datos y comunicaciones.

API

Contrato de interacción entre sistemas.

MVP

Versión mínima que entrega valor y permite aprender.

Requisito

Necesidad o condición documentada y verificable.

Criterio de aceptación

Condición observable para considerar satisfecha una función.

Framework

Estructura reutilizable que guía cómo construir una aplicación.

Runtime

Entorno que ejecuta código, como Node.js o PHP.

Persistencia

Conservación de datos más allá de una ejecución.

Despliegue

Proceso de entregar una versión a un entorno.

DNS

Sistema que dirige nombres de dominio a servicios.

Escalabilidad

Capacidad de responder al crecimiento de carga.

Deuda técnica

Costo futuro creado por decisiones rápidas o incompletas.

Decisiones clave que debemos poder defender

  1. Problema y usuarios antes que tecnología.
  2. MVP y límites antes que lista infinita de funciones.
  3. Arquitectura proporcional al riesgo y escala conocidos.
  4. Tecnología compatible con equipo, presupuesto y operación.
  5. Datos y permisos diseñados desde el inicio.
  6. IA como colaborador revisado, no como autoridad.

Preguntas de comprobación

1. ¿Por qué “usar React” no es un requisito?
Porque es una decisión de solución. El requisito describe una necesidad o cualidad; la tecnología se compara después para satisfacerla.
2. ¿Qué diferencia existe entre requisito funcional y no funcional?
El funcional indica una capacidad; el no funcional establece una cualidad, restricción o nivel de servicio verificable.
3. ¿Por qué Redis no reemplaza automáticamente a MySQL?
Optimiza patrones como caché o datos efímeros, pero el dominio transaccional y relacional necesita persistencia, integridad y consultas que una base relacional resuelve bien.
4. ¿Cuándo justificarías una app móvil?
Cuando capacidades del dispositivo, trabajo offline, experiencia o distribución aportan suficiente valor frente al costo de crear y mantener otra aplicación.
5. ¿Qué debe ocurrir antes de pedir código a Codex?
Aclarar problema, usuarios, alcance, restricciones, aceptación y riesgos; pedir análisis y propuestas; tomar una decisión consciente.
6. ¿Qué demuestra que un respaldo sirve?
Una restauración probada dentro del tiempo y pérdida de datos aceptables; tener archivos de copia sin probar no garantiza recuperación.

Criterios de evaluación de la práctica

CriterioExcelenteEn desarrolloPeso
Problema, usuarios y alcanceConcretos, coherentes y medibles.Solución vaga o límites ausentes.20%
Requisitos y aceptaciónPriorizados, verificables y con excepciones.Lista de deseos sin comprobación.20%
Arquitectura y tecnologíasAlternativas comparadas y elección justificada.Elección por moda o sin relación con restricciones.25%
Datos, seguridad y pruebasRelaciones, roles, riesgos y estrategia clara.Solo camino feliz, sin permisos ni pruebas.20%
Costos, riesgos y comunicaciónSupuestos visibles, propuesta clara y viable.Costos/operación ignorados.15%
Preparación para el Jeopardy: repasa diferencias (sitio/app/API, SQL/NoSQL, framework/biblioteca/runtime), recorrido HTTP, criterios de selección, entornos, canales de notificación y responsabilidades al usar IA. El juego se ejecuta por separado y no forma parte de esta página.

Salida de clase: escribe una decisión técnica que ahora tomarías de manera diferente y la pregunta que harías antes de aceptarla.

↑ Volver al inicio