Módulo 2·proyecto·10h
Objetivos de aprendizaje
- Construir una landing page completa con HTML5 semántico y CSS3 responsivo
- Aplicar Flexbox y CSS Grid en un diseño mobile-first de 3 breakpoints
- Implementar validación de formulario con JavaScript sin librerías
- Publicar el proyecto en GitHub con historial de commits descriptivos y GitHub Pages
Proyecto integrador
Wallet App — Landing Page
Construir la Wallet App: landing page pública de una billetera digital, con diseño moderno, responsivo y funcional, que demuestre el dominio de HTML5 semántico, CSS3 avanzado y JavaScript básico.
Paso a paso
- Crea la estructura HTML con etiquetas semánticas:
<header>,<nav>,<main>,<section>,<footer>. - Diseña al menos 4 secciones: hero, características, equipo y contacto.
- Implementa el layout con Flexbox y CSS Grid con enfoque mobile-first y responsivo en 3 breakpoints (móvil, tablet, escritorio).
- Crea un formulario de contacto con validación en JavaScript (campos requeridos y formato de email).
- Agrega al menos una animación o transición CSS (hover, fade, slide, etc.).
- Publica el proyecto en un repositorio GitHub con un mínimo de 8 commits descriptivos.
- Activa GitHub Pages para que el sitio sea accesible en línea.
Entregable
Sube el link del repositorio GitHub a la plataforma. El repositorio debe ser público y contener:
- Todos los archivos fuente (
index.html,style.css,script.js) - Un
README.mdcon descripción del proyecto y link a GitHub Pages - Mínimo 8 commits con mensajes descriptivos