logo
contacto@lagahe.com
+(34) 967 10 14 30
+(34) 610 74 57 87
Parque Empresarial Campollano
Avenida Cuarta, número 3 - 02007 Albacete

Herramientas de Google Chrome para desarrolladores - Lagahe
58638
single,single-post,postid-58638,single-format-standard,qode-core-1.0,ajax_fade,page_not_loaded,,pitch-ver-1.1, vertical_menu_with_scroll,smooth_scroll,side_menu_slide_from_right,grid_1300,blog_installed,wpb-js-composer js-comp-ver-4.8.0.1,vc_responsive
herramientas google chrome para desarrolladores

Herramientas de Google Chrome para desarrolladores

Para cualquier desarrollador actual front-end, ya sea de aplicaciones web o de aplicaciones móviles híbridas, el navegador se ha convertido en los últimos tiempos en algo más que el visualizador de los resultados del trabajo realizado. Este hecho ha sido provocado desde que los navegadores empezaron hace unos años a incorporar y mejorar herramientas que permiten al desarrollador inspeccionar el código fuente Javascript y el lenguaje de marcado HTML de sus aplicaciones en ejecución, del mismo modo que los entornos de desarrollo tradicionales, como Visual Studio, XCode, Netbeans, Eclipse, etc. permiten ejecutar paso a paso e inspeccionar el funcionamiento del código fuente de la aplicación en desarrollo.
 

Junto con las herramientas de desarrollo integradas en los navegadores, han ido apareciendo una serie de extensiones o plugins que ayudan al desarrollador a realizar tareas complejas o repetitivas sin tener que salir del navegador y abrir otra aplicación diferente. Los propias compañías de los navegadores promueven el desarrollo de estas extensiones y proporcionan manuales de documentación para ello.
 

En este artículo nos vamos a centrar en las extensiones para el navegador Google Chrome, uno de los estándares tanto para el usuario final como para el desarrollador. En cualquier caso, animo al lector a conocer las herramientas de desarrollo incorporadas de Chrome pulsando con el botón derecho del ratón sobre cualquier parte de la página y seleccionando Inspeccionar en el menú contextual.
 

Extensiones de Google Chrome para desarrolladores

 
Como he comentado antes los desarrolladores que van a necesitar este tipo de herramientas son sobretodo aquellos que, en mayor o menor medida, realizan su trabajo en el front-end. Estos desarrolladores pueden ser maquetadores, diseñadores de interfaz, desarrolladores de UX (experiencia de usuario) y desarrolladores front-end de aplicaciones avanzadas con Angular, React, etc. Las herramientas que se muestran a continuación pueden ser de mucha utilidad para todo este tipo de desarrolladores y diseñadores:

 

CSS-Shack: Esta extensión permite crear diseños y exportarlos a un archivo CSS para usarlo en un sitio web. Permite el uso de capas y presenta un editor de imágenes muy completo.

 

ColorZilla: Con esta extensión se puede obtener una lectura de color desde cualquier punto de la pantalla para poder ser almacenado y usado posteriormente. Actualmente las propias herramientas de Chrome ya incluyen un control sencillo similar, pero ColorZilla nos permite hacer esto sin entrar en estas herramientas y además generar gradientes de color, obtener la paleta de color de una página y muchas más opciones.

 

iMacros for Chrome: Esta extensión permite a los desarrolladores grabar una macro al estilo de Office para las tediosas pruebas repetitivas que hay que realizar multitud de veces y llevándolas a cabo pulsando un botón permitiendo concentrarnos en asuntos más importantes.

 

JSONView: Esta útil extensión permite formatear y validar datos en formato JSON abiertos desde el navegador. Muchas APIs y aplicaciones generan sus respuestas en este formato, que sin ayuda de este tipo son muy difíciles de interpretar o leer. Evidentemente, para un desarrollador es fundamental validar los datos JSON que generan sus propias aplicaciones.

 

ng-inspect for AngularJS 1.x: Si eres desarrollador Angular esta extensión es perfecta para inspeccionar tus aplicaciones Angular rápidamente. Añade una pestaña nueva en la opción Elements de las herramientas incorporadas de desarrollador donde se puede conocer el valor de los datos manejados en cada instante por la aplicación.

 

Advanced REST Client: Esta extensión permite a los desarrolladores testear peticiones HTTP contra servicios, ya sean proporcionados por su propia aplicación o por servicios de terceros que puedan ser incorporados a sus aplicaciones. Estas pruebas pueden ser almacenadas y utilizadas a posteriori.

 

En definitiva, existen multitud de extensiones que nos pueden facilitar el trabajo del día a día y no solamente a los desarrolladores o diseñadores. Os invito a consultar el catálogo en https://chrome.google.com/webstore/category/apps donde podréis buscar y probar extensiones y aplicaciones de todo tipo.

Santos Jiménez Sobre el autor

De niño estaba fascinado por las pantallas, los videojuegos y los ordenadores en general. Vale, ahora también. Es un tópico, pero creo que los ingenieros de mi generación entramos de cabeza en el mundo de la informática cortados por el mismo patrón. Mi vocación estaba clara desde entonces y no dudé un segundo cuando llegó el momento de elegir lo que sería mi futuro, con la sorpresa de ver que dentro del mismo se abría un abanico de posibilidades en el que Internet sería mi gran aliado para desarrollar ideas y soluciones innovadoras para todos.

¿Te ha gustado nuestro artículo?

Si quieres recibir las novedades más creativas del mundo online, suscríbete a nuestra newsletter.

* indica obligatorio
No hay comentarios

Deja un comentario: