Configura tu editor Visual Studio Code
Visual Studio Code es un editor de código fuente. Es importante empezar a dominar su funcionamiento ya que en el pasaremos mucho tiempo editando el codigo fuente de nuestras webs y aplicaciones. Este editor es usado tanto para el lenguaje javascript como para editar código html o css.
Es un editor muy versatil y configurable mediante extensiones. Estas nos permitirán ver errores comunes de sintaxis directamente desde el mismo editor. Por ello que te recomendamos que instales las siguientes extensiones que te facilitarán tu día a día. Descarga aquí el VSCode
Extensiones
Ahora que ya tienes el editor instalado, es hora de configurarlo con algunas extensiones para mejorar su funcionalidad a la hora de programar.
ESLint
Si hay algo importante cuando programamos es evitar en la medida de lo posible cometer errores. ESLint es un analizador de código estático, ¿qué es eso? te preguntarás. Pues bien, esta extensión comprobará automáticamente que tu código cumple ciertas reglas básicas de funcionamiento, estructura, sintáxis, etc. Por ejemplo, puedes decirle que cargue las reglas de estilo de Google y te validará que escribas código adecuado a las mismas.
Aquí tienes las reglas de estilo que usan en google.
¿Tu código las cumple? Seguro que con ESLint sí.
Instala ESLint desde el Marketplace
Prettier
Prettier es un formateador de código. Cuando escribimos código es posible que no sigamos al pié de la letra el formato estándar, con esta extensión podemos configurar que nuestro código se formatee automáticamente al guardar.
Tiene soporte para Javascript, HTML, CSS, Markdown, PHP y para librerias de frontend como React o Angular. 100% Indispensable.
Instala Prettier desde el Marketplace
GitLens
Esta extensión va de lujo cuando trabajas en equipo y quieres saber quién puso esa línea de código que te ha hecho pasar una mala tarde debugando.
Podrás ver, revisar y comparar entre diferentes commits y ramas de versiones subidas al repositorio git de tu proyecto. ¡De diez!