💻 Ejercicios Prácticos de Git

Practica Git con ejercicios progresivos. Cada ejercicio incluye pasos detallados, comandos específicos y puntos de logro.

Ejercicios Interactivos

Sistema de Puntos

Progreso Tracking

Terminal Interactivo

Practica los comandos directamente aquí

Git Terminal Pro

Learning-Git Interactive

0/26

¡Bienvenido al Terminal Git Interactivo! 🚀

Escribe help para ver los comandos disponibles.

Ejemplo: git init para inicializar un repositorio.

Usa ↑↓ para historial | Ctrl+L para limpiar | Escribe 'help' para ayuda

Cómo Usar los Ejercicios

1️⃣

Elige un Ejercicio

Selecciona un ejercicio según tu nivel y sigue los pasos.

2️⃣

Ejecuta Comandos

Escribe cada comando en el terminal de arriba y observa el resultado.

3️⃣

Gana Puntos

Completa pasos para ganar puntos y desbloquear logros.

🌱 Nivel Principiante

Comandos básicos y fundamentos

⚙️ Configuración Inicial de Git

Aprende a configurar Git con tu identidad y personalizar tu entorno.

puntos

⏱️ 5 min★ Dificultad 1/5

0/2 completados

Paso 1: Configura tu nombre de usuario

1/2

git config user.name "Tu Nombre"

💡 Usa tu nombre real o como quieres aparecer en los commits

Paso 2: Configura tu email

2/2

git config user.email "tu@email.com"

💡 Usa el mismo email que usas en GitHub/GitLab

🌱 Tu Primer Repositorio

Crea tu primer repositorio Git y realiza operaciones básicas.

100

puntos

⏱️ 8 min★ Dificultad 1/5

0/5 completados

Paso 1: Inicializa un nuevo repositorio Git

1/5

git init

💡 Este comando crea la carpeta .git oculta

Paso 2: Crea un archivo README

2/5

touch README.md

💡 README.md es el archivo que describe tu proyecto

Paso 3: Verifica el estado del repositorio

3/5

git status

💡 Este comando te muestra qué archivos han cambiado

Paso 4: Agrega el archivo al staging area

4/5

git add README.md

💡 El staging area es donde preparas los cambios para el commit

Paso 5: Crea tu primer commit

5/5

git commit -m "Initial commit"

💡 Los mensajes de commit deben ser descriptivos

📁 Trabajando con Archivos

Aprende a manejar múltiples archivos y entender los estados.

150

puntos

⏱️ 12 min★★ Dificultad 2/5

0/7 completados

Paso 1: Crea un archivo JavaScript

1/7

touch app.js

💡 Simula crear un archivo de código

Paso 2: Agrega contenido al archivo

2/7

echo "console.log(\"Hello World\");" > app.js

💡 Escribe código JavaScript básico

Paso 3: Crea un archivo CSS

3/7

touch style.css

💡 Los proyectos web necesitan estilos

Paso 4: Agrega estilos CSS

4/7

echo "body { margin: 0; }" > style.css

💡 CSS básico para resetear márgenes

Paso 5: Agrega todos los archivos nuevos

5/7

git add .

💡 El punto (.) significa "todos los archivos"

Paso 6: Confirma los cambios

6/7

git commit -m "Add JavaScript and CSS files"

💡 Describe qué archivos agregaste

Paso 7: Revisa el historial de commits

7/7

git log

💡 Verás todos los commits que has hecho

🚀 Nivel Intermedio

Ramas, merge y flujos de trabajo

🌳 Introducción a Ramas

Aprende a crear y manejar ramas para organizar tu trabajo.

200

puntos

⏱️ 15 min★★★ Dificultad 3/5

0/8 completados

Paso 1: Crea una nueva rama para el header

1/8

git branch feature/new-header

💡 Las ramas te permiten trabajar en características independientes

Paso 2: Lista todas las ramas

2/8

git branch

💡 La rama actual aparece marcada con *

Paso 3: Cambia a la nueva rama

3/8

git checkout feature/new-header

💡 Ahora trabajarás en la rama feature/new-header

Paso 4: Crea un archivo para el header

4/8

touch header.html

💡 Trabajo específico de esta característica

Paso 5: Agrega contenido HTML al header

5/8

echo "<header><h1>Mi Sitio Web</h1></header>" > header.html

💡 HTML básico para el encabezado

Paso 6: Prepara el archivo para commit

6/8

git add header.html

💡 Solo en la rama feature/new-header

Paso 7: Confirma los cambios en la rama

7/8

git commit -m "Add website header"

💡 Este commit solo existe en feature/new-header

Paso 8: Vuelve a la rama principal

8/8

git checkout main

💡 main es la rama principal del proyecto

🔄 Práctica de Merge

Aprende a fusionar ramas y integrar características.

250

puntos

⏱️ 18 min★★★ Dificultad 3/5

0/9 completados

Paso 1: Crea una rama para el footer

1/9

git branch feature/footer

💡 Otra característica independiente

Paso 2: Cambia a la rama del footer

2/9

git checkout feature/footer

💡 Trabajarás en el pie de página

Paso 3: Crea el archivo del footer

3/9

touch footer.html

💡 Archivo específico para esta rama

Paso 4: Agrega contenido al footer

4/9

💡 HTML para el pie de página

Paso 5: Prepara para commit

5/9

git add footer.html

💡 Staging del footer

Paso 6: Confirma el footer

6/9

git commit -m "Add website footer"

💡 Commit en la rama feature/footer

Paso 7: Vuelve a main

7/9

git checkout main

💡 Para hacer el merge

Paso 8: Fusiona footer con main

8/9

git merge feature/footer

💡 Integra la característica al proyecto principal

Paso 9: Fusiona header con main

9/9

git merge feature/new-header

💡 Ahora tienes ambas características

🏆 Nivel Avanzado

Conflictos, workflows empresariales

⚔️ Resolución de Conflictos

Aprende a resolver conflictos cuando las ramas modifican el mismo archivo.

300

puntos

⏱️ 25 min★★★★ Dificultad 4/5

0/10 completados

Paso 1: Crea rama para actualizar README

1/10

git branch feature/update-readme

💡 Simularemos un conflicto modificando el mismo archivo

Paso 2: Cambia a la nueva rama

2/10

git checkout feature/update-readme

💡 Trabajarás en actualizar la documentación

Paso 3: Actualiza README en la rama

3/10

echo "# Mi Proyecto Increíble\nEste proyecto es genial." > README.md

💡 Modificas el contenido del README

Paso 4: Prepara README actualizado

4/10

git add README.md

💡 Staging de los cambios

Paso 5: Confirma cambios en README

5/10

git commit -m "Update README with project description"

💡 Commit en feature/update-readme

Paso 6: Vuelve a main

6/10

git checkout main

💡 Para modificar el mismo archivo

Paso 7: Modifica README en main

7/10

echo "# Mi Sitio Web\nUn proyecto web moderno y responsivo." > README.md

💡 Cambio diferente al mismo archivo - esto causará conflicto

Paso 8: Prepara cambios en main

8/10

git add README.md

💡 Staging en la rama principal

Paso 9: Confirma en main

9/10

git commit -m "Update README with website description"

💡 Ahora tienes dos versiones diferentes

Paso 10: Intenta fusionar (causará conflicto)

10/10

git merge feature/update-readme

💡 Git detectará el conflicto y te pedirá resolverlo

🚀 Flujo de Trabajo Avanzado

Implementa un flujo de trabajo profesional con múltiples ramas.

400

puntos

⏱️ 30 min★★★★★ Dificultad 5/5

0/12 completados

Paso 1: Crea rama de desarrollo

1/12

git branch develop

💡 develop es común en Git Flow

Paso 2: Cambia a develop

2/12

git checkout develop

💡 Trabajarás desde develop

Paso 3: Crea rama para autenticación

3/12

git branch feature/user-auth

💡 Feature branch para nueva funcionalidad

Paso 4: Trabaja en autenticación

4/12

git checkout feature/user-auth

💡 Desarrollo de la característica

Paso 5: Crea sistema de autenticación

5/12

touch auth.js

💡 Archivo para manejo de usuarios

Paso 6: Implementa función de login

6/12

echo "// Sistema de autenticación\nfunction login() { return true; }" > auth.js

💡 Código básico de autenticación

Paso 7: Prepara para commit

7/12

git add auth.js

💡 Staging del sistema de auth

Paso 8: Confirma la autenticación

8/12

git commit -m "Implement basic user authentication"

💡 Commit de la nueva característica

Paso 9: Vuelve a develop

9/12

git checkout develop

💡 Para integrar la característica

Paso 10: Integra auth a develop

10/12

git merge feature/user-auth

💡 Merge de feature a develop

Paso 11: Cambia a main para release

11/12

git checkout main

💡 Preparar para producción

Paso 12: Deploy a producción

12/12

git merge develop

💡 Merge de develop a main (producción)