Módulo 3: Desarrollo Web y Tecnologías Emergentes

Evaluación Final del Módulo 3

La Evaluación Final del Módulo 3 representa la culminación de tu aprendizaje en desarrollo web. Este proyecto integrador te permitirá demostrar todas las habilidades y conocimientos adquiridos a lo largo del módulo, combinando HTML, CSS, Bootstrap y JavaScript en una aplicación web completa y funcional.

Este proyecto no solo evaluará tu capacidad técnica, sino también tu creatividad, organización y habilidades para resolver problemas reales mediante el desarrollo web moderno.

Requisitos del Proyecto Final

HTML5 Semántico

Estructura semántica correcta utilizando elementos como <header>, <nav>, <main>, <section>, <article>, y <footer>. Código validado y bien formado siguiendo estándares W3C.

CSS3 Avanzado

Estilos personalizados que incluyan: Flexbox/Grid para layout, animaciones CSS, diseño responsivo con media queries, y variables CSS para mantener consistencia.

Bootstrap Integrado

Implementación de componentes de Bootstrap como navbar, cards, forms, y modal. Uso del sistema de grid de Bootstrap combinado con estilos personalizados.

JavaScript Interactivo

Funcionalidades implementadas con JavaScript vanilla: manipulación del DOM, manejo de eventos, validación de formularios, y cambios dinámicos en la interfaz.

AJAX y APIs

Implementación de al menos una petición AJAX utilizando Fetch API para consumir datos de una API externa o simular interacción con un servidor.

Diseño Responsivo

Sitio completamente responsivo que funcione correctamente en dispositivos móviles, tablets y desktop. Experiencia de usuario optimizada para todos los tamaños de pantalla.

Criterios de Evaluación

Rúbrica de Calificación

  • Estructura y Semántica HTML (20%): Uso correcto de elementos semánticos, estructura lógica, validación de código
  • Estilos y Diseño CSS (20%): Calidad del diseño, originalidad, consistencia visual, diseño responsivo
  • Integración de Bootstrap (15%): Uso apropiado de componentes, personalización efectiva, grid responsivo
  • Funcionalidad JavaScript (25%): Interactividad, manejo de eventos, manipulación del DOM, validaciones
  • AJAX y Asincronía (10%): Implementación correcta de peticiones asíncronas, manejo de respuestas y errores
  • Organización y Calidad de Código (10%): Estructura de archivos, comentarios, nomenclatura, legibilidad

Puntos Adicionales:

  • +5% Creatividad: Soluciones innovadoras y diseño original
  • +5% Funcionalidades Extra: Características adicionales no requeridas
  • +5% Optimización: Performance, accesibilidad, SEO básico

Recomendaciones para el Proyecto

Ideas de Proyecto

Portafolio personal: Exhibe tus proyectos y habilidades
Tienda online: Catálogo de productos con carrito
Blog personal: Sistema de publicaciones y comentarios
Aplicación de tareas: Gestor de actividades con CRUD

Herramientas Sugeridas

Editores: VS Code, Sublime Text
Control de versiones: Git y GitHub
APIs públicas: JSONPlaceholder, OpenWeatherMap
Validadores: W3C Validator, Lighthouse

Mejores Prácticas

Mobile-first: Diseña primero para móviles
Progressive Enhancement: Funcionalidad básica primero
Performance: Optimiza imágenes y código
Accesibilidad: Considera todos los usuarios

Recursos de Apoyo

Tema Anterior: 3.5 JavaScript