Visual Studio Code es un fantástico editor de textos enfocado en el sector de la programación. Es uno de los editores más utilizados por la comunidad para proyectos de código y programación. Entre las múltiples ventajas que posee, podemos destacar el tener una amplia gama de extensiónes o plugins, temas de estilo, sistema de configuración, integración con otros servicios y una capacidad de personalización bastante grande.
Instalación de VSCode
Podemos descargar Visual Studio Code desde su web oficial, concretamente desde la categoría Download. Si eres amante del Software Libre, también puedes descargar Visual Studio Codium (VSCodium), que es la versión open source de VSCode, donde no tienes los sistemas de tracking o telemetría de Microsoft.
El comando code
Si te encuentras en Windows y piensas instalar WSL (Linux dentro de Windows), te recomiendo hacerlo primero. Si instalas VSCode después de instalar WSL, te habilitará el comando code. Este comando permite abrir el editor Visual Studio Code simplemente escribiendo lo siguiente desde una terminal:
$ code .Esto significa que quieres abrir VSCode en la carpeta actual. Si no estás seguro si tienes instalado el comando, puedes escribir code --version, si te devuelve la versión, está correctamente instalado.
En caso contrario, de no tenerlo instalado, puedes instalarlo pulsando F1 en VSCode y buscando la opción
Install code command. Otro detalle importante, sería comprobar si tienes instalada la extensiónWSLde Microsoft. En las últimas versiones se instala automáticamente, pero es posible que no la tengas disponible si instalaste VSCode cuando aún no tenías WSL instalado.
Temas e iconos
Cuando queremos trabajar con Visual Studio Code, es un buen consejo elegir un tema para nuestro editor, donde estemos cómodos con su esquema de colores, bordes, fondos, etc... A continuación tienes una tabla con algunos de los temas que considero más interesantes:
- 🌈 Monokai Accents
- 🍮 Flatland Monokai
- 👀 Enfocado Theme
- 🟡 Bluloco Dark Theme
- 🧔 Bearded Theme
- 🐼 Panda Theme
- 🟣 2077 Theme
- 🧛♀️ Dracula Dark Theme
- 💠 SynthWave 84
- 🤍 GitHub Light Theme
- 😸 Gatito Theme
- 💚 Vue Theme
- ⚫ One Monokai Theme
- 🌃 Palenight Theme
- 👧 Doki Theme
- 🗻 Monokai Theme
- 🔵 Cobalt2 Theme
- 🐺 Winter is Coming
Si no te convencen estos temas, sólo son algunos ejemplos, hay muchos más. Puedes encontrar más temas en el VSCode Themes.
También se aconseja instalar un tema de iconos en nuestro Visual Studio Code. Por defecto, VSCode no trae iconos para identificar los archivos, pero con un tema de iconos cada archivo .html, .css, .js, .json, .php, .py u otro formato, tendrá su propio icono particular, que nos permitirá identificar los ficheros de forma más rápida.
Extensiones
De la misma forma que instalamos temas visuales que nos permiten modificar el aspecto visual del editor, también podemos instalar extensiones o plugins, que añadirán ciertas características a Visual Studio Code que por defecto no posee. De esta forma, podemos ampliar sus características y que se adapte mejor a nuestras necesidades.
► Ver más sobre las extensiones que uso en VSCode
Configuración
Nuestro Visual Studio Code tiene algunas opciones establecidas por defecto. Nosotros podemos querer cambiar ciertas opciones para que funcionen de otra forma, y esto se puede hacer tanto desde los menús de VSCode, o desde su panel, pulsando F1 o pulsando CTRL+SHIFT+P y buscando la opción adecuada.
Estos cambios se pueden quedar almacenados en un fichero .json que puede estar en varios lugares:
| Tipo de configuración | ¿Dónde se guarda el archivo de config? |
|---|---|
F1 / Open User Settings (JSON) | C:\Users\Manz\AppData\Roaming\Code\User\settings.json |
F1 / Open Workspace Settings (JSON) | En la carpeta del proyecto: .vscode/settings.json |
Recuerda que la configuración que escribamos afectará a todos los proyectos abiertos con VSCode si se guarda en el primer fichero de configuración (user), o afectará sólo al proyecto en cuestión si se guarda en el segundo fichero de configuración (workspace).
