Ejercicio inicial
Durante todo el taller trabajamos bajo una estrategia incremental, aplicando principios de metodología ágil. Los primeros proyectos fueron pequeños MVPs de “Hola Mundo”, diseñados para comprender la estructura fundamental de un sitio web. Estos ejercicios iniciales integraban HTML, CSS y JavaScript desde el primer día, evitando la fragmentación típica de “ver primero HTML, luego CSS y al final JavaScript”.
Desde el inicio entendimos que un sitio web es un sistema completo, no piezas aisladas.Cada estudiante publicó su primer “Hola Mundo” en Cloudflare Pages, demostrando que, aunque aún carecía de estilos avanzados o funcionalidades complejas, ya contaban con un sitio real, funcional y en línea. Estos MVPs fueron la base sobre la cual se construyeron proyectos cada vez más completos y desafiantes a lo largo del semestre.
Usando Cloudflare
Durante el semestre los estudiantes aprendieron a publicar sus proyectos en Cloudflare pages, de forma manual y automática mediante GitHub.
En la foto se observa la Interfaz de Cloudflare Pages con el mensaje de despliegue exitoso.
Caso: Ejercicios 2.1
En el ejercicio 2.1 los estudiantes lograron implementar funcionalidades interactivas mediante JavaScript puro. Se enfocaron en la manipulación del DOM para crear experiencias dinámicas sin depender de frameworks externos.
este proyecto logro una integración efectiva entre diseño y funcionalidad, con un procentaje del 15% de código JS limpio y optimizado.
Aprendizaje en Acción: Integración y Deploy
Durante la asignatura trabajamos en modalidad híbrida, combinando clases presenciales y sesiones en línea. El taller culminó con una sesión de integración y despliegue, donde los equipos realizaron el merge de sus ramas de desarrollo hacia la rama principal del repositorio, activando el pipeline automático de publicación en Cloudflare Pages. Más allá del código, se valoró la capacidad de argumentar las decisiones de diseño y las soluciones implementadas durante las 17 semanas. Los resultados evidencian una madurez técnica sólida para un primer año.
Ejercicio final de semestre
En el ejercicio final del semestre tuvimos un promedio de de contibución en termino de commit de 30 commits por estudiante, lo que refleja un alto nivel de compromiso y participación activa en el desarrollo del proyecto. La grafica también muestra una distribución progresiva de las contribuciones entre octubre y noviembre, indicando un flujo constante de trabajo y colaboración.
👉 Ver reporte completo de contribución
📘 Metodología y Avance Semestral
Cronología de aprendizaje basada en proyectos
Iniciamos la etapa trabajando el concepto de wireframes de baja y mediana fidelidad, entendiendo su propósito dentro del proceso de diseño y cómo nos permiten definir estructura, jerarquía y funcionalidad antes de avanzar al desarrollo visual.
- Metodologías ágiles aplicadas al diseño
- Uso de Trello con metodología Kanban
- Historia de internet y la web
- Diseño de wireframes de baja y mediana fidelidad en Figma
Más que un simple “Hola Mundo”, construimos un pequeño MVP. Trabajamos bajo una lógica ágil, enseñando qué es un backlog y cómo usar Kanban en Trello. La primera versión fue local y la segunda publicada mediante Cloudflare Pages.
- Etiquetas HTML básicas
- Manejo de estilos básicos
- Subida manual a Cloudflare Pages
- Incorporación de código JavaScript básico
En esta Etapa los estudiantes integraron todos los conceptos previos y avanzaron hacia un nivel más profesional del desarrollo front-end: interfaces responsivas y modo oscuro.
- Creación de layout responsive
- Repositorio Git para cada estudiante
- Conexión de la rama
maina Cloudflare - Botón para cambiar el tema (light/dark)
Manipularon el DOM a través de selectores, eventos y gestión de clases para crear comportamientos dinámicos.
- Estructura CSS organizada y escalable
- Funcionalidades mediante manipulación del DOM
- Uso de selectores, eventos y clases
Esta Etapa reunió todos los aprendizajes. Los estudiantes desarrollaron un proyecto end-to-end, entendiendo cómo se estructura y mantiene un sitio web profesional.
Cada grupo trabajó colaborativamente en GitHub, integrando su trabajo a la rama dev y finalmente a main, conectada a Cloudflare Pages.
- Arquitectura web end-to-end
- Trabajo colaborativo en Git/GitHub
- CI/CD con Cloudflare Pages