Para comenzar con buen pie 2021, te traemos una selección con las mejores extensiones para Visual Studio Code. Un equipo ganador con las aplicaciones que harán tu vida como programador infinitamente más sencilla. ¡A por ello!
Que Visual Studio Code se ha convertido en el favorito de una gran parte de la comunidad de programadores no es ningún secreto. Y es que el software gratuito que ponen a nuestra disposición los chicos de Redmond cuenta con todo lo necesario para perfilarse ganador. Microsoft ha hecho lo posible para complacer las necesidades y requerimientos más demandados por la gran mayoría de programadores, y todo de manera gratuita.
El editor de código de Microsoft cuenta con muchas ventajas que lo distancian de sus competidores, aunque como es costumbre en el mundo del software, todos tienden a «adoptar» las mejores características de sus competidores. En cualquier caso, nosotros destacamos las que creemos, son los puntos más fuertes de Visual Studio Code:
Como ya hiciéramos en nuestro artículo de 2020, donde recopilamos las que nos parecieron las mejores extensiones para Visual Studio , con la entrada del año nuevo, creemos conveniente actualizar, o mejor aún, ampliar dicha selección.
Esencialmente, estos plugins o extensiones están centradas en agilizar la programación y en muchos casos incluso automatizar ciertos procesos tediosos y repetitivos, para ganar tiempo. No obstante, existen otros tipos de extensiones muy interesantes. En cualquier caso, estas son nuestras extensiones favoritas para 2021.
Admitámoslo, a menudo nos vemos envueltos en una auténtica maraña de paréntesis, llaves y corchetes, en la que difícilmente logramos ubicarnos. Y es que, aunque extensiones tan útiles como Prettier o Beautify logran ayudarnos a organizar nuestro código «indentandolo» de manera automática, a veces no es suficiente.
Sin embargo, gracias a la segunda y última versión de Bracket pair colorizer esto ya no supone un problema. Con esta útil extensión, las aperturas y cierres de las declaraciones de nuestro código se mostrarán de distinto color de manera automática. De esta manera, anidar código resulta mucho más sencillo, puesto que de un solo vistazo, podemos distinguir su jerarquía y por supuesto, si hemos estructurado correctamente las declaraciones.
Una de las acciones más habituales y repetitivas para un programador es la de guardar los cambios en el código, mostrar la ventana del navegador, y recargar la página. Sin embargo, gracias a la extensión Live Server, podemos agilizar el proceso.
La aplicación nos permite la visualización en tiempo real de las modificaciones que realizamos en nuestro código. Esto agiliza en sobre manera el desarrollo de un proyecto alojado en un servidor local.
Para los fans acérrimos de Bootstrap como nosotros, el uso de esta extensión se antoja indispensable. La velocidad con la que podemos generar snippets, componentes y elementos más comunes del framework gracias a esta extensión, la convierten en una de nuestras favoritas.
Basta con emplear alguna de las simples abreviaturas que el desarrollador ha escogido para cada componente de Bootstrap y de manera automática dispondremos él.
Además, para los proyectos que incluyan la famosa galería de iconos Font Awesome, la extensión incluye atajos a la gran mayoría de ellos.
Este simple, pero útil plugin agiliza en sobremanera la escritura de nuestro código, gracias al «autocompletado» de etiquetas y elementos básicos de HTML, evitaremos tener que escribirlos completamente. Además, no solo «termina de componer» la etiqueta en sí, con su apertura y cierre, sino que inserta automáticamente los atributos esenciales para su correcto funcionamiento.
No obstante, pese a que hay quien lo considere suficiente, a nosotros nos parece algo escueto. Echamos en falta la creación automática de parámetros útiles como «alt» en las imágenes «titles», que pudiéramos completar. Sin duda, una característica que no tardarán en implementar.
Continuamos con la optimización de la escritura en HTML. Gracias a «HTML Tag Wrapper«, podemos «envolver» cualquier extracto de código en un nuevo elemento. Es decir, podemos «crear elementos padre» de manera rápida y sencilla, evitando tener que escribir el inicio y el cierre de la etiqueta, antes y después del código que deseamos anidar.
Lo mejor de todo es que dispone de un atajo de teclado personalizable para poder llevar a cabo la acción a nuestro gusto. Por defecto, suele emplear el atajo de teclas «ctrl+shift+i».
Si las anteriores extensiones para mejorar HTML nos parecían interesantes, la siguiente es sencillamente indispensable. «Auto Rename Tag» lleva a cabo una tarea tan simple como necesaria, que es encargarse de modificar el cierre de una etiqueta al modificar la apertura, de manera automática.
Esto cobra especial sentido cuando disponemos de largas etiquetas de código anidadas, o extensos textos con numerosos párrafos, texto en negrita, itálica o enlaces.
Te recomendamos que la pruebes, no te defraudará.
Sin duda alguna, la extensión más valorada por todos nosotros es «Mithrill Emmet«. Una vieja conocida para programadores provenientes de otros editores como, por ejemplo, Sublime Text.
La extensión se encarga, no solo de autocompletar y sugerir mejoras en nuestro código, sino que nos permite crear estructuras más o menos complejas de manera ágil y sencilla.
A diferencia de otras aplicaciones que permiten construir snippets, Emmet cuenta con una «sintaxis propia» para generar estructuras con múltiples elementos. Si bien es cierto, que requiere de un mínimo aprendizaje dado su amplio catálogo de atajos, con apenas recordar los más elementales, agilizaremos en sobremanera nuestro flujo de trabajo.
Cabe destacar que pese a su gran utilidad, durante nuestros cursos intensivos de diseño web y programación, desaconsejamos su uso. Por eso, insistimos encarecidamente a nuestros alumnos que no lo instalen durante su periodo de aprendizaje. Esto se debe a que al autocompletar y sugerir la sintaxis del código, es probable que no asimilen HTML como es debido. Así que, «profes»… ¡Atentos!
Como se puede ver, el mundo de las extensiones para Visual Studio Code avanza sin descanso. La popularidad del editor de código de Microsoft ha animado a numerosos programadores a desarrollar más y mejores extensiones que facilitan la experiencia de usuario.
No obstante, es cierto que en retrospectiva, esperábamos algo más por parte del equipo de Microsoft. Quizá la implementación de más características de las mejores y más útiles extensiones, de manera predeterminada en el propio Visual Studio Code. Y es que resulta genial disponer de una amplia comunidad de programadores que «mejoren tu software» casi por puro altruísmo, pero un referente como Microsoft, quizá pudiera aportar algo más.
En cualquier caso, todo esto es tan solo la opinión de un humilde servidor. Así que, por supuesto, tanto si coincides conmigo como si discrepas, te invitamos a opinar en la sección de comentarios. Además, si conoces alguna otra extensión que podamos haber olvidado, no dudes en compartirla.
Esperamos que hayas disfrutado de nuestro artículo y te esperamos en el siguiente. ¡Hasta pronto!
En este artículo, aprenderás qué es el Lazy Loading y cómo implementarlo fácilmente en tu… Leer más
En esta guía práctica, te explicamos qué es el presupuesto de rastreo, por qué es… Leer más
¿Alguna vez te has encontrado con un mensaje que te invita a actuar, ya sea… Leer más
Una de las preguntas más comunes entre los desarrolladores web que comienzan a usar JavaScript… Leer más
Descubre qué es y para qué sirve la preimpresión digital para conseguir una buena impresión… Leer más
Ampliamos información para las redes sociales. Descubre cómo gestionar correctamente los consentimientos necesarios en las… Leer más
Ver comentarios
Muchas gracias x la información, nos es de gran utilidad...