👹 Boss Fight: El Guardián del Historial

“Solo cuando enfrentas al guardián final del Templo puedes considerarte un verdadero Maestro del Versionado.” - Leyenda del Dojo

🎯 La Prueba Definitiva

Has dominado los 7 pergaminos del Módulo 3. Ahora es momento de demostrar tu maestría en UNA misión integradora que combina:

• ✅ Repositorios profesionales (3.1)
• ✅ Gestión de ramas y merges (3.2)
• ✅ Sincronización con GitHub (3.3)
• ✅ Issues y planificación (3.4)
• ✅ Pull Requests y Code Review (3.5)
• ✅ Tablero Kanban (3.6)
• ✅ Automatización con Actions (3.7)

---

📋 Misión: “La Aldea Digital Profesional”

Objetivo: Crear un proyecto web completo con workflow de desarrollo profesional.

Requisitos Mínimos

Tu proyecto debe ser una aplicación web funcional. Elige UNA de estas opciones:

Opción A: Portfolio Personal

• Página de inicio con bio y foto
• Sección de proyectos (al menos 3)
• Formulario de contacto
• Modo oscuro/claro
• Responsive

Opción B: Task Manager

• CRUD de tareas (crear, leer, actualizar, eliminar)
• Filtros por estado (pendiente, completado)
• LocalStorage para persistencia
• Drag & drop para reordenar
• Responsive

Opción C: Blog Minimalista

• Lista de artículos
• Vista individual de artículo
• Sistema de tags
• Buscador
• Markdown rendering

---

🗺️ Hoja de Ruta (Roadmap del Boss Fight)

Fase 1: Fundación (3.1 - Repositorios)

Tareas:

1. Crear repositorio en GitHub

   • Nombre: proyecto-ninja-[tu-nombre]
   • Visibilidad: Public
   • Inicializar con README

2. README profesional debe incluir:

   # 🏯 [Nombre del Proyecto]
   
   ![Badge](https://img.shields.io/badge/status-en%20desarrollo-yellow)
   ![Tests](https://github.com/user/repo/workflows/CI/badge.svg)
   
   ## 📖 Descripción
   [Elevator pitch de tu proyecto]
   
   ## ✨ Features
   - [ ] Feature 1
   - [ ] Feature 2
   
   ## 🛠️ Stack Tecnológico
   - HTML5, CSS3, JavaScript
   - [Framework si usas: React, Vue, etc.]
   
   ## 🚀 Instalación
   ```bash
   # Comandos para correr el proyecto

   📸 Screenshots

   👤 Autor

   [Tu Nombre] - GitHub | LinkedIn

3. .gitignore completo

   node_modules/
   .env
   .env.local
   dist/
   build/
   .DS_Store
   *.log
   coverage/
   .vscode/

4. Estructura de carpetas profesional

   proyecto-ninja/
   ├── .github/
   │   ├── workflows/
   │   └── ISSUE_TEMPLATE/
   ├── src/
   │   ├── components/
   │   ├── assets/
   │   ├── styles/
   │   └── utils/
   ├── docs/
   │   └── screenshots/
   ├── tests/
   ├── .gitignore
   ├── README.md
   ├── package.json
   └── LICENSE

Criterios de aprobación Fase 1:

• ✅ README completo con badges
• ✅ .gitignore previene archivos innecesarios
• ✅ Estructura de carpetas profesional
• ✅ Al menos 3 commits iniciales con mensajes semánticos

---

Fase 2: Estrategia de Ramas (3.2 - Branches)

Tareas:

1. Crear rama develop (desarrollo activo)

   git checkout -b develop
   git push -u origin develop

2. Proteger rama main en GitHub

   • Settings > Branches > Add rule
   • Branch name: main
   • ☑️ Require a pull request before merging
   • ☑️ Require approvals (1 mínimo)

3. Crear 3 feature branches (una por funcionalidad)

   git checkout -b feature/landing-page
   git checkout -b feature/dark-mode
   git checkout -b feature/contact-form

4. Simular conflicto y resolverlo

   • Modifica la misma línea en 2 ramas diferentes
   • Fusiónalas y resuelve el conflicto manualmente
   • Documenta la resolución en el commit

Criterios de aprobación Fase 2:

• ✅ Rama develop existe y está protegida
• ✅ Al menos 3 feature branches creadas
• ✅ Historial muestra al menos 1 merge con conflicto resuelto
• ✅ git log --oneline --graph --all muestra árbol limpio

---

Fase 3: Planificación (3.4 - Issues & 3.6 - Project Board)

Tareas:

1. Crear 10 issues distribuidas así:

   • 4 enhancement (nuevas features)
   • 3 bug (problemas a corregir)
   • 2 documentation (mejorar docs)
   • 1 good first issue

2. Crear labels personalizados:

   • frontend 🎨
   • backend ⚙️ (si aplica)
   • high-priority 🔴
   • low-priority 🟢

3. Crear 2 milestones:

   • v0.1 - MVP (Due: en 2 semanas)
   • v1.0 - Launch (Due: en 1 mes)

4. Asignar issues a milestones

   • 6 issues en v0.1
   • 4 issues en v1.0

5. Crear GitHub Project (Kanban)

   • Columnas: Backlog, To Do, In Progress, Review, Done
   • Añadir todas las issues al board
   • Distribuir 2-3 en cada columna

Criterios de aprobación Fase 3:

• ✅ 10 issues creadas con descripciones profesionales
• ✅ Labels aplicados correctamente
• ✅ 2 milestones con issues asignadas
• ✅ Tablero Kanban configurado con automatizaciones

---

Fase 4: Desarrollo Colaborativo (3.5 - Pull Requests)

Tareas:

1. Por cada feature branch, crear PR:

   Título: feat: Implementar [nombre feature]
   
   Descripción:
   ## 📝 Resumen
   [Qué hace esta feature]
   
   ## 🎯 Problema que Resuelve
   Closes #[número de issue]
   
   ## ✨ Cambios
   - Añadido componente X
   - Actualizado estilo Y
   
   ## 📸 Screenshot
   ![Preview](url)
   
   ## ✅ Checklist
   - [x] Código funcional
   - [x] Tests pasan
   - [x] Documentación actualizada

2. Simular code review:

   • Si trabajas solo: crea cuenta secundaria o pide a amigo
   • Dejar al menos 3 comentarios constructivos
   • Aplicar 1 sugerencia con “Commit suggestion”
   • Aprobar y fusionar

3. Cerrar issues automáticamente:

   • En el PR, usa Closes #X en la descripción
   • Al fusionar, verifica que la issue se cierra sola

Criterios de aprobación Fase 4:

• ✅ Al menos 3 PRs creados con descripciones completas
• ✅ PRs tienen screenshots o GIFs
• ✅ Al menos 1 PR tiene comentarios de review
• ✅ Issues se cerraron automáticamente al fusionar

---

Fase 5: Automatización (3.7 - GitHub Actions)

Tareas:

1. Workflow de Tests (.github/workflows/ci.yml)

   name: CI
   
   on:
     push:
       branches: [main, develop]
     pull_request:
       branches: [main]
   
   jobs:
     test:
       runs-on: ubuntu-latest
       steps:
         - uses: actions/checkout@v4
         - uses: actions/setup-node@v4
           with:
             node-version: '20'
         - run: npm ci
         - run: npm test
         - run: npm run lint

2. Workflow de Deploy (.github/workflows/deploy.yml)

   name: Deploy to Production
   
   on:
     push:
       branches: [main]
   
   jobs:
     deploy:
       runs-on: ubuntu-latest
       steps:
         - uses: actions/checkout@v4
         - run: npm ci
         - run: npm run build
         - uses: peaceiris/actions-gh-pages@v3
           with:
             github_token: ${{ secrets.GITHUB_TOKEN }}
             publish_dir: ./dist

3. Configurar GitHub Pages:

   • Settings > Pages
   • Source: gh-pages branch
   • Tu app estará en: https://user.github.io/proyecto-ninja/

4. Añadir badge de CI al README:

   ![CI](https://github.com/user/repo/workflows/CI/badge.svg)

Criterios de aprobación Fase 5:

• ✅ Workflow de CI ejecutándose correctamente
• ✅ Workflow de deploy funcional
• ✅ Proyecto desplegado en GitHub Pages o similar
• ✅ Badges visibles en README

---

Fase 6: Sincronización (3.3 - SSH & Push/Pull)

Tareas:

1. Configurar SSH (si no lo hiciste antes)

   • Generar llave SSH
   • Añadirla a GitHub
   • Cambiar remoto a SSH

2. Simular trabajo en equipo:

   • Edita archivo en GitHub directamente
   • En local, haz cambios en el mismo archivo
   • git pull y resuelve conflicto

3. Mantener historial limpio:

   • Usa git pull --rebase para evitar merge commits
   • Squash commits antes de merge si es necesario

Criterios de aprobación Fase 6:

• ✅ SSH configurado (no pide contraseña en push/pull)
• ✅ Al menos 1 conflicto de pull resuelto
• ✅ Historial limpio sin merge commits innecesarios

---

🏆 Entregables Finales

Al completar el Boss Fight, tu repositorio debe tener:

1. README profesional con:

   • Badges de CI/CD
   • Screenshots del proyecto
   • Instrucciones de instalación
   • Link a demo en vivo

2. Historial de Git limpio:

   • Commits semánticos (feat:, fix:, docs:)
   • Al menos 15 commits
   • Ramas bien estructuradas

3. Issues y PRs:

   • 10 issues (al menos 7 cerradas)
   • 3 PRs fusionados
   • 2 milestones con progreso

4. GitHub Project:

   • Tablero Kanban activo
   • Cards distribuidas
   • Al menos 1 automatización configurada

5. GitHub Actions:

   • CI pipeline funcional
   • Deploy automático
   • Proyecto en vivo (GitHub Pages, Vercel, Netlify)

6. Código funcional:

   • Aplicación web completa y funcional
   • Responsive
   • Sin errores de consola

---

🎖️ Niveles de Maestría

🥉 Genin (Aprobado):

• Cumple requisitos mínimos de las 6 fases
• Proyecto funcional
• Workflow básico implementado

🥈 Chunin (Muy Bien):

• Todo lo anterior +
• Proyecto desplegado en producción
• Tests unitarios implementados
• Documentación completa

🥇 Jonin (Excelente):

• Todo lo anterior +
• CI/CD completamente automatizado
• Code coverage >70%
• Performance optimizada (Lighthouse >90)
• Diseño profesional/original

🏅 Kage (Maestría Total):

• Todo lo anterior +
• Múltiples workflows avanzados
• Integración con servicios externos (DB, APIs)
• Monorepo con múltiples apps
• Contribución documentada a proyecto open source

---

📅 Tiempo Estimado

• Genin: 8-12 horas
• Chunin: 15-20 horas
• Jonin: 25-30 horas
• Kage: 40+ horas

---

🎬 Entrega del Reto

Cuando completes tu Boss Fight:

1. Sube tu repositorio a GitHub (público)

2. Completa el formulario de entrega:

   • URL del repositorio
   • URL de demo en vivo
   • Nivel al que aspiras (Genin/Chunin/Jonin/Kage)
   • Captura de pantalla del tablero Kanban
   • Captura de git log --graph

3. Comparte en Discord:

   • Canal: #boss-fights
   • Hashtag: #GuardianDelHistorial
   • Menciona qué fue lo más difícil

---

💡 Tips del Sensei

1. No lo hagas todo de golpe: Sigue las fases en orden
2. Commits frecuentes: Mejor 20 commits pequeños que 2 gigantes
3. Lee los mensajes de error: Git te dice exactamente qué está mal
4. Usa GitHub Desktop si te atoras con comandos
5. Pide ayuda en Discord sin miedo
6. Disfruta el proceso: Esto es lo que harás TODOS LOS DÍAS como desarrollador

---

🎓 Al Completar Este Reto

Habrás demostrado que puedes:

✅ Gestionar un proyecto real con Git
✅ Colaborar en equipo con GitHub
✅ Automatizar deployments
✅ Planificar y ejecutar features
✅ Revisar código profesionalmente
✅ Mantener historial limpio
✅ Trabajar con metodologías ágiles

¡Eres oficialmente un Ninja de Git & GitHub! 🥷🏆

---

Siguiente Módulo: 4. El Arte del Frontend Moderno - React & TailwindCSS

¿Venciste al Guardián? ¡Sube tu certificado ninja con #MaestroDelGit! 👹✅