Mejores Extensiones para Brackets si eres un Desarrollador FrontEnd

Brackets se ha convertirdo en uno de los editores de código más utilizados por los desarrolladores Frontend, por lo tate viene bien saber que extensiones son las más recomendadas a la hora de utilizarse para este tipo de trabajo:

  • Brackets Git: Git se ha convertido en una herramienta obligatoria para el desarrollador, por lo que tenerlo integrado en el editr siempre es buena idea. Desde el editor dispodremos de un nuevo icono en la parte derecha que al pulsarlo nos permitirá, iniciar o clonar un repositorio y por supuetos hacer commits y pushes.
  • Beautify:  De tanto copiar y pegar un código puede quedar hecho un cristo a la hora de las sangrías (tabulaciones, siempre tabulaciones), en la parte derecho tendremos un icono con una varita mágica que nos ordenará el código del fichero seleccionado para que quede “bonito”, de ahí el nombre de la extensión.
  • Emmet: Codificar patrones de etiquetas puede resultar tedioso por lo repetitivo de las acciones de meter dentro de unas etiquetas otras etiquetas. No sería ideal decir qué es loq ue quieres escribir y que fuera el editor el que lo escribiera por ti? De esto va Emmet. Escribe una formula CSS por ejemplo ul>li*5 y al pulsar el tabulador él escribirá un ul que dentro tiene 5 etiquetas li. Esta extensión está presente para los principales editores de código.
  • CanIUse: Los desarrollos de los distintos navegadores web van avanzando con el tiempo y tendremos que mirar periódicamente como van soportando las nuevas funcionalidades de HTML5 o CSS3. Para ello podemos instalar esta extensión que nos facilita la consulta de esta página para hacer este tipo de consultas. PAra activar el panel de búsqueda activa la opción del Menu Ver->Show CanIUse. Y ya podrás buscar si los navegadores soportan esa nueva propiedad CSS que quieres utilizar.
  • Lorem Ipsum Generator: Cuando estamos planteando una maquetación de una página, solemos necesitar de los típicos textos Lorem Ipsum para rellenar esos párrafos. Escribe dentro de un p la palabra “lorem” y pulsa Ctrl-Shift-L y verás como te rellena ese párrafo. En la documentación hay maneras de especificar mucho mejor la cantidad de texto que se rellena.
  • Brackets Icons: Cuando estamos empezando a condificar web, nos cuesta identificar los ficheros que se utilizan para cada cosa. No sería ideal poder ver claramente con un icono para que sirve un fichero? Esto es lo que nos permite esta extensión. Y ya podrás licalizar más rápidamente el fichero que buscas.
  • HTML Skeleton: Escribir un html desde el principio puede resultar una tarea tediosa. Una vez instalado nos aparecerá la opción Edit->Insert HTML Elements… que nos permitirá elegir lo que queramos incluir en el fichero. Super cómodo!

Si estás interesado en seguir formándote tenemos una serie de cursos gratuitos:

Cursos Gratuitos

También disponemos de algunos cursos de pago por si son de tu interés:

https://cursosdedesarrollo.com/tienda/

Curso de Angular:

Angular

Comments

Leave a Reply

*

XHTML: You can use these tags: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>

Este sitio usa Akismet para reducir el spam. Aprende cómo se procesan los datos de tus comentarios.

Suscríbete al Boletín

Si quieres estar al tanto de las novedades del blog, ya sabes :)
* = campo obligatorio

powered by MailChimp!

Uso de cookies

Este sitio web utiliza cookies para que usted tenga la mejor experiencia de usuario. Si continúa navegando está dando su consentimiento para la aceptación de las mencionadas cookies y la aceptación de nuestra política de cookies, pinche el enlace para mayor información. ACEPTAR

Aviso de cookies