Accede a todo EDteam con un único pago¡Sube a premium!

10 extensiones de Visual Studio Code que debes instalar ¡ya!

Ahorra tiempo, configura estilos, trabaja en equipo, comparte tu código en tiempo real y más con estas extensiones de Visual Studio Code. ¡No hay tiempo que perder!

Diseño web
5 minutos
Hace 3 años
10 extensiones de Visual Studio Code que debes instalar ¡ya!

Visual Studio Code es un proyecto Open Source desarrollado por Microsoft para Windows, Linux y MacOS. Es considerado por muchos como el mejor editor de código fuente en el mundo del desarrollo web. Tiene a una gran comunidad para brindarte apoyo y muchas funciones que te facilitan el proceso de desarrollo. Puedes trabajar con diferentes lenguajes de programación, usar tus propios atajos de teclado, refactorizar el código y ¡añadirle aún más funciones para personalizarlo y potenciarlo!

En este blog te mostraré las 10 extensiones que debes instalar ahora mismo en Visual Studio Code para sacarle todo el provecho y facilitar tu trabajo del día a día, ¡comencemos! 🚀

1. PRETTIER

Esta extensión permite formatear el código según las reglas de cada lenguaje. Soporta la sintaxis de una gran cantidad de lenguajes, como JavaScript, JSX, Flow, TypeScript, JSON, HTML, Vue, Angular, CSS, Less, SCSS, GraphQL, MarkDown, CommonMark, MDX y YAML. Prettier ya trae sus reglas predeterminadas, pero tú también puedes crear las tuyas, como dónde van los saltos de línea, las tabulaciones, los espacios, etc. 😎

2. LIVE SHARE

Te permite editar y depurar el código en tiempo real con otro programador, también puedes llamarlos, chatear, compartir terminales y servidores. Como en cualquier otra herramienta de trabajo colaborativo, puedes ver en dónde está tu compañero en el programa y en qué línea del código está trabajando. Si hay un problema que surja en el momento, pueden llamarse y encontrar la solución juntos. ¡Qué viva el trabajo en equipo y en tiempo real! 🙌

3. GITLENS

Esta extensión te brinda muchas herramientas para trabajar con GIT. Te permite ver el autor de las notas, información del repositorio en el que estás, las ramas y, dependiendo del archivo o línea que te encuentres, te mostrará el historial de cambios de cada archivo o cada línea para que puedas hacer comparaciones. ¡Es una herramienta muy completa para trabajar con GIT! 👨‍💻

4. EDITORCONFIG

Esta extensión es de las más conocidas, te permite centralizar los estilos y configurar el editor a través de un archivo para que todos los programadores del proyecto tengan la misma configuración.

5. POLACODE

Te permite sacar capturas del código fuente para que lo compartas donde quieras; en tus grupos de trabajo, redes sociales o para que lo guardes eternamente porque seguramente es lo más hermoso que has creado. Para usarlo solo seleccionas la parte del código que quieres capturar y listo, tendrás los mismos colores, indentaciones, ¡todo! 😎

6. ESLINT

Este linter para JavaScript es uno de los más usados y conocidos. Te ayuda a encontrar errores de sintaxis, lógica o guías de estilo en tu código y te sugerirá las posibles soluciones. Tiene su configuración predeterminada pero también puedes personalizarla. 👌

7. INDENT RAINBOW

Te indica a través de barras de colores en qué nivel de indentación está tu código y así sea más fácil de leer. Si tienes un código pequeño puede que no lo necesites todavía, pero a medida que vaya creciendo sabes que vas a tener problemas, ¿o no? Esta extensión te hará tan feliz como un arcoíris después de la tormenta. 🌈

8. LIVE SERVER

Esta es una de las extensiones más recomendadas por desarrolladores frontends, ya que crea un pequeño servidor local para que puedas ver lo que estás haciendo y se actualice automáticamente con cada cambio.

9. SVG

Te ayuda con toda la sintaxis de SVG, te resalta las coordenadas y el autocompletado de sintaxis.Al final también te permite previsualizar SVG. Si haces desarrollo web ya debes despedirte de los formatos PNG, JPG para los íconos y logotipos, ¡usa SVG y domina el futuro!

10. STORIES

¿Te imaginabas que podías compartir tu trabajo por stories?, ¿o qué podrías ver lo que otros desarrolladores están haciendo con su código? Con esta extensión podrás mostrar partes de tu código, ver el código de otros usuarios e incluso manipularlo, como si fuera un archivo local, y reutilizarlo en alguno de tus proyectos.

Si quieres saber más sobre extensiones de Visual Studio Code, mira nuestro video y descubre todo lo que puedes con ellas. ¡Te esperamos por allá!

"Extensiones de Visual Studio Code QUE DEBES INSTALAR ahora mismo
"

¿Cuáles de estas extensiones ya tienes instaladas?, ¿cuáles no conocías? Si nos faltó alguna por mencionar, ¡déjala en los comentarios! Te leemos 🧐

Comentarios de los usuarios

Pregunta a ChatEDT