🤩 Las 24 extensiones de VSCode más geniales que sacudirán tu mundo 🛠

¿Está buscando las increíbles extensiones de VS Code para su aplicación web? Entonces Aquí está la increíble colección de las mejores extensiones de código vs de 2020.

Las extensiones de VS Code son esenciales en el desarrollo web moderno. Son básicamente un editor de código fuente para crear aplicaciones web modernas. Es un editor gratuito y de código abierto. Además, admite una gran cantidad de extensiones que se pueden usar para el desarrollo de aplicaciones web.

Las extensiones de VS Code le permiten agregar depuradores, idiomas y herramientas a su instalación para respaldar su flujo de trabajo de desarrollo. Su rico modelo de extensibilidad permite a los autores de extensiones conectarse directamente a la interfaz de usuario de VS Code y contribuir con la funcionalidad a través de las mismas API que usa VS Code.

Por lo tanto, para ayudarlo a elegir las extensiones correctas que agregarán más valor que los recursos que extraen de su sistema, hemos enumerado esta extensa lista de las mejores extensiones de tendencia disponibles en la actualidad. Si bien algunos de estos son bien conocidos y se instalan comúnmente, otros son extensiones muy recomendadas por desarrolladores experimentados que usan Visual Studio Code.

1. GITLENS

GitLens simplemente lo ayuda a comprender mejor el código. Vea rápidamente quién, por qué y cuándo se cambió una línea o un bloque de código. Además, te permite explorar la historia y la evolución de un código base sin esfuerzo.

GitLens potencia las capacidades de Git integradas en Visual Studio Code. También lo ayuda a visualizar la autoría del código de un vistazo a través de las anotaciones de culpa de Git y la lente del código, navegar y explorar sin problemas los repositorios de Git, obtener información valiosa a través de poderosos comandos de comparación y mucho más.

Descargas: 5.972.117

2. PRETTIER – FORMATEADOR DE CÓDIGO

Es un formateador de código obstinado que 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. Además, soporta muchos idiomas. Se puede integrar con la mayoría de los editores.

Descargas: 7.676.738

3. ESLINTE

ESLint analiza estáticamente su código para encontrar problemas rápidamente. ESLint analiza estáticamente su código para encontrar problemas rápidamente. Está integrado en la mayoría de los editores de texto y puede ejecutar ESLint como parte de su proceso de integración continua. Las correcciones de ESLint tienen en cuenta la sintaxis, por lo que no experimentará errores introducidos por los algoritmos tradicionales de buscar y reemplazar.

Descargas: 10,236,293

4. QUOKKA.JS

Quokka.js es una herramienta de productividad para desarrolladores para la creación rápida de prototipos de JavaScript/TypeScript. Los valores de tiempo de ejecución se actualizan y se muestran en su IDE junto a su código, a medida que escribe. Hace que la creación de prototipos, el aprendizaje y las pruebas de JavaScript/TypeScript sean increíblemente rápidos . De forma predeterminada, no se requiere configuración, simplemente abra un nuevo archivo Quokka y comience a experimentar

Descargas: 754.978

5. INTELIGENCIA DE RUTA

Agrega finalización de estilo Intellisense a los nombres de archivo, lo que le permite escribir fácilmente nombres de ruta largos. Elimina la extensión del archivo de forma predeterminada si la declaración es una declaración de importación

Descargas: 3.318.156

6. AUTOCOMPLETAR RUTA

Esta extensión proporciona finalización de ruta para VS Code para que no tenga que memorizar esas rutas largas.

Descargas: 558.868

7. ESTUDIO VISUAL INTELLICODE

Está diseñado para ayudar a los desarrolladores y programadores con sugerencias de finalización de código inteligente. Además, viene con soporte predeterminado para Python, TypeScript/JavaScript, React y Java. IntelliCode le ahorra tiempo al colocar lo que es más probable que use en la parte superior de su lista de finalización. Las recomendaciones de IntelliCode se basan en miles de proyectos de código abierto en GitHub, cada uno con más de 100 estrellas. Cuando se combina con el contexto de su código, la lista de finalización se adapta para promover prácticas comunes.

Descargas: 6.401.943

8. COSTO DE IMPORTACIÓN

Esta extensión mostrará en línea en el editor el tamaño del paquete importado. La extensión utiliza un paquete web con el complemento babili-webpack para detectar el tamaño importado.

Descargas: 710.298

9. TAMAÑO DE ARCHIVO

Muestra el tamaño del archivo enfocado en la barra de estado del editor.

Descargas: 198.807

10. SERVIDOR EN VIVO

Inicie un servidor local de desarrollo con un solo clic y observe los cambios en vivo con alguna funcionalidad adicional

Descargas: 6.541.468

11. GERENTE DE PROYECTO

Le ayuda a acceder fácilmente a sus proyectos, sin importar dónde se encuentren. No te pierdas más esos importantes proyectos.

Descargas: 1.090.254

12.CORRECTOR ORTOGRÁFICO DEL CÓDIGO

Un simple corrector ortográfico de código fuente para múltiples lenguajes de programación.

Descargas: 1.596.862

13. COLORIZADOR DE PAR DE SOPORTES

Esta extensión permite identificar los soportes a juego con los colores. El usuario puede definir qué tokens combinar y qué colores usar.

Descargas: 1.154.226

14. REMOTO — SSH

La extensión Remote – SSH le permite usar cualquier máquina remota con un servidor SSH como su entorno de desarrollo.

Descargas: 1.605.734

15. DESCANSO CLIENTE

REST Client le permite enviar solicitudes HTTP y ver la respuesta directamente en Visual Studio Code.

Descargas: 1.025.700

16. SNIPPETS DE CÓDIGO JAVASCRIPT (ES6)

Esta extensión contiene fragmentos de código para JavaScript en sintaxis ES6 para el editor Vs Code (compatible con JavaScript y TypeScript).

Descargas: 3.789.793

17. CORREDOR DE CÓDIGO

Code Runner es un fragmento de código de ejecución o un archivo de código para varios idiomas. Es útil ejecutar el archivo de código del editor de texto actualmente activo, a través del menú contextual del explorador de archivos. Además, puede ejecutar fragmentos de código seleccionados en el editor de texto. Admite REPL ejecutando código en un terminal integrado.

Descargas: 4.549.546

18. MUELLE

La extensión de Docker facilita la creación, administración e implementación de aplicaciones en contenedores desde Visual Studio Code. También proporciona depuración con un solo clic de Node.js, Python y .NET Core dentro de un contenedor. La extensión reconoce los espacios de trabajo que utilizan los lenguajes de desarrollo más populares (C#, Node.js, Python, Ruby, Go y Java) y personaliza los archivos de Docker generados en consecuencia. La extensión de Docker aporta una vista de Docker a VS Code. La vista de Docker le permite examinar y administrar los activos de Docker: contenedores, imágenes, volúmenes, redes y registros de contenedores.

Descargas: 5.136.014

19. MEJORES COMENTARIOS

La extensión Better Comments lo ayudará a crear comentarios más amigables para los humanos en su código. Podrá categorizar sus anotaciones en alertas, consultas, TODO, resaltados, etc. Además, el código comentado también se puede diseñar para que quede claro que el código no debería estar allí, y cualquier otro estilo de comentario que desee. se puede especificar en la configuración.

Descargas: 960,927

20. DEPURADOR PARA CROMO

El depurador es una extensión de VS Code para depurar su código JavaScript en el navegador Google Chrome u otros destinos que admitan el protocolo Chrome DevTools. Ayuda a depurar scripts de evaluación, etiquetas de scripts, scripts que se agregan dinámicamente y establecer puntos de interrupción, incluso en archivos de origen cuando los mapas de origen están habilitados.

Descargas: 1.617.311

21. REBAJAS TODO EN UNO

Todo lo que necesita para Markdown (atajos de teclado, tabla de contenido, vista previa automática y más). Admite la siguiente sintaxis de rebajas:

CommonMark Tables , tachado y listas de tareas (de GitHub Flavored Markdown) Soporte matemático (de KaTeX) Frontmatter .

Descargas: 5.136.014

22. MÓDULO_NODO DE BÚSQUEDA

Los módulos de nodo de búsqueda son un complemento simple para VS Code que le permite navegar rápidamente por el archivo dentro del directorio node_modules de su proyecto.

Descargas: 571.040

23. SINCRONIZACIÓN DE AJUSTES

La sincronización de configuración le permite sincronizar configuraciones, fragmentos, temas, íconos de archivos, combinaciones de teclas, espacios de trabajo y extensiones entre máquinas mediante el uso de un Gist simple. Es compatible con GitHub Enterprise, pragmas con palabras clave @sync: host, os y env. Es fácil cargar y descargar con un solo clic. Le permite sincronizar cualquier archivo en sus máquinas.

Descargas: 1.870.161

24. MNP

Esta extensión admite la ejecución de scripts npm definidos en el archivo package.json y la validación de los módulos instalados contra las dependencias definidas en el paquete.json. Los scripts se pueden ejecutar en el terminal integrado o en una ventana de salida.

Descargas: 2.748,32

Conclusión :

Bueno, Visual Studio Code tuvo 4,9 millones de usuarios activos mensuales en 2019. Sin duda, es el mejor editor de código que existe en este momento. Una de las mejores características es Market Place, que ofrece toneladas de extensiones para personalizarlo exactamente según sus necesidades y ayudarlo a escribir código de alta calidad.

En este artículo, recomendaremos estas extensiones de VS Code para los ingenieros front-end que trabajan con CSS, HTML, JavaScript y marcos como Angular, ReactJS y VueJS.

En ThemeSelection estamos utilizando algunas de estas extensiones para crear plantillas de administración de Bootstrap modernas y limpias, plantillas de administración de VueJS , plantillas de administración de Laravel y kits de interfaz de usuario gratuitos .

• Vuexy - Plantilla de panel de administración de Vuejs, React, HTML y Laravel
• Plantilla de administración Bootstrap gratuita de Sneat

También puede descargar plantillas de administración gratuitas creadas con estas extensiones.

Diríamos que esta colección no es la completa y las extensiones no son necesariamente las mejores, pero esperamos que lo ayude a seleccionar las mejores herramientas para ayudarlo a escribir código de alta calidad y convertirse en el mejor desarrollador web.

Si cree que a esta lista le falta una extensión, no dude en sugerirla y ampliarla agregando su favorito en la sección de comentarios.

También publicado en https://dev.to/theme_selection/vs-codes-every-developers-should-use-in-2020-2fa3