Configurar Git y panel de control de versiones
Antes de comenzar a trabajar con Git en VS Code, necesitamos establecer la configuración básica que identificará nuestros cambios en el repositorio. Esta configuración inicial es fundamental para que Git pueda rastrear quién realiza cada modificación en el código.
Configuración global de Git
La configuración global de Git se realiza mediante comandos que establecen tu identidad para todos los repositorios en tu sistema. Abre la terminal integrada de VS Code (Ctrl+Shift+ñ) y ejecuta los siguientes comandos:
git config --global user.name "Tu Nombre Completo"
git config --global user.email "tu.email@ejemplo.com"
Es importante utilizar el mismo email que tienes registrado en tu cuenta de GitHub para mantener la coherencia entre tu configuración local y tu perfil en línea. Puedes verificar tu configuración actual ejecutando:
git config --global --list
Acceso al panel Source Control
VS Code integra completamente las funcionalidades de Git a través del panel Source Control, accesible mediante el atajo Ctrl+Shift+G o haciendo clic en el icono de ramificación en la barra lateral izquierda. Este panel se convierte en tu centro de control principal para todas las operaciones de versionado.
El panel Source Control presenta una interfaz visual intuitiva que elimina la necesidad de memorizar comandos de terminal para las operaciones más comunes. Cuando abres un proyecto que no es un repositorio Git, verás un botón prominente "Initialize Repository" que te permite convertir tu carpeta actual en un repositorio Git con un solo clic.
Elementos del panel Source Control
Una vez inicializado el repositorio, el panel Source Control se organiza en secciones claramente diferenciadas:
La sección "Changes" muestra todos los archivos que han sido modificados, creados o eliminados desde el último commit. Cada archivo aparece con un indicador visual que identifica su estado actual.
La sección "Staged Changes" contiene los archivos que has preparado para incluir en el próximo commit. Los archivos se mueven aquí cuando decides que están listos para ser confirmados.
En la parte superior del panel encontrarás un campo de texto para escribir mensajes de commit y botones para las acciones más frecuentes como commit, pull y push.
Conexión con GitHub
Para conectar tu repositorio local con GitHub, VS Code ofrece una integración nativa que simplifica el proceso de autenticación. Cuando intentas realizar tu primera operación que requiere conexión remota (como push o pull), VS Code te solicitará autenticarte.
El proceso de autenticación con GitHub se maneja automáticamente a través del navegador web. VS Code abrirá una ventana del navegador donde podrás autorizar la aplicación utilizando tu cuenta de GitHub existente. Una vez completada la autenticación, VS Code almacenará las credenciales de forma segura.
Estados visuales de archivos
VS Code utiliza un sistema de colores e iconos para representar visualmente el estado de cada archivo en tu proyecto. Esta representación visual aparece tanto en el Explorer como en el panel Source Control:
Los archivos no rastreados (untracked) aparecen con una "U" verde, indicando que son nuevos en el repositorio y Git aún no los está siguiendo.
Los archivos modificados (modified) se marcan con una "M" amarilla, señalando que han sido cambiados desde el último commit pero aún no están preparados para el siguiente.
Los archivos preparados (staged) muestran una "A" verde si son nuevos o una "M" verde si son modificaciones preparadas para commit.
Indicadores visuales en el Explorer
El Explorer de VS Code también refleja el estado de Git mediante indicadores de color que aparecen junto a los nombres de archivos y carpetas:
Los archivos con cambios no confirmados aparecen en color amarillo, mientras que los archivos nuevos se muestran en verde. Las carpetas que contienen archivos modificados también adoptan estos colores, proporcionando una vista rápida del estado del proyecto completo.
Esta integración visual permite identificar instantáneamente qué partes de tu proyecto han cambiado sin necesidad de abrir el panel Source Control, mejorando significativamente la eficiencia del flujo de trabajo de desarrollo.
Fuentes y referencias
Documentación oficial y recursos externos para profundizar en VSCode
Documentación oficial de VSCode
Alan Sastre
Ingeniero de Software y formador, CEO en CertiDevs
Ingeniero de software especializado en Full Stack y en Inteligencia Artificial. Como CEO de CertiDevs, VSCode es una de sus áreas de expertise. Con más de 15 años programando, 6K seguidores en LinkedIn y experiencia como formador, Alan se dedica a crear contenido educativo de calidad para desarrolladores de todos los niveles.
Más tutoriales de VSCode
Explora más contenido relacionado con VSCode y continúa aprendiendo con nuestros tutoriales gratuitos.
Aprendizajes de esta lección
- Configurar la identidad global de Git para todos los repositorios en el sistema.
- Utilizar el panel Source Control de VS Code para gestionar cambios y commits sin necesidad de comandos.
- Comprender las secciones y funcionalidades del panel Source Control, incluyendo cambios y staged changes.
- Conectar y autenticar un repositorio local con GitHub mediante la integración nativa de VS Code.
- Interpretar los indicadores visuales de estado de archivos en el Explorer y el panel Source Control para un seguimiento rápido de modificaciones.