herramientas para desarrollo web

ota_photos

Los desarrolladores web orientados al front-end o al diseño son los que están encargados de generar las vistas o una gran UI, del inglés user interface o interfaz de usuario. En términos sencillos, son los creadores del estilo y funcionalidad de las interfaces que interactúan con los usuarios.

Ellos juega un rol muy importante en el desarrollo de aplicaciones web ya que la nueva generación de estas se ha vuelto cada vez mas compleja y competitiva. De esta forma, hay varias herramientas para agilizar y optimizar el proceso general de desarrollo, siempre con la idea de lograr la mejor experiencia de usuario posible. A continuación te presentamos cinco.

Chrome Developer Tools

Chrome Developer Tools son un conjunto de herramientas de depuración integradas en Google Chrome. Los DevTools proporcionan a los desarrolladores acceso a los componentes internos del navegador y sus aplicaciones web. Se utilizan para rastrear problemas de diseño de de manera eficiente y obtener ideas para la optimización de código.

Con las DevTools puedes editar el DOM (HTML)/CSS en tiempo real, depurar JavaScript paso a paso y añadir una terminal. Con esta herramienta puedes aprender mucho acerca de cómo un navegador hace su trabajo realmente, lo que te permite tomar por completo el control de tu aplicación. Además de su sitio, puedes visitar su canal de Youtube donde conseguirás información muy valiosa que seguro sabrás apreciar. También puedes unirte a su comunidad en Google +.

oficial GDC
oficial GDC

Grunt

Grunt es un automatizador de tareas de JavaScript. Básicamente es una librería que nos permite configurar tareas automáticas, lo que nos puede terminar ahorrando valioso tiempo en el desarrollo y despliegue de aplicaciones web. Ofrece una gran cantidad de plugins incluidos para tareas comunes, pero también te da la opción de escribir las tareas que necesites para cubrir tus necesidades.

Una vez instalado, Grunt es fácil de usar y cuando aprendas todo su potencial seguramente no dejaras de usarlo regularmente. En su sitio hay una guía de primeros pasos y una serie de documentación que te ayudara a conocerlo. Si quieres revisar su código y colaborar con el proyecto puedes visitar su perfil de GitHub o unirte a su comunidad en Twitter.

LiveReload

LiveReload es una sencilla herramienta que te ahorrara millones de clicks a la opción de refrescar/recargar el navegador cada vez que haces un cambio en HTML/CSS/JavaScript. Es un protocolo web que dispara eventos al cliente cada vez que los archivos son modificados. El cliente/servidor está disponible en diversas implementaciones.

Se puede descargar para las distintas plataformas desde su sitio. Si quieres dar un vistazo a su código y hacer contribuciones puedes visitar su perfil de GitHub. También puedes seguirlos en Twitter.

oficial GDC
oficial GDC

Mocha

Mocha es un poderoso framework de pruebas de JavaScript que te ahorrara muchos dolores de cabeza. Se ejecuta en Node.js y en el navegador facilitando las pruebas de código asíncrono, siendo esta su característica principal. Los tests de Mocha se ejecutan en serie y permiten reportes flexibles y precisos.

Mocha ofrece sólo el comportamiento BDD o Behavior-driven development y no el assertion/mock framework, pero ya que se puede integrar perfectamente con frameworks dedicados como Chai y Sinon esto no representa un problema.

Mocha puede ser instalado con npm. Para más información puedes visitar su Wiki o unirte a su grupo de Google. Si deseas ver su código fuente puede visitar su perfil en GitHub.

Karma

Karma es un test runner de JavaScript escrito por los creadores de AngularJS. Es el complemento perfecto para correr continuamente todas esas pruebas que escribes con Mocha, con feedback en tiempo real. Con esta herramienta de pruebas puedes ejecutar en modo continuo las pruebas desde tu ordenador hasta producción.

Karma permite correr tus pruebas en múltiples navegadores para que puedas depurar tu código al máximo mientras lo escribes. Para ver su código fuente y hacer contribuciones puedes visitar su perfil en GitHub. También puedes unirte a su comunidad en Twitter.

¿Habías usado algunas de estas maravillosas herramientas? Cuéntanos acerca de tus favoritas.

Más guías y consejos

Recibe cada mañana nuestra newsletter. Una guía para entender lo que importa en relación con la tecnología, la ciencia y la cultura digital.

Procesando...
¡Listo! Ya estás suscrito