Saltar al contenido principal

Configuración de Git en VS Code

Prerrequisitos​

Antes de comenzar, asegúrate de tener instalado:

1. Instalación de Git​

Windows​

  1. Descarga el instalador desde git-scm.com
  2. Ejecuta el instalador con las opciones por defecto
  3. Durante la instalación, selecciona "Git from the command line and also from 3rd-party software"
  4. Selecciona "Use Visual Studio Code as Git's default editor" si aparece la opción

Verificar instalación​

Abre una terminal en VS Code (Ctrl+Ñ o Terminal > New Terminal) y ejecuta:

git --version

Deberías ver algo como: git version 2.43.0

2. Configuración inicial de Git​

Configura tu identidad en Git (estos datos aparecerán en tus commits):

git config --global user.name "Tu Nombre"
git config --global user.email "tu.email@ejemplo.com"

Configura VS Code como editor predeterminado:

git config --global core.editor "code --wait"

Verifica la configuración:

git config --list

3. Autenticación con GitHub​

Opción 1: GitHub CLI (Recomendada)​

  1. Instala GitHub CLI desde cli.github.com
  2. En la terminal de VS Code, ejecuta: 
    gh auth login
  3. Sigue las instrucciones:
    • Selecciona GitHub.com
    • Selecciona HTTPS
    • Selecciona Login with a web browser
    • Copia el código de un solo uso y presiona Enter
    • Se abrirá tu navegador, pega el código y autoriza

Opción 2: Personal Access Token (PAT)​

  1. Ve a GitHub: Settings > Developer settings > Personal access tokens > Tokens (classic)
  2. Haz clic en Generate new token (classic)
  3. Dale un nombre descriptivo (ej: "VS Code - dilvehelp")
  4. Selecciona los siguientes permisos:
    • ✅ repo (acceso completo a repositorios privados)
    • ✅ workflow (para GitHub Actions)
  5. Haz clic en Generate token
  6. ⚠️ IMPORTANTE: Copia el token y guárdalo en un lugar seguro (no podrás volver a verlo)

4. Clonar el repositorio dilvehelp​

Desde VS Code​

Método 1: Command Palette​

  1. Presiona Ctrl+Shift+P
  2. Escribe: Git: Clone
  3. Pega la URL del repositorio: 
    https://github.com/jperaita/dilvehelp
  4. Selecciona la carpeta donde quieres clonar el repositorio
  5. Cuando termine, haz clic en Open o Open in New Window

Método 2: Desde la terminal​

  1. Abre la terminal en VS Code (Ctrl+Ñ)
  2. Navega a la carpeta donde quieres clonar el proyecto: 
    cd E:\Google_Drive\dilve21\help
  3. Clona el repositorio: 
    git clone https://github.com/jperaita/dilvehelp.git
  4. Abre la carpeta en VS Code: 
    cd dilvehelp
    code .

Primera vez que uses Git​

  • Si usaste un Personal Access Token, Git te pedirá usuario y contraseña:
    • Usuario: tu nombre de usuario de GitHub
    • Contraseña: pega tu Personal Access Token (no tu contraseña de GitHub)
  • Si usaste GitHub CLI (gh auth login), no necesitarás introducir credenciales

5. Interfaz de Git en VS Code​

Panel de Control de Código Fuente​

  • Acceso: Haz clic en el icono de rama (Source Control) en la barra lateral izquierda o presiona Ctrl+Shift+G

Elementos principales:​

  1. Changes: Archivos modificados que aún no están en el stage
  2. Staged Changes: Archivos preparados para commit
  3. Commits: Historial de commits
  4. Branches: Gestión de ramas

6. Flujo de trabajo básico con Git​

1. Ver el estado de los archivos​

Los archivos modificados aparecerán en el panel Source Control con letras:

  • M = Modified (modificado)
  • U = Untracked (nuevo archivo sin seguimiento)
  • D = Deleted (eliminado)
  • A = Added (añadido al stage)

2. Agregar archivos al stage (staging)​

Opción A: En el panel Source Control

  • Pasa el ratón sobre el archivo y haz clic en el + (Stage Changes)
  • Para agregar todos los archivos modificados: haz clic en + junto a "Changes"

Opción B: Desde la terminal

git add nombre-del-archivo.md
# o para todos los archivos:
git add .

3. Hacer un commit​

Opción A: En el panel Source Control

  1. Escribe un mensaje descriptivo en el cuadro de texto
  2. Presiona Ctrl+Enter o haz clic en ✓ Commit

Opción B: Desde la terminal

git commit -m "Descripción de los cambios realizados"

4. Sincronizar con GitHub​

Subir cambios (Push)​

Opción A: En el panel Source Control

  • Haz clic en ⋯ (More Actions) > Push
  • O haz clic en el icono de sincronización ↻ en la barra de estado (abajo)

Opción B: Desde la terminal

git push

Descargar cambios (Pull)​

Opción A: En el panel Source Control

  • Haz clic en ⋯ > Pull

Opción B: Desde la terminal

git pull

7. Trabajar con ramas (branches)​

Ver la rama actual​

En la parte inferior izquierda de VS Code verás el nombre de la rama actual (ej: main o master)

Crear una nueva rama​

Opción A: Desde VS Code

  1. Haz clic en el nombre de la rama en la barra de estado
  2. Selecciona Create new branch
  3. Escribe el nombre de la nueva rama (ej: feature/nueva-documentacion)

Opción B: Desde la terminal

git checkout -b feature/nueva-documentacion

Cambiar de rama​

Opción A: Desde VS Code

  1. Haz clic en el nombre de la rama en la barra de estado
  2. Selecciona la rama a la que quieres cambiar

Opción B: Desde la terminal

git checkout main

Publicar una rama nueva en GitHub​

git push -u origin nombre-de-la-rama

8. Extensiones útiles para Git​

Instala estas extensiones desde la vista de Extensiones (Ctrl+Shift+X):

  1. GitLens (eamodio.gitlens)

    • Visualización avanzada de Git
    • Muestra quién modificó cada línea de código
    • Explorador de commits y ramas

  2. Git Graph (mhutchie.git-graph)

    • Visualización gráfica del historial de commits
    • Gestión visual de ramas

  3. Git History (donjayamanne.githistory)

    • Ver historial de archivos
    • Comparar commits

9. Comandos útiles​

Ver historial de commits​

git log --oneline --graph --all

Ver diferencias​

# Ver cambios no guardados
git diff

# Ver cambios en el stage
git diff --staged

Deshacer cambios​

# Descartar cambios en un archivo (antes de commit)
git checkout -- nombre-archivo.md

# Deshacer el último commit (mantiene los cambios)
git reset --soft HEAD~1

# Deshacer el último commit (descarta los cambios)
git reset --hard HEAD~1

Actualizar desde el repositorio remoto​

# Descargar cambios sin fusionar
git fetch

# Descargar y fusionar cambios
git pull

10. Solución de problemas comunes​

"Authentication failed"​

  • Si usas HTTPS: asegúrate de usar el Personal Access Token como contraseña, no tu contraseña de GitHub
  • Considera usar GitHub CLI para autenticación más sencilla

"Permission denied"​

  • Verifica que tienes permisos en el repositorio
  • Contacta al propietario del repositorio (jperaita) para obtener acceso

"Merge conflicts"​

  1. VS Code mostrará los archivos en conflicto
  2. Abre el archivo - verás opciones como "Accept Current Change", "Accept Incoming Change"
  3. Elige la opción correcta o edita manualmente
  4. Guarda el archivo
  5. Haz stage del archivo resuelto
  6. Completa el commit

Limpiar credenciales almacenadas​

# Windows
git credential-manager-core erase https://github.com

# o
cmdkey /delete:git:https://github.com

11. Flujo de trabajo recomendado para dilvehelp​

  1. Siempre trabaja en una rama nueva para nuevas funcionalidades:

    git checkout -b docs/nueva-seccion

  2. Haz commits frecuentes con mensajes descriptivos:

    git add .
    git commit -m "docs: añadir sección de extracciones en CSV"

  3. Sincroniza regularmente con el repositorio remoto:

    git pull origin main
    git push

  4. Crea un Pull Request en GitHub para revisar los cambios antes de fusionar

Recursos adicionales​

Atajos de teclado útiles en VS Code​

AcciónAtajo
Abrir Source ControlCtrl+Shift+G
CommitCtrl+Enter (en el mensaje de commit)
Abrir terminalCtrl+Ñ
Command PaletteCtrl+Shift+P
Buscar archivosCtrl+P
Buscar en archivosCtrl+Shift+F

¡Listo! Ahora tienes Git configurado en VS Code y conectado al repositorio dilvehelp. 🚀

Última actualización en por Jesus Peraita