Chrome es uno de los navegadores más utilizados del mundo. En gran parte su popularidad se debe a lo fácil que es ampliar sus capacidades mediante el uso de extensiones. El problema muchas veces es encontrar la apropiada entre el enorme mar de opciones que tenemos, ya que existen miles de ellas.
En el caso de los desarrolladores existen unas cuantas extensiones que no debiéramos dejar de utilizar, sobre todo si somos programadores web. En este recopilatorio hemos reunido las 10 que más nos gustan, sin ningún orden en particular.
1.- Chrome Dev Editor
Se trata de un buen editor de código que se ejecuta directamente en el navegador, creado por Google. Aunque su principal intención es que lo uses para desarrollar extensiones para Chrome, lo cierto es que funciona muy bien con cualquier desarrollo web Front-End en general, ya que soporta coloreado de código JavaScript y HTML, plantillas de Polymer, e incluso integración con Git para control de código fuente.
Ofrece multitud de «skins» para mostrar su interfaz de usuario con diferentes colores, y te permite cambiar las teclas rápidas para que coincidan con las de Vim o EMacs.
No va a sustituir a tu editor habitual pero puede venir bien para una urgencia. Además trabaja off-line por lo que se puede usar en un lugar sin cobertura. Si tienes un Chrome Book, sin duda debes instalarlo.
2.- Postman
Un clásico indispensable si estás desarrollando servicios. Esta aplicación permite probar y analizar de manera sencilla los servicios web REST (aunque tiene un soporte menor para servicios SOAP/XML). Te permite probar con facilidad cualquier método, analizar y manipular la respuesta, guardar un histórico, crear colecciones de llamadas… Tiene una versión de pago para trabajo en equipo y mejoras en la documentación, pero con la gratuita tendrás para cualquier necesidad si eres un desarrollador individual.
Aparte de la extensión para Chrome del enlace anterior ofrece su descarga como app independiente para Windows, Mac y Linux. Toda la información en su sitio web.
3.- Secure Shell
Un terminal compatible con XTerm directamente en Chrome. Lo puedes usar como un cliente SSH o emulación de terminal, por lo que te puedes conectar al servidor Linux que alberga tu sitio, y gestionarlo sin salir del navegador.
Para funcionar utiliza hterm, el emulador de terminal escrito enteramente en JavaScript, y un port a NativeClient (el sandbox de Chrome para ejecutar código C y C++) de OpenSSH.
Funciona incluso en Chrome Books, donde puede resultar más útil incluso.
Si te interesa el tema, en su FAQ encontrarás multitud de datos interesantes.
4.- Webmaker
¿Conoces Codepen? Pues WebMaker es como si tuvieras Codepen directamente en tu navegador, y con soporte off-line.
Te permite crear pequeños proyectos y pruebas en HTML, CSS y JavaScript y ver en tiempo real cómo responden a los cambios. Puedes añadir referencias a las bibliotecas más populares para trabajar con ellas en tu proyecto. Además soporta Markdown, Jade, SCSS (Sass), LESS, JSX, CofeeScript y TypeScript… y todo ello sin necesidad de estar conectado a Internet
Es súper-útil para aprender y practicar, para prototipar de manera rápida algunas utilidades, o trabajar en tu equipo con calma antes de pasarlo a Codepen, web a la que por cierto puedes exportar los proyectos con un solo clic.
Ofrece varias distribuciones de elementos en pantalla, puedes guardar los proyectos en local para abrirlos de nuevo más tarde y sacar capturas de pantalla de lo que has creado.
Y es totalmente gratuito.
Más que recomendable.
5.- Python
¿Estás aprendiendo Python 2.x? ¿Te gusta el lenguaje y te interesa hacer pruebas rápidas sin abandonar tu navegador?
Pues esta extensión es para ti. Se trata de un REPL (Read-Eval-Print Loop) o intérprete interactivo de Python 2.7 que funciona directamente en Chrome gracias a la magia de NativeClient.
Se abre una consola que lanza Python y listo: ya puedes empezar escribir comandos, interpretar fragmentos de código, etc…
6.- Form Filler
Esta interesante extensión te ayuda a probar los formularios de tus aplicaciones web, rellenándolos automáticamente con datos inventados, pero con sentido según el tipo de dato. Para ello hace un emparejamiento según el nombre del campo o su tipo con ciertos tipos de información.
Por ejemplo, si el campo es de tipo email introduce una dirección de correo electrónico dentro de unos dominios determinados, o si su nombre es username se inventa un nombre de usuario.
Estos emparejamientos y muchas otras opciones se pueden especificar desde su configuración (botón derecho sobre su icono en Chrome).
En el resto de los campos introduce fragmentos de «lorem ipsum» por lo que requerirá de cierta configuración para afinarlo y adaptarlo a nuestras necesidades, pero una vez hecho nos resultará de bastante ayuda.
7.- Cookies
A través de las herramientas del desarrollador de Chrome tenemos la posibilidad de examinar todas las cookies de cada uno de los sitios web (uno a uno), pero no podemos gestionarlas. Desde la dirección chrome://settings/cookies podemos verlas todas juntas, filtrar por dominio e incluso eliminarlas. Pero en ambos casos el control que tenemos sobre ellas es más bien escaso, entre otras cosas porque a Google no le interesa demasiado que lo tengamos, puesto que vive de tenernos controlados a través de ellas.
Esta extensión nos permite ver todas las cookies de nuestro equipo, pudiendo editarlas, eliminarlas e incluso crearlas nuevas, obteniendo un control total sobre las «galletitas».
Una característica adicional interesante es la posibilidad de guardar conjuntos de cookies en un almacenamiento cifrado y protegido por clave de modo que podamos restaurarlas bajo demanda, solo cuando las necesitemos.
8.- Check My Links
El objetivo de esta útil extensión es muy simple: seguir todos los enlaces que hay en una determinada página para verificar si son correctos o no. A medida que las va comprobando va actualizando la gráfica que indica el estado de comprobación, y al final sabremos exactamente cuántos enlaces hay, cuántos son válidos y cuántos y cuáles están rotos.
En su configuración se pueden especificar qué dominios deberá dejar fuera de las comprobaciones (por ejemplo por defecto trae algunos de Google). Se echa de menos el poder introducir una cadencia para evitar ser bloqueado por cortafuegos de aplicación que pueden encontrar el tráfico que genera un tanto sospechoso. Si las pruebas las vas a realizar en local o contra tus propios dominios únicamente, entonces no hay problema.
Si haces sitios web debería estar en tus indispensables, pero en realidad puede resultar útil para muchas otras situaciones.
9.- DOMFlags
A este cuesta un poco pillarle la gracia, pero cuando se la encuentras, no puedes vivir sin él.
Si has tenido que ajustar el diseño de una página o aplicación web, tocando el CSS de ciertos elementos hasta dar con la combinación apropiada sabrás de qué hablamos: saltar continuamente entre 3 o 4 elementos para tocar alguna de sus propiedades CSS. A veces es un balance entre ajustes por lo que no te queda más remedio que estar saltando de unos a otros para ir probando.
Bein, DOMFlags permite crear «favoritos» dentro de los elementos de una página, y luego saltar de unos a otros con una combinación de teclas rápidas. Basta con marcar un elemento con el atributo domflags para que pase a formar parte de la lista de «bookmarks» de esa página.
Este atributo se le puede poner dinámicamente en las herramientas del desarrollador, a mano o usando un botón específico que te da la herramienta en cada elemento (o la combinación ALT+MAYs+D). O bien puedes ponérselo directamente en tu código fuente para que sean permanentes mientras haces los ajustes.
Una vez establecidos estos «favoritos» puedes cambiar entre ellos pulsándolos en la lista que se genera, o utilizando la combinación de teclas ALT+MAYs+1, 2, 3… dependiendo de si quieres ir al primero, segundo, etc…
Es una utilidad muy simple pero que te puede ahorrar mucho tiempo y mejorar tu productividad.
10.- Library Sniffer
Aunque un desarrollador experimentado puede analizar rápidamente el código de un sitio y las cabeceras de las peticiones para saber con gran grado de acierto qué tecnologías utiliza, siempre viene bien que te lo den hecho.
Y esto es precisamente lo que hace esta extensión: coloca una lupa en la barra del navegador que, cada vez que entras en un sitio web te dice qué tecnologías está utilizando tanto en el lado cliente como en el servidor.
Reconoce la mayor parte de las bibliotecas JavaScript conocidas (jQuery, Angular, React…), los sistemas de gestión de contenidos (estilo WordPress y similares), tecnologías de análisis de sitios (como Analytics) e incluso tecnologías de servidor (como ASP.NET, NodeJS, etc…) y servidores web (IIS, Apache, NGinx…) indicando además sus versiones.
Es útil para saber qué usa nuestra competencia o las aplicaciones que nos gustan.
Es Open Source y podemos ver su código fuente en GitHub.
Con estas extensiones lograrás tener una mayor productividad mientras trabajas o aprendes.
