Se lee en 2 minutos

Visual Studio Code se está convirtiendo día a día en el editor de código más utilizado por maquetadores y programadores frontend

En los últimos años yo mismo he estado usando casi exclusivamente Sublime Text, pero a día de hoy utilizo Visual Studio Code como editor principal. 

Lo mejor de Visual Studio Code es que trae de base todo lo bueno de Sublime Text, incluida gran parte de las combinaciones de teclas. Además, la instalación y configuración de nuevas extensiones es muy fácil.

A continuación te muestro las extensiones de Visual Studio Code que considero más útiles para maquetadores: 

  1. Auto Close Tag (by Jun Han): cierra automáticamente las tags de HTML/XML al estilo de Sublime Text.
  2. Auto Rename Tag (by Jun Han): renombra de forma automática parejas de tags de HTML/XML .
  3. AutoFileName (by JerryHong): sugiere los nombres de los archivos que forman parte de tu proyecto a la hora de vincularlos.
  4. Beautify css/sass/scss/less (by michellemelluso): ‘desminifíca’ con una simple combinación de teclas archivos css y relacionados. 
  5. Can I Use (by Mahmoud Ali): comprueba la compatibilidad en navegadores de las características que quieras usar en HTML5, CSS3, SVG, JS, etc.
  6. Easy Sass (by Wojciech Sura): compila tus archivos SASS/SCSS a CSS con solo guardar. Permite exportar tus CSS directamente a formato ‘minificado’.  
  7. IntelliSense for CSS class names in HTML (by Zignd): autocompleta nombres  de clases CSS propias o de los frameworks que estés usando en tu proyecto (Bootstrap, Foundation, etc.).
  8. open in browser (by TechER): muestra un listado de los navegadores que tengas instalados en tu sistema para elegir con cual quieres previsualizar tus documentos. 
  9. Project Manager (by Alessandro Fragnani): administra tus proyectos para poder alternar entre ellos desde dentro de Visual Studio Code. Permite además definir un listado de tus proyectos favoritos para mayor rapidez.
  10. Sass (by Robin Bentley): revisa la sintaxis de tus archivos SASS/CSS para que la compilación a CSS sea siempre correcta. 

Encontrarás más extensiones en el Marketplace para Visual Studio.