Este documento presenta la herramienta Drupal Grunt Task, la cual ayuda a construir y probar sitios Drupal usando la automatización de tareas Grunt. Explica cómo Grunt puede unificar el flujo de trabajo de desarrollo mediante tareas como validación de código, compilación de temas, ejecución de pruebas y empaquetamiento para despliegue. También cubre cómo configurar y extender las tareas de Grunt para adaptarse mejor a cada proyecto Drupal.

1. Drupal Grunt Task
Construir y probar Drupal usando Grunt
Drupal Camp Costa Rica 2015

2. Quien Soy?
Daniel Noyola
Correo: d.noyola@paralleldevs.com
Github: danielnv18
Twitter: @danielnv18
Full Stack Developer

3. Construyendo Drupal

4. Desarrollo en Drupal
Enfoque: instale y ejecute
Descargar e instalar -> Agregar codigo -> Subir al servidor
Enfoque: Contruya y pruebe
Drush Make -> Codigo -> Confirmar codigo -> Compilar Sass ->
Ejecutar Behat -> git commit

5. Porque Contruir Drupal?
1. Drush make
2. Dejamos de mezclar el código contribuido/core y código custom.
3. Tenemos control de nuestras dependecias.
4. Una manera simplificada de de ver nuestras librerías y recursos.
5. Reforzar la idea de automatizar.

6. Porque Probar Drupal?
1. Sitios complejos necesitan ser probados más allá de unos cuantos
clicks.
2. Empoderar a los desarrolladores para producir código de calidad.
3. Encontrar errores en el código antes de integrar.

7. Surgen Preguntas
1. Como nos aseguramos que todos usan la mismas herramientas en
la misma manera?
2. Como separamos nuestro código fuente de las dependencias y
crear un output corecto?

8. Grunt

9. Porque Grunt?
Es un ejecutador de tareas basado en javascript.
Fuerte comunidad, flexible, ampliamente adoptado.
Solamente requiere node.js.
Tiene un enfoque simple: tareas en js, configuración en JSON.
4,000+ Plugins Contruibuidos.

10. Grunt, Genial!
Tutorial en escribir un script en Grunt minificar JavaScript usando la
herramienta "uglify"
http://gruntjs.com/getting-started

11. Drupal Grunt Task

12. Drupal Grunt Task
https://github.com/phase2/grunt-drupal-tasks
grunt-drupal-task es un conjunto de herramientas que nos ayudan
construir y probar (aka Testear) Drupal y otras herramientas comunes
en Drupal

13. Tiene opiniones
1. Aplica practicas en todo el equipo y el ambiente de CI (Continuous
Integration)
2. Asume cierto flujo en el codigo
1. Verificar la calidad del código custom.
2. Acoplar core y contrib con el código custom con Drush Make.
3. Ejecutar pruebas.

14. Reúne una serie de herramientas

15. Se queda fuera de tu camino
1. Todas las tareas se pueden modificar.
2. Administra sus propias dependencias.
3. Las herramientas son faciles de usar.

16. Comenzando

17. Dependencias
Antes de comenzar tenemos que estar seguros que tenemos
node.js (npm)
Se recomienda para soportar el resto de herramientas
Bundler, Composer, Ruby y RubyGems
Opcional
npm install -g generator-gadget grunt-cli yo
yo gadget

18. Estructura del Projecto

19. Estructura del Projecto

20. Estructura del node_modules

21. Estructura del src/

23. Estructura del test

24. Objetivos
1. Acomodar (y aislar) el código custom, Drupal Core, código
contribuido, archivos de configuración y herramientas de soporte.
2. Permitir a todas la herramientas trabajar en conjunto con el minimo
esfuerzo.
3. Estandarizar la estructura base de un projecto

25. Construyendo

26. Construccion del projecto
Utilizamos grunt para construir el projecto:
grunt

27. Pasos de contruccion
Compass / Bundle
Valida Codigo
Drush make
Inserta el codigo custom en el sitio
Compilar el Tema

28. Directorio build/html

29. Directorio vendor

30. Directorio build/html

31. SymLinks?
1. No hay necesidada de re-contruir despues de un cambio en el
codigo
2. La tarea "build" se encarga de que los Symlink esten correctos
3. Los link son relativos a la aplicacion
4. XDebug funciona con simlinks
5. Usuarios de windows: CUIDADO!

32. Se ejecuta automatico
Ejecuta "validate", compila el tema, drush make (si es necesario)
cuando un archivo es modificado.
grunt watch

33. La forma de construccion
1. Captura el flujo de trabajo diario.
2. Produce un sitio completo en Drupal desde codigo custom y un
archivo make.
3. Contruido local, contruir sobre la integracion.

34. Haslo a tu manera
Las tareas de contruccion puede ser ejecutadas individualmente.
Demosle un vistaso a las tareas predefinidas.

35. Validation

36. Validando la calidad del codigo
1. Utiliza lints y analisis de codigo estatico para cuantificar la calidad
del codigo
2. Podemos ejecutar PHP Lint y PHP Code Sniffer (con los estandares
de codigo de Drupal)
grunt validate

37. PHP Lint
Verifica la sintaxis con la herramienta integrada en php.

38. PHP Code Sniffer
Verifica el estilo del codigo para que conicida con Drupal Code
Standards

39. Verifiquemos antes de hacer algo
1. Anima a los desarrolladores a validar el codigo antes de subirlo.
2. Enfoca la arquitentura en revisiones de codigo.
3. Rechazar el deployment o PR bajo ciertos parametros.

40. Compilando el tema

41. Herramientas Front-end
1. Compass fue una de la primeras herramientas no-PHP comun en la
implementacion de Drupal
2. Puedes configurar GDT para definir la compilacion de los temas
grunt compile-theme

42. Compass
Incluya el archivo Gemfile para instalar y para requerir gemas
Compass compile es ejecutado durante la construccion del sitio
grunt compass

43. Grunt-to-Grunt
Delegar tareas a los temas que estan basados en grunt.
WIP (Work in progress)

44. Testing

45. Probando los "features" del sitio
Probar de Behat, Extenciones Drupal y otras dependencias
Probar el sitio con Behat requiere que Drupal este instalado y
accesible por URL
2 opciones para ejecutar pruebas localmente
Usando un ambiente local (Docker,VM, W/MAMP)
Usando el servidor integrado en PHP/Drush
grunt drush:liteinstall

46. Ejecutando las pruebas
grunt test

47. Hacia BDD
GDT suporta el fujo de trabajo de BDD/TDD
Primero se escriben las pruebas
Codido interactua con el feedback de la prueba
Se puede automatizar mediante la tarea watch
Incluye herramientas y scripts de prueba para comenzar a probar

48. Empaquetamiento y despliegue (Deployment)

49. Deployment
Esta hecho para desarrollo local y ambientes de integracion
Prepara el codigo para el lanzamamiento
Entrega el codigo a otras herramientas de deployment

50. Empaquetamiento
Produce una version aislada, desplegable con Drupal
Excluye herramientas de soporte y configuracion
grunt package

51. Liberando el codigo
Se esta explorando como se pueden soportar processos de liberacion
(release)
1. Commit el codigo a un repositorio (Acquia, Pantheon)
2. Integrarlo con otras herramientas de release/deployment
(Capistrano, ShipIt)

52. Configurando y extendiendo

53. Configuracion
Opciones configurable en Gruntconfig.json
La fuente y directorio de contruccion
Opciones para ejecutar behat
Argumentos a la ejecucion de Drush Make
Opciones para la configuracion de los temas
Incluir / Excluir archivos para el empaquetamiento

54. Extendiendo
La entension es posible a travez de cambios en Gruntfile.js
Agregar nuevas tareas, reemplazar existentes
Ejecutar un comando de consola como una tarea
Sobre escribir los pasos por defecto para la construccion del sitio

55. Para Finalizar

56. Pruebalo
Intenta usar Drupal Grunt Task en tu siguiente projecto
Creat issue en GitHub para compartir como deberia funcionar mejor
Parches son bienvenidos (a.k.a Pull Request en GitHub)

57. Roadmap
1. Suportar mas herramientas de calidad de codigo (PHPunit Sass/js
lint)
2. Delegar para temas que hacen uso de grunt
3. Mas opciones de releasing/deployment
4. Contruir Drupal con composer
5. Integracion con Drupal Console

58. Preguntas?
Codigo Usado para la presentacion
https://github.com/danielnv18/gdt-drupalcamp-cr-2015
Presentacion