Visual Studio Code: Extensiones y Shortcuts Esenciales
Por mucho tiempo fui fans de Sublime, sin embargo Microsoft sacó un editor de texto que a mi gusto es más amigable para los que no somos programadores, pues para mi ha sido mucho más fácil incorporando algunas extensiones.
1.-Visual studio code plugin for Bootstrap 4 & Font awesome
Esto salva minutos valiosos construyendo la columna vertebral de nuestro proyecto, pues solo basta crear el nuevo archivo “Index.html” de tu sitio, luego ingresar b4-$ e inmediatamente se escribirán tanto el Head y Body del sitio, como la inserción de Bootstrap 4 por CDN. Además del metatag responsivo para distintos dispositivos.
La única desventaja es que no inserta la última versión de Bootstrap 4, y/o Font Awesome, por lo tanto pueden haber algunos elementos o clases que no funcionen correctamente. De hecho con la última actualización de este último y el cambio de clase de los iconos, que pasaron a invocarse desde la clase .fa a fas, es probable que no se muestren.
2.- Visual Studio Code HTML Snippets
Esto salva minutos valiosos para cuando no recuerdas algún tag o si aún se encuentra disponible. Está extensión es básicamente como el autocompletar y corrector de cualquier editor de texto convencional, pero enfocado en HTML5.
3.- IntelliSense for CSS class names in HTML
Esto cumple básicamente la misma labor que la anterior, salvo que es específico para CSS.
4.- Formatear e Indentar el Código
Esto es clave para el orden, y la detección de errores en nuestro código. Aún así y aparentemente existen confusiones respecto al comando correcto no obstante y como vemos en la imágen la combinación correcta es Command + Shift + F para Mac y Ctrl +Shift+ P para Windows.
5.- Formatear e Indentar CSS Prettier-VSCode
Tiene básicamente la misma función que el comando anterior formateando incluso Javascript.