Aquí está la traducción:
“Quienes son nuevos en Visual Studio (VS) Code podrían ver simplemente un editor de código. El verdadero poder de VS Code radica en sus extensiones, terminal integrada y otras funciones. En este tutorial práctico, aprenderás a usar Visual Studio Code trabajando con un repositorio Git.
Utilizando las herramientas integradas de VS Code y algunas extensiones, escribirás código y confirmarás ese código en el control de fuente usando una sola interfaz.
Esta publicación de blog es un fragmento de un capítulo del libro electrónico De Administrador a DevOps: La manera BS de hacer DevOps en Azure. Si te gusta este capítulo y quieres aprender sobre cómo hacer DevOps en Azure, ¡échale un vistazo!
Descripción general del tutorial
En este tutorial, aprenderás a usar varias características de VS Code en Windows construyendo un proyecto con Visual Studio Code y Git. Te han asignado la tarea de descubrir cómo construir una VM de Azure con Terraform como un pequeño proyecto de prueba de concepto (POC). Tienes VS Code y has oído hablar de su capacidad como un IDE completo, y quieres ponerlo a prueba.
Vas a:
- Crear un espacio de trabajo de VS Code para compartir con tu equipo
- Instalar la extensión de Terraform
- Modificar el archivo de configuración de Terraform para que se ajuste a tu convención de nomenclatura y suscripción de Azure”
- Cree un fragmento para una tarea común que se encuentre escribiendo una y otra vez
- Commit del archivo de configuración de Terraform a un repositorio de Git
Este tutorial no pretenderá mostrar cómo usar Terraform para implementar máquinas virtuales de Azure. Ya tenemos un artículo sobre Terraform y máquinas virtuales de Azure para eso. Este tutorial se centrará en aprender Visual Studio Code.
¿Suena interesante este proyecto? Si es así, ¡siga leyendo para comenzar!
Prerrequisitos
Para seguir este tutorial de Git de Visual Studio Code, asegúrese de tener lo siguiente:
- VS Code: Todos los ejemplos utilizarán VS Code 1.44, aunque es probable que versiones anteriores también funcionen.
- Terraform: Todos los ejemplos utilizarán Terraform para Windows v0.12.24.
- Git para Windows instalado: Todos los ejemplos utilizarán v2.26. Si desea que VS Code sea el editor predeterminado de Git, asegúrese de seleccionarlo al instalarlo.
Clone el repositorio de Git
Dado que este tutorial se centrará en trabajar con código en un repositorio de GitHub, su primera tarea es clonar ese repositorio de GitHub en su computadora local.
Para este proyecto, trabajarás desde un repositorio de GitHub llamado VSCodeDemo. Dado que VS Code tiene integración nativa con Git, puedes clonar un repositorio de Git sin configuración adicional. Para hacerlo:
- Abre la paleta de comandos con Ctrl+Shift+P, escribe git donde notarás varias opciones, como se muestra a continuación.
2. Elige Git: Clonar, lo que VS Code te pedirá la URL del repositorio. Aquí, proporciona la URL https://github.com/NoBSDevOps/VSCodeDemo.git y presiona Enter.
3. Elige una carpeta para colocar los archivos del proyecto clonado. Este proyecto colocará la carpeta del repositorio en la raíz de C:\. Una vez que selecciones la ubicación del repositorio, VS Code invocará git.exe en segundo plano y clonará el repositorio en tu computadora.
4. Cuando haya terminado, VS Code te preguntará si deseas abrir el repositorio clonado inmediatamente, como se muestra a continuación, haz clic en Abrir para hacerlo.
Ahora tienes una carpeta abierta en VS Code para el repositorio de Git. Ahora necesitas “guardar” esta carpeta abierta y todas las configuraciones que realizarás en un espacio de trabajo.
Creando un Espacio de Trabajo
Ahora que tienes una carpeta abierta que contiene un repositorio de Git, guarda un espacio de trabajo yendo al menú Archivo y haciendo clic en Guardar espacio de trabajo como….
Guarda el espacio de trabajo como proyecto en la carpeta del proyecto. Luego, VS Code creará un archivo llamado project.code-workspace en la carpeta del repositorio Git. Este espacio de trabajo ahora sabe qué carpeta tenías abierta. Ahora, cuando se abra el espacio de trabajo en el futuro, automáticamente abrirá la carpeta C:\VSCodeDemo.
Ahora, en lugar de un nombre de carpeta, verás el nombre del espacio de trabajo.
Configuración de extensiones
Las extensiones son una de las características más útiles de VS Code. Las extensiones te permiten añadir funcionalidades para ayudarte a gestionar muchos proyectos diferentes. En este tutorial, trabajarás con Terraform.
Abre uno de los archivos de configuración de Terraform en el espacio de trabajo a lo largo de la barra lateral izquierda. Observa cómo se abre una pestaña del editor y muestra el texto, pero eso es todo. No hay ningún resaltado de sintaxis habitual ni ninguna otra característica. VS Code cree que este es un archivo de texto sin formato y lo muestra en consecuencia. Vamos a remediar eso.
Para que VS Code “entienda” un archivo de configuración de Terraform, necesitas una extensión. Las extensiones son una parte enorme de VS Code que abre un mundo de nuevas funcionalidades. En este caso, necesitas la extensión de Terraform para ayudar en la creación de archivos de configuración de Terraform y desplegar infraestructura con Terraform.
Para instalar la extensión de Terraform, haz clic en el botón de extensiones en la barra de actividades y busca terraform. Verás varias extensiones, pero para este proyecto, haz clic en Instalar en el resultado superior creado por Mikael Olenfalk. VS Code instalará entonces la extensión.
Una vez instalado, regresa al espacio de trabajo y haz clic en uno de los archivos TF en el espacio de trabajo. Inmediatamente verás una de las diferencias más obvias al usar una extensión, el color de la sintaxis.
Ahora puedes ver en la siguiente captura de pantalla que VS Code “sabe” qué es un comentario (haciéndolo verde), qué es una cadena (haciéndola roja) y así sucesivamente. Ahora es mucho más fácil leer un archivo de configuración de Terraform.
Hay mucha más funcionalidad incluida con la extensión Terrafom de Mikael. Asegúrate de investigar todos los beneficios potenciales que puedes obtener de esta extensión si utilizas Terraform.
Edición de Código
Lo más probable es que cuando encuentres un script o archivo de configuración en Internet, no vaya a ser exactamente como lo necesitas. Vas a necesitar modificarlo de alguna manera.
En el ejemplo de este tutorial, te gustaría cambiar la etiqueta del bloque main en el archivo de configuración de Terraform infrastructure-before.tf. a quizás project. Para hacer eso, tendrás que encontrar y reemplazar algún texto. En VS Code, hay varias maneras de hacerlo.
Una de las formas más comunes de encontrar una cadena y reemplazarla por otra es la buena y vieja funcionalidad de buscar y reemplazar.
Presiona Ctrl-F y verás un diálogo similar al de la captura de pantalla siguiente. Aquí puedes escribir la cadena que deseas buscar y si haces clic en la flecha hacia abajo, se expandirá y proporcionará un lugar para introducir una cadena para reemplazarla. En la captura de pantalla siguiente, puedes ver opciones como Aa y Ab| para buscar sensible a mayúsculas y minúsculas y también expresiones regulares.
También puedes realizar un “buscar y reemplazar” usando Ctrl-D. Simplemente selecciona el texto que deseas encontrar y comienza a presionar Ctrl-D. Verás que VS Code comenzará a resaltar cada instancia de esa cadena con un cursor intermitente.
Cuando hayas seleccionado todos los elementos, comienza a escribir y VS Code cambiará todas las instancias a la vez como si hubieras seleccionado cada una individualmente.
Ahorro de tiempo con fragmentos de código
Supongamos que te estás adentrando en Terraform y Azure y estás cansado de escribir el bloque de archivo de configuración de Terraform para crear un nuevo grupo de recursos de Azure en el siguiente fragmento de código.
Para ahorrar tiempo creando estos bloques, crea un fragmento de código en VS Code.
Para crear un fragmento de código en VS Code:
- Copia el bloque
azurerm_resource_groupdel archivo de configuración de Terraform Infrastructure-before.tf .
2. Abre la paleta de comandos con Ctrl-Shift-P.
3. Escribe “fragmentos de código” para filtrar la lista de opciones.
4. Selecciona Preferencias: Configurar fragmentos de usuario. Esto mostrará una lista de todos los archivos de fragmentos, generalmente separados por lenguaje.
5. Escribe “terraform” para filtrar los fragmentos de Terraform.
6. Selecciona terraform (Terraform) para abrir el archivo de fragmentos de Terraform (terraform.json).
Con el archivo de fragmentos de Terraform abierto, elimina todos los comentarios y copia/pega el siguiente elemento JSON dentro.
Observa el uso de
\ty las barras invertidas. No puedes colocar caracteres de tabulación directamente dentro de un fragmento. Para representar un carácter de tabulación, debes usar\t. También debes escapar caracteres como comillas dobles, signos de dólar, llaves y barras invertidas con una barra invertida.
8. Guarda el archivo terraform.json.
9. Vuelve al archivo de configuración de Terraform y escribe “rg”. Ahora notarás que aparece una opción para expandir un fragmento.
10. Selecciona el fragmento rg como se muestra arriba. Observa que ahora se expande al fragmento que acabas de crear con tres elementos resaltados.
VS Code resalta cada una de las palabras para actuar como marcadores de posición debido a las variables definidas en el archivo de fragmentos de terraform.json (${1:etiqueta de bloque}).
En este punto, puedes presionar Tab y simplemente escribir los valores que necesitas sin preocuparte de cómo crear el bloque en sí.
Para obtener un desglose completo de la sintaxis de los fragmentos, asegúrate de consultar la documentación de Fragmentos en Visual Studio Code.
Confirmar cambios en Git
En este punto, has clonado un repositorio público de GitHub que contiene un par de archivos de configuración de Terraform. Has editado algunos archivos y ahora estás listo para llevar esos cambios de vuelta al repositorio de GitHub.
Para llevar los cambios de vuelta al repositorio de GitHub, primero debes usar Visual Studio Code y Git para confirmar los cambios en tu repositorio local de Git clonado. Cuando clonaste el repositorio de GitHub anteriormente, descargaste no solo los archivos de configuración, sino también un repositorio de Git.
Si has estado siguiendo, ahora deberías tener abierto el repositorio de Git clonado con un par de cambios pendientes, dos para ser exactos. ¿Cómo sabes eso? Observando el número en la barra de actividades, como se muestra a continuación.
Cuando tienes un repositorio de Git abierto en Visual Studio Code, podrás ver el número de archivos que puedes preparar y confirmar en un repositorio de Git local en la barra de actividades.
Haz clic en el ítem Control de código fuente a la izquierda y verás dos elementos; el archivo de configuración de Terraform infrastructure-before.tf y el espacio de trabajo que guardaste anteriormente (project.code-workspace). El archivo de configuración tendrá una M en rojo a la derecha indicando que ha sido modificado. El archivo de espacio de trabajo tendrá una U en verde a la derecha porque está sin seguimiento, lo que significa que actualmente no está bajo control de origen.
Para asegurarte de que ambos archivos regresen al repositorio de GitHub, primero crea un mensaje de confirmación útil indicando por qué estás comprometiendo estos archivos. El mensaje puede ser cualquier resumen descriptivo. Una vez que hayas escrito un mensaje de confirmación, etapa los cambios. La etapa de cambios en Visual Studio Code en Git agrega el contenido del archivo al área de preparación para realizar un compromiso en el repositorio.
Mientras estás en el panel de Control de origen, haz clic en el ícono + junto a cada archivo para prepararlos, como se muestra a continuación.
Una vez preparados, haz clic en la marca de verificación para confirmar todos los cambios preparados, como se muestra a continuación.
Probablemente recibirás un mensaje de error indicando que necesitas configurar un user.name y user.email en Git.
No hay problema. Simplemente necesitas proporcionar a Git la información que necesita. Para hacerlo, entra en tu terminal integrada de VS Code y ejecuta los siguientes dos comandos cambiando mi dirección de correo electrónico y nombre por la tuya.
Ahora intenta comprometer los archivos. Ahora deberías ver que los archivos se confirman en el repositorio.
Puedes preparar todos los archivos cambiados sin hacer clic manualmente en el + junto a cada archivo al comprometerlos todos a la vez. VS Code automáticamente preparará todos los archivos por ti.
Si estuvieras trabajando en un equipo con un repositorio compartido, el siguiente paso sería enviar estos cambios de vuelta al repositorio de GitHub o abrir una solicitud de extracción.
Conclusión
VS Code es un IDE rico en funciones. No solo puede ayudarte a escribir y entender código mejor, sino que también puede construir y realizar cambios en la infraestructura, invocar utilidades y más. VS Code te proporciona un lugar para gestionar todos tus esfuerzos de desarrollo.
Aunque este tutorial solo cubrió una parte de lo que VS Code puede hacer, este IDE es capaz de mucho más. Si deseas aprender sobre lo que VS Code puede hacer, consulta Lo que necesitas saber sobre Visual Studio Code: Un tutorial.
Source:
https://adamtheautomator.com/visual-studio-code-git/