Visual Studio Code (VSC) es un editor de código fuente lanzado por Microsoft hace solo unos meses. El software se basa en el motor Atom y, aunque no es de código abierto, ofrece una versión funcional para Linux que puede resultarle útil por varias razones. En este tutorial, veremos cómo instalar, configurar y comenzar con VSC.
Descargar e instalar
Al momento de escribir este artículo, VSC estaba en la versión 0.8.0, lo que indica que la herramienta aún no está completa al 100%. Puede descargar esta versión preliminar desde aquí y extraer el archivo. No se necesita instalación; para iniciarlo, simplemente haga doble clic (ejecutar) en el archivo ejecutable dentro de la carpeta recién creada.
Inicio rápido
Una cosa a tener en cuenta es que VSC está basado en carpetas y no en proyectos. Desde el menú, presione “¿Archivo? Abrir carpeta” y abra la carpeta donde se encuentra su proyecto. Aquí, he montado un proyecto de Expressjs.
Temas
Una de las primeras cosas que puede querer hacer es cambiar la configuración visual o los accesos directos del editor. Esto lo ayudará a trabajar de manera más eficiente, por lo que es importante arreglar las cosas desde el principio. He aquí cómo hacerlo:Vaya al menú principal y seleccione “¿Archivo? preferencias? su opción” como se muestra en la siguiente captura de pantalla:
VSC ofrece un editor de configuración basado en texto en formato JSON. Los usuarios tienen la capacidad de anular los valores predeterminados, por lo que es bastante conveniente. En mi ejemplo, cambié las fuentes predeterminadas a "Source Code Pro" y también cambié el tema de color a "Rojo".
Paleta de comandos
La Paleta de comandos de VSC es sin duda una de las características más fuertes de este editor. Puede abrirlo presionando "Ctrl+P".
Hay muchos accesos directos disponibles en VSC. Presionar el carácter ">" hará que aparezcan los atajos de teclado (también se puede iniciar con "Ctrl+Shift+P"), por lo que esto es probablemente lo más importante que debe recordar, ya que puede controlar todos los aspectos del software mediante el uso de atajos.
Otros caracteres "salvajes" básicos son:
- “?” Para ayuda
- “@” Símbolos abiertos
- “:” para navegación de línea
- “!” para visualización de errores y advertencias
Archivos de trabajo
Estos son los archivos que se encuentran actualmente en proceso de edición, o más conocidos como "pestañas". VSC los mantiene en la barra lateral izquierda para que pueda hacer clic en ellos para obtener su código en la ventana principal. Una forma más conveniente de recorrerlos es con "Ctrl+Tab".
Al hacer clic derecho en la barra lateral, aparece el menú de administración de archivos. A través de este menú, podemos crear una nueva carpeta y archivos, o abrir la ubicación actual en una terminal. También se puede cambiar la ubicación de los archivos arrastrando y soltando.
Edición lado a lado
“Ctrl+\” abrirá más pestañas de vista. Esto también se puede hacer presionando el ícono de "editor dividido" en la parte superior derecha, o haciendo clic derecho en el menú en la barra lateral izquierda.
"Alt+clic izquierdo" también mostrará los múltiples cursores, mientras que es muy fácil agregar más con "Ctrl+Meta+Abajo" o "Ctrl+Meta+Arriba".
Guardado automático
Normalmente, ejecutamos algún tipo de observador, por lo que queremos guardar explícitamente nuestros archivos. Para habilitar/deshabilitar la función "Guardar automáticamente", abra una paleta de comandos ("Ctrl+Shift+P") y escriba "automático" o "guardar".
Menú contextual
Al hacer clic con el botón derecho en una variable, aparecerá el menú contextual para que podamos navegar a los archivos con las definiciones. En el siguiente ejemplo, express() se define en el mismo archivo, por lo que realmente no navegamos a ningún lado.
Una cosa adicional que vale la pena señalar en este punto es que cuando nuestro cursor está sobre una expresión, podemos usar
Buscar y reemplazar
"Ctrl+F" invoca la función típica de buscar y reemplazar que admite expresiones regulares, mientras que "Ctrl+Shift+F" (ubicado en la barra lateral izquierda) nos brindará la capacidad de búsqueda en varios archivos.
Otras características notables
VSC es un editor de código completo, cuenta con la mayoría de las funciones que espera encontrar en un editor, como autocompletado e integración de Git, y finalmente admite el coloreado de sintaxis y la coincidencia de paréntesis para todos los lenguajes más utilizados. Por ejemplo, como se muestra en la siguiente captura de pantalla, inicialicé un git y realicé un solo cambio con fines de demostración.
Otra característica que actualmente está disponible solo para Node (Typescript Javascript) y experimental para Mono (C# y F#) es la compatibilidad con la depuración. Sin embargo, este es un asunto profundo que podría mostrarse en un segundo tutorial si está interesado (indíquelo en la sección de comentarios). Por ahora, sabe todo lo que necesitará para comenzar con VSC. ¡Feliz codificación!