Drupal grunt task - Drupal Camp CR 2015

Download Drupal grunt task  - Drupal Camp CR 2015

Post on 17-Aug-2015

77 views

Category:

Technology

3 download

Embed Size (px)

TRANSCRIPT

  1. 1. Drupal Grunt Task Construir y probar Drupal usando Grunt Drupal Camp Costa Rica 2015
  2. 2. Quien Soy? Daniel Noyola Correo: d.noyola@paralleldevs.com Github: danielnv18 Twitter: @danielnv18 Full Stack Developer
  3. 3. Construyendo Drupal
  4. 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. 5. Porque Contruir Drupal? 1. Drush make 2. Dejamos de mezclar el cdigo contribuido/core y cdigo custom. 3. Tenemos control de nuestras dependecias. 4. Una manera simplificada de de ver nuestras libreras y recursos. 5. Reforzar la idea de automatizar.
  6. 6. Porque Probar Drupal? 1. Sitios complejos necesitan ser probados ms all de unos cuantos clicks. 2. Empoderar a los desarrolladores para producir cdigo de calidad. 3. Encontrar errores en el cdigo antes de integrar.
  7. 7. Surgen Preguntas 1. Como nos aseguramos que todos usan la mismas herramientas en la misma manera? 2. Como separamos nuestro cdigo fuente de las dependencias y crear un output corecto?
  8. 8. Grunt
  9. 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, configuracin en JSON. 4,000+ Plugins Contruibuidos.
  10. 10. Grunt, Genial! Tutorial en escribir un script en Grunt minificar JavaScript usando la herramienta "uglify" http://gruntjs.com/getting-started
  11. 11. Drupal Grunt Task
  12. 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. 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 cdigo custom. 2. Acoplar core y contrib con el cdigo custom con Drush Make. 3. Ejecutar pruebas.
  14. 14. Rene una serie de herramientas
  15. 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. 16. Comenzando
  17. 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. 18. Estructura del Projecto
  19. 19. Estructura del Projecto
  20. 20. Estructura del node_modules
  21. 21. Estructura del src/
  22. 22. Estructura del test
  23. 23. Objetivos 1. Acomodar (y aislar) el cdigo custom, Drupal Core, cdigo contribuido, archivos de configuracin 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
  24. 24. Construyendo
  25. 25. Construccion del projecto Utilizamos grunt para construir el projecto: grunt
  26. 26. Pasos de contruccion Compass / Bundle Valida Codigo Drush make Inserta el codigo custom en el sitio Compilar el Tema
  27. 27. Directorio build/html
  28. 28. Directorio vendor
  29. 29. Directorio build/html
  30. 30. 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!
  31. 31. Se ejecuta automatico Ejecuta "validate", compila el tema, drush make (si es necesario) cuando un archivo es modificado. grunt watch
  32. 32. 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.
  33. 33. Haslo a tu manera Las tareas de contruccion puede ser ejecutadas individualmente. Demosle un vistaso a las tareas predefinidas.
  34. 34. Validation
  35. 35. 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
  36. 36. PHP Lint Verifica la sintaxis con la herramienta integrada en php.
  37. 37. PHP Code Sniffer Verifica el estilo del codigo para que conicida con Drupal Code Standards
  38. 38. 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.
  39. 39. Compilando el tema
  40. 40. 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
  41. 41. Compass Incluya el archivo Gemfile para instalar y para requerir gemas Compass compile es ejecutado durante la construccion del sitio grunt compass
  42. 42. Grunt-to-Grunt Delegar tareas a los temas que estan basados en grunt. WIP (Work in progress)
  43. 43. Testing
  44. 44. 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
  45. 45. Ejecutando las pruebas grunt test
  46. 46. 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
  47. 47. Empaquetamiento y despliegue (Deployment)
  48. 48. Deployment Esta hecho para desarrollo local y ambientes de integracion Prepara el codigo para el lanzamamiento Entrega el codigo a otras herramientas de deployment
  49. 49. Empaquetamiento Produce una version aislada, desplegable con Drupal Excluye herramientas de soporte y configuracion grunt package
  50. 50. 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)
  51. 51. Configurando y extendiendo
  52. 52. 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
  53. 53. 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
  54. 54. Para Finalizar
  55. 55. 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)
  56. 56. 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
  57. 57. Preguntas? Codigo Usado para la presentacion https://github.com/danielnv18/gdt-drupalcamp-cr-2015 Presentacion