Automatización del workflow frontend

Charla de Automatización del workflow frontend en Women Tech Maker Lima.

Transcript

1. Automatización del Workflow Frontend Elizabeth Manrique Frontend Web Developer - No2
2. Elizabeth Manrique Lezameta • Frontend Web Developer y una entusiasta empedernida de las nuevas tecnologías. • Experiencia en el desarrollo de webs para el sector del marketing digital y comercial. • Actualmente me divierto como Frontend Web Developer en No2 – Agencia de Creatividad Digital. @ecmanrique
3. “Hacer frontend es como comer una naranja”
4. Los tiempos destinados para desarrollo son muy apretados
5. Tiempo Dinero Alcance
6. Sacrifico tiempo destinado para otras actividades de mi vida diaria y así poder cumplir con los objetivos trazados
7. Como resultado: Duermo poco. Como fuera de la hora. Descuido mi salud. No paso tiempo con la familia. Etc.
8. No soy feliz
9. ¡Automatiza!
10. Transferir tareas realizadas habitualmente por nosotros a un conjunto de elementos tecnológicos.
11. Console is your friend!
12. ConEmu iTerm2 Terminator
13. • Control de versiones • Navegación de archivos • Comandos unix • Editor de código liviano • Preprocesadores • NodeJS
14. Mapea tu workflow
15. Frameworks, Testing, Docs, Dependencias, Performance, Optimización, Build, Integración continua, Deployment, Control de Versiones, etc.
16. Automatiza tus tareas repetitivas
17. Herramientas que ayudan a automatizar
18. • Disponible más de 2000 tareas. • Configuración no tan sencilla. • Comunidad amplia y en aumento. http://gruntjs.com
20. • Intuitivo, menos configuración. • Más rápido(trabaja en memoria). • Más de 200 tareas disponibles. • Comunidad relativamente nueva http://gulpjs.com/
22. http://markdalgleish.github.io/presentation-build- wars-gulp-vs-grunt/#50 http://jaysoo.ca/2014/01/27/gruntjs-vs-gulpjs/ Algunas lecturas interesantes…
23. http://bower.io/ • Manejador de paquetes de librerías JS. • Más de 300 paquetes disponibles. • Twitter.
24. + + http://yeoman.io/ Más de 400 proyectos
25. MI WORKFLOW ACTUAL
26. DEMO Source code: https://github.com/emanrique/skel
27. Puedes modificarlo e integrarlo con backend
28. Pero aún falta más Automatización de pruebas Generación de screenshots para diferentes navegadores. Integración con Yeoman
29. Entonces: • Console is your friend. • Git. • Automatiza tareas. • Editor de código liviano. • Utiliza preprocesadores. • Mejora constante. • Mac, Windows, Linux (siempre hay hacks). • https://speakerdeck.com/addyosmani/automating-front-end- workflow
30. ¿Quieres aprender todas estas tecnologías frontend? En No2 estamos buscando programadores practicantes o juniors, que quieran aprender y colaborar con nosotros. ¿Qué necesitas? Saber Html, Css, Javascript(por lo menos jquery). Envía tu C.V a elizabeth@no2.pe
31. Gracias @ecmanrique