Un plugin o extensión te va a facilitar enormemente el escribir código porque estos te pueden marcar errores de sintaxis o pueden ayudar a que tu código se vea más estético en tu editor de código. Y estos pueden ser tus grandes aliados al tener que debuggear.
auto close tag
Es una extensión para cuando trabajes con HTML, cuando escribas la apertura de una etiqueta esta se cerrará automáticamente. Esto te reducirá el tiempo al escribir la estructura de una página web.
Link de instalación:
auto rename tag
Es una extensión para HTML, funciona para cuando cambies el nombre de una etiqueta. Cambias el nombre de la de apertura y la etiqueta de cierre se cambia automáticamente.
Link de instalación:
babel javascript
Es una extensión para corregir la sintaxis cuando trabajes con React jsx flow y grapqL. Cuando tienes algún error de sintaxis de esas tecnologías estas te las marcara, pero no telas corregirán tù las tienes que corregir
Link de instalación:
Bracket Pair Colorizer
Es una extensión te facilita identificar los Closures mostrando de diferentes colores los corchetes según corresponde uno con otro.
Link de instalación:
Code Runner
Es una extenciòn para ejecutar còdigo de forma màs veloz solo tienes que seleccionar el còdigo que quieras ejecutar y tendràs la salida en la terminal de VSCode. Soporte los siguientes lenguajes: C, C++, Java, JavaScript, PHP, Python, Perl, Perl 6, Ruby, Go, Lua, Groovy, PowerShell, BAT/CMD, BASH/SH, F# Script, F# (.NET Core), C# Script, C# (.NET Core), VBScript, TypeScript, CoffeeScript, Scala, Swift, Julia, Crystal, OCaml Script, R, AppleScript, Elixir, Visual Basic .NET, Clojure, Haxe, Objective-C, Rust, Racket, Scheme, AutoHotkey, AutoIt, Kotlin, Dart, Free Pascal, Haskell, Nim, D, Lisp, Kit, V, SCSS, Sass, CUDA, Less y Fortran.
Link de instalaciòn:
Debugger for Chrome
Es una extensiòn para implementar las DevTools de Chrome en VSCode y no tener que entrar al navegador.
Link de instalaciòn:
ESLint
ESLint es una herramienta para identificar e informar sobre patrones encontrados en código ECMAScript / JavaScript, con el objetivo de hacer que el código sea más consistente y evitar errores. ESLint usa un AST para evaluar patrones en el código.
Link de instalaciòn:
GitHub Pull Requests and Issues
Es una extensiòn le permite revisar y administrar solicitudes de extracción de GitHub y problemas en Visual Studio Code.
Link de instalaciòn:
GitLens
Es una extensiòn para repositorios locales de git ver rápidamente a quién, por qué y cuándo se cambió una línea o un bloque de código. Retroceda a través de la historia para obtener más información sobre cómo y por qué evolucionó el código. Explore sin esfuerzo la historia y la evolución de una base de código.
Link de instalciòn:
Highlight Matching Tag
Esta extensiòn muestra de diferente color cada tipo de etiqueta html. Opcionalmente, también muestra la ruta para etiquetar en la barra de estado. Aunque VSCode tiene algunas coincidencias de etiquetas básicas, es solo eso: básico. Esta extensión intentará hacer coincidir las etiquetas en cualquier lugar
Link de instalaciòn:
html to JSX
Este plugin te ayuda a convertir HTML a Jsx para que sea compatible con react.JS. solo seleccionas el html que quieras convertir y el plugin lo hace automáticamente.
Link de instalación:
indent-rainbow
Una extensión simple. Esta extensión colorea la sangría frente a su texto alternando cuatro colores diferentes en cada paso. A algunos les puede resultar útil escribir código para Nim o Python.
Link de instalación:
JavaScript (ES6) code snippets
Esta extensión contiene fragmentos de código para JavaScript en la sintaxis de ES6 (admite JavaScript y TypeScript). Nota Todos los fragmentos incluyen el punto y coma final;
los fragmentos de código es lo que son los snippets.
Link de instalación:
language-stylus
Si trabajas con el preprocesador de CSS stylus esta es una muy buena herramienta te da Finalización de selectores, propiedades, valores, variables, funciones, etc.
Vista previa de color y Resaltado de sintaxis
Link de instalación:
Live Sass Compiler
Una extensión VSCode que le ayuda a compilar / transpilar sus archivos SASS / SCSS a archivos CSS en tiempo real con la recarga del navegador en vivo.
Link de instalación:
Live Server
Esta es una extensión para ver la UI de tú página web a alta velocidad porque lo que hace es abrir un puerto en tu computadora por la que puedes entrar desde tu navegador y se refresca cada vez que se cambia los archivos del proyecto
Link de instalación:
Material Icon Theme
Es una extensión para estética de los íconos de tus archivos, según la extensión de los archivos del proyecto colocará automáticamente un icono del lenguaje con el que este trabaje.
Link de instalación:
NPM-Scripts
Esta extensión es para ver y ejecutar scripts de NPM desde la barra lateral sin tener que ira una terminal externa si no los ejecuta en la terminal de VSCode
Link de instalación:
Prettier - Code formatter
Prettier es un formateador de código obstinado. Aplica un estilo coherente al analizar su código y volver a imprimirlo con sus propias reglas que tienen en cuenta la longitud máxima de línea, ajustando el código cuando es necesario. Soporta los lenguajes
JavaScript · TypeScript · Flow · JSX · JSON
CSS · SCSS · Less
HTML · Vue · Angular
GraphQL · Markdown · YAML
Link de instalación:
React-Native/React/Redux snippets for es6/es7
Esta extensión le proporciona fragmentos de JavaScript y React / Redux en ES7 con funciones de complemento de Babel para VS Code. La documentación de los snippets están en el link de instalación
Link de instalación:
React.js with Flow Types code snippets
Esta extensión contiene fragmentos de código para React.js con soporte de tipo de flujo. Tiene soporte para JavaScript (.js) y JavaScript React (.jsx). Los snippets están en el link de instalación:
Settings SyncEs una extensión para sincronizar las configuraciones de VSCode si tú quieres tu misma configuración y los mismos plugins de VSCode donde sea esta herramienta de ayuda haciendo un gist en tu GitHub y a partir de este se configura automáticamente.
Link de instalación:
Synthwave x Fluoromachine
Es una extensión que te permite ejecutar un entorno Linux, incluidas herramientas y aplicaciones de línea de comandos, directamente en Windows, sin la sobrecarga de una máquina virtual tradicional o una configuración de arranque dual.
Link de instalación:
WakaTime
Si eres alguien muy organizado y te gustan las métricas este plugin es para ti. WakaTime es un complemento VSCode de código abierto para métricas, conocimientos y seguimiento del tiempo generado automáticamente a partir de su actividad de programación. Te muestra exactamente cuanto tiempo has estado programando en cada lenguaje entre otras métricas.
Link de instalación:
