17. Diferentes formas de añadir al Stage
17. Diferentes Formas de Añadir Archivos al Stage (Staging Area)
Introducción: ¿Qué es el "Stage"?
Imagina que estás preparando una presentación importante. Tienes muchos documentos sobre tu mesa (tu directorio de trabajo), pero solo algunos están listos para ser mostrados. El "Stage" (o área de preparación) es como una bandeja seleccionada donde colocas únicamente los documentos que quieres incluir en tu próxima presentación oficial (tu próximo commit).
Hoy aprenderemos diferentes estrategias para mover archivos a esa bandeja, desde métodos quirúrgicos hasta formas más amplias y visuales.
Método 1: La Precisión Quirúrgica (Línea de Comandos)
Añadir archivos específicos con rutas exactas
Cuando necesitas ser extremadamente preciso, la terminal es tu mejor aliada.
# Añadir un archivo específico dentro de una carpeta
git add uploads/.gitkeep¿Por qué es útil? Porque Git ignora las carpetas vacías. El archivo .gitkeep es un "truco" para decirle a Git: "Oye, esta carpeta es importante, aunque esté vacía, guárdala en el historial".
El peligro de los comodines (wildcards)
Los comodines como * son poderosos, pero pueden fallar si no hay archivos que coincidan exactamente:
# Esto NO funcionará si no hay archivos con nombre antes del .gitkeep
git add uploads/*.gitkeep # ❌ Error: No encuentra coincidencias
# Esto SÍ funcionará (sin comodín)
git add uploads/.gitkeep # ✅ CorrectoRegla de oro: El comodín * busca archivos con cualquier nombre antes del punto. Si tu archivo comienza con un punto (como .gitkeep), el comodín no encontrará nada.
Método 2: Añadir por Contenido de Carpetas (El Poder de la Barra)
Añadir todo dentro de una carpeta (incluyendo subcarpetas)
Imagina que tienes una carpeta css/ con múltiples subcarpetas y archivos. Quieres añadirlo todo de una sola vez:
# Añade TODO lo que hay dentro de css/ (archivos y subcarpetas)
git add css/¡Magia pura! Este comando añade recursivamente todo el contenido de la carpeta css al stage. Es perfecto para:
git add css/- Todos los estilosgit add js/- Todos los scriptsgit add images/- Todas las imágenesgit add fonts/- Todas las fuentes
La estrategia de commits por capas
Puedes hacer commits separados para cada tipo de archivo:
# Commit para estilos
git add css/
git commit -m "Estilos agregados: estructura completa de CSS"
# Commit para fuentes e imágenes
git add fonts/ images/
git commit -m "Fuentes e imágenes agregadas: assets visuales"Método 3: La Alternativa Visual (Interfaz Gráfica)
No todo es terminal. Las interfaces gráficas como la de Visual Studio Code ofrecen una forma visual y cómoda de gestionar el stage.
Preparando el escenario desde cero
Inicializa el repositorio (si es nuevo):
git initAbre la vista de Git en VSCode (icono de branching o atajo
Ctrl+Shift+G)
Añadiendo archivos visualmente
En VSCode, los archivos modificados aparecen en una lista. Puedes:
Hacer clic en el "+" junto a cada archivo para añadirlo individualmente
Hacer clic en el "+" junto a una carpeta para añadir todo su contenido
Escribir mensajes de commit y confirmar con
Ctrl+Enter
Ventajas y desventajas
| Interfaz Gráfica (VSCode) | Línea de Comandos |
|---|---|
| ✅ Más intuitiva y visual | ✅ Mayor control y precisión |
| ✅ Ideal para principiantes | ✅ Permite usar comodines complejos |
| ❌ Menos control sobre patrones específicos | ✅ Automatizable y scripteable |
Comparativa: Métodos de Añadido al Stage
| Situación | Comando / Acción | Cuándo usarlo |
|---|---|---|
| Archivo específico | git add ruta/al/archivo | Cuando solo quieres un archivo concreto |
| Archivo oculto | git add .gitkeep | Sin comodín, directamente el nombre |
| Carpeta completa | git add nombre-carpeta/ | Para añadir todo el contenido de una carpeta |
| Varios tipos juntos | git add fonts/ images/ | Para agrupor assets relacionados |
| Interfaz visual | Clic en "+" en VSCode | Para ver visualmente qué añades |
| Todo el proyecto | git add . | Cuando quieres añadir todos los cambios |
Consejos Profesionales
Commits atómicos: Haz commits pequeños y con sentido. No mezcles estilos con funcionalidades nuevas.
Mensajes descriptivos: Usa mensajes como "Estilos del menú principal" en lugar de "cambios varios".
Revisa antes de commitear: Usa
git statuso la vista de VSCode para asegurarte de que solo añades lo que quieres.El truco del
.gitkeep: Crea siempre este archivo en carpetas vacías que necesites en el repositorio.
Resumen Visual para tu Memoria
📁 Tu Proyecto
├── 📁 css/ → git add css/ → "Estilos agregados"
├── 📁 js/ → git add js/ → "Scripts agregados"
├── 📁 fonts/ → git add fonts/ → "Fuentes agregadas"
├── 📁 images/ → git add images/ → "Imágenes agregadas"
├── 📁 uploads/
│ └── 📄 .gitkeep → git add uploads/.gitkeep → "Carpeta uploads preparada"
└── 📄 index.html → git add index.html (o clic en +)Cuestionario de Repaso
Pregunta 1: ¿Qué comando usarías para añadir todos los archivos dentro de la carpeta css/ incluyendo sus subcarpetas?
Pregunta 2: ¿Por qué el comando git add uploads/*.gitkeep podría no funcionar, y cómo lo corregirías?
Pregunta 3: Menciona dos formas de añadir archivos al stage: una desde la terminal y otra desde Visual Studio Code.
<details> <summary>Ver respuesta</summary> - Terminal: `git add nombre-del-archivo` o `git add carpeta/` - VSCode: Haciendo clic en el símbolo "+" que aparece junto a los archivos modificados en la vista de control de versiones. </details>Pregunta 4: ¿Para qué sirve el archivo .gitkeep y en qué situación es necesario?
Pregunta 5: ¿Cuál es la principal ventaja de usar la terminal frente a la interfaz gráfica para añadir archivos al stage?
<details> <summary>Ver respuesta</summary> La terminal ofrece mayor control y precisión, permitiendo usar comodines complejos y patrones de búsqueda avanzados. Es más fácil de automatizar y scriptear. </details>Pregunta 6: Si quisieras hacer un commit solo con los cambios de imágenes y fuentes, ¿cómo lo harías?
<details> <summary>Ver respuesta</summary> `git add images/ fonts/` y luego `git commit -m "Assets visuales: imágenes y fuentes agregadas"` </details>Pregunta 7: Verdadero o Falso: En Visual Studio Code puedes añadir archivos específicos al stage haciendo clic en el símbolo "+" junto a cada archivo.
<details> <summary>Ver respuesta</summary> Verdadero. Es una de las formas más cómodas y visuales de gestionar el stage. </details>
Comentarios
Publicar un comentario