Con más del 70% de los programadores VSCode, es por lejos el entorno de desarrollo más popular, desde el desarrollo web hasta la ciencia de datos.
Y aunque VSCode tiene una sólida gama de características básicas, creo que su poder oculto está en el ecosistema de extensiones descargables e instalables desde el mercado.
Imagínese todo esto como una tienda de aplicaciones para extensiones VSCode!
Desde el asistente de codificación artificial basado en inteligencia hasta la integración Git y el formato de código, estas extensiones VSCode cubren una amplia gama de características útiles para mejorar su experiencia de desarrollo.
GitHub Copilot
Función principal: Las sugerencias de código alimentadas por inteligencia artificial.
Si hay una extensión de VSCode tienes que probar en 2023, debe ser GitHub Copilot. Es un asistente de codificación de inteligencia artificial que proporciona consejos de código en línea mientras escribe. Es fácil aprender a usar Copilot, y creo que cada vez más desarrolladores integrarán asistentes de inteligencia artificial como este en su flujo de trabajo. El principal beneficio es ahorrar tiempo y aumentar la productividad proporcionando la terminación automática y consejos de código.
Tabnine
Función principal: Las sugerencias de código alimentadas por inteligencia artificial.
Siguiendo nuestra primera opción, Tabnine es otro asistente de codificación AI que es extremadamente útil para obtener consejos de terminación de código inteligente mientras escribe. Al igual que cualquier buena AI, aprenda de su código y puede sugerir completaciones basadas en el contexto actual y modelos de codificación.
Chat
Función principal: Herramienta AI basada en texto para responder a sus preguntas de codificación.
Es correcto decir que 2023 fue el año de AI, así que tuvimos que incluir la extensión ChatGPT en la parte superior de nuestra lista! ChatGPT es un LLM alimentado por AI que responde a solicitudes en lenguaje natural. Esto incluye conseguir ayuda con la codificación, por lo que ChatGPT se ha convertido en una de las herramientas de IA más populares entre los desarrolladores que quieren trabajar más rápido. Al agregar esta extensión a VSCode, puede integrar ChatGPT directamente en su entorno de desarrollo, por lo que es súper rápido para interactuar con ChatGPT sin dejar el editor.
Servidor en vivo
Función principal: Inicie un servidor local para ver cambios en tiempo real.
Si usted está involucrado en cualquier forma de desarrollo web, esto es definitivamente una extensión que usted tiene que tener! Con este plugin de Visual Studio Code, puede iniciar un servidor de desarrollo local para ver cambios en su código en tiempo real en su navegador. Esto es extremadamente útil si desea comentarios instantáneos sobre los cambios en su código. También puede agregar un segundo monitor y apreciar realmente los beneficios de esta extensión al desarrollar sitios web y aplicaciones web.
Docker.
Función principal: administra contenedores Docker dentro del código VS.
Si pasas tiempo trabajando con contenedores Docker, absolutamente necesitas esta extensión Docker! La principal ventaja es que es mucho más fácil construir, gestionar y distribuir sus aplicaciones containerizzate directamente desde su entorno de desarrollo. Este es un tema recurrente, pero es importante enfatizar que cada vez que puedes quedarte en el mismo ambiente, realmente ahorras mucho tiempo durante el desarrollo. También aprecio la función de depuración con un clic para el contenedor Node.js, Python y .NET.
Excel Viewer
Función principal: Mostrar archivos Excel en VS Code.
Creo que es justo decir que probablemente hemos pasado algún tiempo trabajando con hojas de Excel. Aunque eres fan de Python usando la biblioteca de pandas, probablemente te hayas encontrado trabajando con Excel en diferentes momentos. Por eso creo que esta extensión VSCode es una gran idea, ya que le permite ver los archivos de Excel preve directamente en su editor de códigos. Por lo tanto, que usted necesita trabajar con hojas Excel o CSV, esta es una gran solución para ver rápidamente los datos sin tener que abrir otra aplicación.
Más bonito
Función principal: formato de código automático y aplicación de reglas de estilo.
Si hay una cosa que realmente aprecio, es el código formateado hermosamente! Por eso incluí a Prettier. Para resumir, es un formador de código y un aplicador de reglas de estilo. Esto significa que automáticamente formatear su código de acuerdo con un conjunto de reglas y convenciones cada vez que pulsa Guardar. Esto es un ahorro de tiempo enorme si desea garantizar un formato de código consistente y limpio sin hacerlo manualmente. También es muy útil para los equipos, ya que asegura que todos usen un estilo consistente con muy poco esfuerzo. ¡Sí, no hay necesidad de luchar sobre espacios vs tabulaciones!
Historia de Git
Función principal: Muestra la historia de Git y compara versiones de archivos.
Si usted es un desarrollador web, un científico de datos, un desarrollador de juegos o cualquier otro tipo de programador, es muy probable que utilice comandos Git cada día! De hecho, diría que es casi impensable en el desarrollo moderno no usar un formulario de control de versiones. Sin embargo, si usted es un usuario de Git, necesita esta extensión de VSCode en su vida diaria. Su fuerza principal es que le permite ver el registro Git con una vista interactiva de la historia de su repositorio Git directamente dentro de su editor de códigos. También me gusta la interfaz limpia para comparar ramas y commits.
Ajustes Sync
Función principal: sincronizar la configuración VSCode en diferentes dispositivos.
Si alguna vez te has encontrado planeando en una máquina diferente, las posibilidades son lo suficientemente altas que te has encontrado usando atajos, botones rápidos y extensiones que no están disponibles. Incluso puede sincronizar estos ajustes a su cuenta GitHub, por lo que es muy fácil acceder a ellos en cualquier dispositivo.
GitLens
Función principal: Pantallas Anotaciones en línea Git, gráficos de edición y más.
Volviendo al control de la versión con Git, esta es otra gran extensión para mejorar su flujo de trabajo Git dentro de VSCode. Con GitLens, puedo acceder a a anotaciones en línea, anotaciones de archivos, gráficos de compromiso y un historial de archivos visual directamente en el editor. También es útil monitorear cambios de código con el tiempo dentro de su equipo, incluyendo la razón de tales cambios.
Remoto – SSH
Función principal: Funciona con servidores remotos vía SSH.
Si necesita trabajar con una máquina remota, probablemente use SSH. Sí, puedo instalar esta muy útil extensión de VSCode para conectarse a un servidor remoto o a un contenedor vía SSH dentro de mi editor. Si está siguiendo un curso AWS o está empezando a trabajar en la nube, asegúrese de obtener esta extensión.
Code Runner
Función principal- Ejecute el codigo.
Si alguna vez te has encontrado trabajando en un código fuente grande, es muy probable que hayas encontrado el escenario donde quieres hacer un pequeño cambio, pero no quieres ejecutar todo el código fuente para probarlo. Bueno, no hay problema, porque esta extensión de VSCode le permite realizar fragmentos de código en más de 30 idiomas de programación directamente en el editor de código VS.
Regex Previewer
Función principal: Previsualizar expresiones regulares mientras las escribe.
Si hay un área de programación que puede ser un rompecabezas para los principiantes, debe ser el de expresiones regulares! Si eres nuevo en regex o un profesional, probablemente te hayas encontrado consultando una hoja de referencia para comprobar tu código. Pero se trata de aumentar la productividad. Esto es muy útil, especialmente para los principiantes que pueden tener dificultad para ver lo que su regex está haciendo. Incluso se puede utilizar para aprender regex. No importa lo experimentado que sea, esta extensión puede ser un ahorro de tiempo enorme para confirmar si su regex funcionará como se espera.
TODO Highlights
Función principal: resaltar TODO comentarios en su código.
Como la mayoría de los desarrolladores, a menudo me encuentro escribiendo comentarios TODO en mi código. También seré el primero en admitir que a veces olvido! Bueno, gracias a esta extensión de VSCode, puedo asegurarme de que todos mis comentarios TODO vuelvan. Esto es ideal para hacerlos fácilmente reconocibles y accesibles. Por supuesto, debo recordar hacer el trabajo, pero me gusta cómo ayudas a rastrear tareas y comentarios en tu código.
VSCode-icons
Función principal: Agregue iconos y colores a sus archivos y carpetas en VSCode.
Esta es una extensión bastante básica superficialmente; después de todo, es sólo añadir iconos, ¿verdad? Bueno, sí, lo es. Pero si alguna vez se ha encontrado trabajando en grandes proyectos con muchas carpetas y archivos, navegar puede llegar a ser bastante agotador. Además, todas las carpetas parecen iguales. Aquí es donde esta extensión entra en juego, ya que puede añadir estilo y color a sus carpetas y añadir iconos a los archivos.
Peacock
Función principal: codificación de color para espacios de trabajo de código VS para diferentes proyectos.
Esto es ideal para personalizar los colores de su espacio de trabajo. Los colores proporcionan una sugerencia visual muy agradable para ayudarme a rastrear en qué proyecto estoy trabajando. Una vez más, es súper sencillo, apreciarás la capacidad de identificar y mover fácilmente entre proyectos a través de espacios de trabajo coloreados.
Polacode
Función principal: Crear hermosas pantallas de su código.
A veces tenemos que hacer presentaciones de nuestro código. Y cuando llegue el momento, podemos necesitar compartir fragmentos de código dentro de la documentación o presentaciones. Aquí es donde esta extensión VSCode entra en juego, ya que Polacode le permite crear hermosas pantallas de su código con resaltado de sintaxis. Sólo tienes que resaltar el código que quieres coger, y Polacode hará el resto.
Mejor
Función principal: Mejorar los comentarios de código con colores y formato.
Los comentarios en el código son uno de los elementos más comunes en cualquier proyecto, pero probablemente son los que dedicamos menos atención. Diseñado para mejorar la legibilidad de sus comentarios en el código con colores y formato. También presenta la opción de clasificar mis comentarios en alertas, consultas, todo, resaltar y más.
Code Spell Checker
Función principal: detecta y corrige errores de ortografía en su código.
Comprueba errores de ortografía en tus comentarios, cadenas y archivos Markdown. Creo que siempre es un signo de un verdadero profesional cuando su código no sólo está bien diseñado, pero también es fácil de leer y sin errores de ortografía obvios o comunes.
Turbo Console Log
Función principal: Introducir la consola JS.log instrucciones con un clic.
Siendo uno de los idiomas más populares entre los desarrolladores, tiene sentido incluir algunas extensiones VSCode para JavaScript. Tal vez una de las prácticas más comunes al escribir la JS está utilizando la humilde consola.log instrucciones para probar y depurar ad hoc. Aquí es donde esta extensión brilla, ya que le permite añadir rápidamente instrucciones de consola. registros significativos a su código con atajos de teclado.
Indent-rainbow
Función principal: colorear los niveles de retorno en su código.
Si usted programa regularmente en un idioma como Python que depende del retorno, probablemente se encontró tratando de rastrear los niveles de retorno en la pantalla. Lo sé, he estado allí. Incluso cuando intento mantener mi código plano, a veces es imposible evitar volver a mis proyectos Python. Aquí es donde esta extensión de VSCode entra en juego, ya que añade color a los diversos niveles de retorno en su código. Confía en mí, úsalo e inmediatamente aprecia lo fácil que es leer el código identificado. También aprecio el hecho de que utiliza automáticamente el tamaño actual de la pestaña que establece para su editor.
Marcas
Función principal: añadir y navegar rápidamente entre marcadores en su código.
Independientemente del navegador o elección preferida, es muy probable que haya utilizado marcadores para guardar sitios web. Bueno, porque no podemos hacer lo mismo con las líneas de código que queremos revisar más tarde. Añadir marcadores a las líneas de código en sus archivos para la navegación súper rápida. Especialmente útil al trabajar con un código grande.
Renombramiento automático
Función principal: Renombrar automáticamente pares de etiquetas HTML/XML.
Esta es una extensión VSCode muy simple, pero también es muy útil ya que le ahorra ese poco tiempo extra cuando necesita renombrar etiquetas HTML o XML. Sólo renombra la etiqueta de apertura o cierre, y el otro será automáticamente renombrado para coincidir.
Código de JavaScript Snippets
Función principal: colección de fragmentos de código JavaScript de uso común.
Si usted está planeando regularmente en JavaScript, probablemente se encontró usando los mismos fragmentos de código todo el tiempo con pequeños cambios. Esto es bastante común en el desarrollo web: después de todo, cuando algo es bueno, ¿por qué empezar de nuevo? Aunque acabas de completar un curso de JavaScript, habrás notado que muchos proyectos de desarrollo web utilizan plantillas de código similares. Puede ser un gran ahorro de tiempo cuando usted necesita una caldera rápida para comenzar la bola.
ES7+ React/Redux/React-Native Snippets
Función principal: colección de fragmentos de código React y Redux.
Si eres un profesional o estás siguiendo un curso de React, te encontrarás usando la misma lógica y los mismos enfoques múltiples veces. Así, para ayudarle a ahorrar tiempo, esta extensión VSCode, ya que ofrece una colección de fragmentos de código común para trabajar con React y Redux. Incluso ofrece fragmentos de TipoScript si usted decide cambiar a JS fuertemente tipificado.
CSS Peek
Función principal: navegar / comprobar las definiciones de CSS en su código.
Si usted es un desarrollador web, probablemente pasa mucho tiempo trabajando tanto en HTML como en CSS. Le gustaría echar un vistazo rápido a sus hojas de estilo CSS directamente desde sus archivos HTML. Le permite cambiar rápidamente de código HTML a código CSS y viceversa haciendo clic en un selector CSS en su HTML. Este tipo de multitarea es súper eficiente, cuanto más apreciarás los beneficios en el ahorro de tiempo mientras construyes tus proyectos HTML.
Color
Función principal: colorear el texto y códigos de color hexadecimal en su código.
Si usted es un desarrollador de gama delantera, probablemente pasa mucho tiempo pensando y tomando opciones de color para los elementos de su página web. Pero con esta práctica extensión VSCode, puede ver una pantalla de color rápido directamente en el editor, ya que añade el color elegido a su código. Sí, ese código hexadecimal se coloreará mágicamente en el color real que estás tratando de utilizar!
Todo en uno
Función principal: soporte integrado de marcado en código VS.
Si usted es alguien que ha comenzado a utilizar el marcador para crear su documentación, usted realmente apreciará la funcionalidad agregada que esta extensión VSCode ofrece! Y sí, VSCode ofrece soporte básico de marcado, pero si usted es un usuario experimentado, usted apreciará los atajos, comandos y la terminación automática ofrecida.
Icon Fonts
Función principal: Vista previa e inserción de iconos en el código VS.
Si alguna vez ha buscado iconos para incluir en sus proyectos de desarrollo, usted comprenderá lo aburrido que puede ser! Ofrece una colección de iconos que puedes incorporar directamente en tus proyectos. Utilice snippets para incorporar Glyphicons Bootstrap iconos, iconos Android y mucho más.
Debugger para Chrome
Función principal: Depurar el código JS directamente desde el código VS en Chrome.
Ideal para desarrolladores de JavaScript que quieren depurar dentro de un navegador Chrome directamente en el editor de códigos VSCode. Si usted ha pasado tiempo creando proyectos JavaScript, usted estará muy familiarizado con el hecho de que usted tiene que cambiar a su navegador para probar y depurar. Pero con esta extensión, puede eliminar este paso adicional y hacer todo dentro del entorno de desarrollo.
