Los editores de código nos acompañan en la tarea de programar y muchas veces logramos una conexión muy interesante con la aplicación. A mis alumnos siempre les recomiendo no atarse a una herramienta, porque es importante estar atentos a los nuevo, pero también es cierto que aprender los secretos de un editor nos puede hacer más productivos. En el caso de Visual Studio Code podremos aprovechar muchas funcionalidades y también potenciarlo con extensiones.

Extensiones recomendadas

En este artículo quiero compartir 5 plugins muy interesante para ayudarnos en nuestra tarea del desarrollo Web.

• 🔹 Live Server: una agregado muy importante para los desarrolladores Web. Con este componente es posible visualizar en tiempo real, en el navegador, los resultados de los cambios de código que realizamos en Visual Studio Code. Link: https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer.
• 🔹 Babel JavaScript: si en nuestro trabajo como desarrolladores utilizamos JavaScript moderno, nos puede resultar muy útil un plugin que nos permita resaltar sintaxis. Vale la pena decir que Visual Studio Code puede hacer esto sin ayuda para diferentes lenguajes, pero con este plugin veremos potenciada la funcionalidad para versiones modernas de ECMAScript, React JSX, Flow y GraphQL. Link: https://marketplace.visualstudio.com/items?itemName=mgmcdermott.vscode-language-babel .
• 🔹 NPM Intellisense: para los que trabajamos con dependencia instaladas vía NPM este agregado nos permite con facilidad encontrar elementos de las librerías con las que estamos trabajando en un proyecto. Esta ayuda funciona como un autocompletado mientras escribimos el código y nos puede ayudar a ahorrar mucho tiempo. Link: https://marketplace.visualstudio.com/items?itemName=christian-kohler.npm-intellisense .
• 🔹 Prettier – Code formatter: para quienes escriben mucho código, pero tienen dificultades para llevar el orden, este plugin ayuda con el indentado cuando es necesario. Puede trabajar con diferentes lenguajes, frameworks y librerías, entre las que se pueden mencionar: JavaScript, TypeScript, JSX y GraphQL. Link: https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode.
• 🔹 Bookmarks: una extensión muy útil especialmente cuando debemos trabajar con archivos de muchas líneas. Con este complemento podremos marcar partes de nuestro código para llegar rápidamente a ellas, como si tuvieran marcadores. Link: https://marketplace.visualstudio.com/items?itemName=alefragnani.Bookmarks.

Para saber más sobre Visual Studio Code

• 🌎 Cómo organizar las vistas de archivos en Visual Studio Code.
• 🌎 Visual Studio Code: Atajos de teclado (shortcuts).
• 🌎 Cómo usar la terminal integrada de Visual Studio Code.
• 🌎 Cómo elegir el lenguaje de programación en Visual Studio Code.

Si deseamos conocer más extensiones para Visual Studio Code podemos ingresar en: https://code.visualstudio.com/docs/editor/extension-gallery.