Your SlideShare is downloading. ×
0
Drupal 8 templating with twig
Drupal 8 templating with twig
Drupal 8 templating with twig
Drupal 8 templating with twig
Drupal 8 templating with twig
Drupal 8 templating with twig
Drupal 8 templating with twig
Drupal 8 templating with twig
Drupal 8 templating with twig
Drupal 8 templating with twig
Drupal 8 templating with twig
Drupal 8 templating with twig
Drupal 8 templating with twig
Drupal 8 templating with twig
Drupal 8 templating with twig
Drupal 8 templating with twig
Drupal 8 templating with twig
Drupal 8 templating with twig
Drupal 8 templating with twig
Drupal 8 templating with twig
Drupal 8 templating with twig
Drupal 8 templating with twig
Drupal 8 templating with twig
Drupal 8 templating with twig
Drupal 8 templating with twig
Drupal 8 templating with twig
Drupal 8 templating with twig
Drupal 8 templating with twig
Drupal 8 templating with twig
Drupal 8 templating with twig
Drupal 8 templating with twig
Drupal 8 templating with twig
Drupal 8 templating with twig
Drupal 8 templating with twig
Drupal 8 templating with twig
Drupal 8 templating with twig
Drupal 8 templating with twig
Drupal 8 templating with twig
Drupal 8 templating with twig
Drupal 8 templating with twig
Drupal 8 templating with twig
Drupal 8 templating with twig
Drupal 8 templating with twig
Drupal 8 templating with twig
Drupal 8 templating with twig
Drupal 8 templating with twig
Drupal 8 templating with twig
Drupal 8 templating with twig
Drupal 8 templating with twig
Drupal 8 templating with twig
Drupal 8 templating with twig
Drupal 8 templating with twig
Drupal 8 templating with twig
Drupal 8 templating with twig
Drupal 8 templating with twig
Drupal 8 templating with twig
Drupal 8 templating with twig
Drupal 8 templating with twig
Drupal 8 templating with twig
Drupal 8 templating with twig
Drupal 8 templating with twig
Drupal 8 templating with twig
Drupal 8 templating with twig
Drupal 8 templating with twig
Drupal 8 templating with twig
Drupal 8 templating with twig
Drupal 8 templating with twig
Drupal 8 templating with twig
Drupal 8 templating with twig
Drupal 8 templating with twig
Drupal 8 templating with twig
Drupal 8 templating with twig
Drupal 8 templating with twig
Drupal 8 templating with twig
Drupal 8 templating with twig
Drupal 8 templating with twig
Drupal 8 templating with twig
Drupal 8 templating with twig
Drupal 8 templating with twig
Drupal 8 templating with twig
Drupal 8 templating with twig
Drupal 8 templating with twig
Drupal 8 templating with twig
Drupal 8 templating with twig
Drupal 8 templating with twig
Drupal 8 templating with twig
Drupal 8 templating with twig
Drupal 8 templating with twig
Drupal 8 templating with twig
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×
Saving this for later? Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime – even offline.
Text the download link to your phone
Standard text messaging rates apply

Drupal 8 templating with twig

4,952

Published on

Published in: Business, Technology
0 Comments
2 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
4,952
On Slideshare
0
From Embeds
0
Number of Embeds
3
Actions
Shares
0
Downloads
0
Comments
0
Likes
2
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide

Transcript

  • 1. DRUPAL 8TEMPLATING WITHTWIG
  • 2. DRUPAL 7: POSITIVEflexible
  • 3. DRUPAL 7: POSITIVEunified~ish data structures everywhere
  • 4. DRUPAL 7: POSITIVEanything is possible
  • 5. DRUPAL 7: NEGATIVEDrupal only (weird) syntax
  • 6. DRUPAL 7: NEGATIVEObject or Array?
  • 7. DRUPAL 7: NEGATIVEprint or print render()?
  • 8. DRUPAL 7: NEGATIVEPHP is insecure
  • 9. DRUPAL 7: NEGATIVEPHP is insecure
  • 10. DRUPAL 7: NEGATIVEToo many template files
  • 11. DRUPAL 7: NEGATIVEToo many theme functions
  • 12. DRUPAL 7: NEGATIVEcomplex mix of subsystems
  • 13. HARD TO LEARNbecause1. Mixed data types (strings, objects & arrays)2. Different methods of printing variables (print, render)3. Two ways to override markup: templates & theme fns4. Too many template files & Too many theme fns5. Insecure6. Drupal-specific7. A complex mix of subsystems
  • 14. DRUPAL 8 THEME LAYERlet’s fix itAccidental Drupal 8 “initiative” leader
  • 15. DRUPAL 8 THEME LAYERPrincipals to guide us1. Start with nothing
  • 16. DRUPAL 8 THEME LAYERPrincipals to guide us1. Start with nothing2. Build from use cases
  • 17. DRUPAL 8 THEME LAYERPrincipals to guide us1. Start with nothing2. Build from use cases3. Provide tools
  • 18. DRUPAL 8 THEME LAYERPrincipals to guide us1. Start with nothing2. Build from use cases3. Provide tools4. Consolidate
  • 19. DRUPAL 8 THEME LAYERPrincipals to guide us1. Start with nothing2. Build from use cases3. Provide tools4. Consolidate5. Visibility
  • 20. DRUPAL 8 THEME LAYERPrincipals to guide us1. Start with nothing2. Build from use cases3. Provide tools4. Consolidate5. Visibility6. Consistency
  • 21. DRUPAL 8 THEME LAYERPrincipals to guide us1. Start with nothing2. Build from use cases3. Provide tools4. Consolidate5. Visibility6. Consistency7. Dont dumb it down8. Organization should be driven by meaning andsemantics over technical convenience
  • 22. TWIGwell documented
  • 23. TWIGextensible
  • 24. TWIGsecure
  • 25. TWIGfast
  • 26. TWIGIDE integration
  • 27. TWIGrecognizable syntax
  • 28. TWIGby Symfony’s author, Fabien Potencier
  • 29. TWIGprint with {{ }}
  • 30. TWIGcommands with {% %}
  • 31. TWIGcomments with {# #}
  • 32. D7 PAIN POINTSdoes Twig help?1. Mixed data types (strings, objects & arrays)2. Different methods of printing variables (print, render)3. Two ways to override markup: templates & theme fns4. Too many template files & Too many theme fns5. Insecure6. Drupal-specific7. A complex mix of subsystems
  • 33. D7 PAIN POINTSdoes Twig help?1. Mixed data types (strings, objects & arrays)
  • 34. D7 PAIN POINTSdoes Twig help?1. Mixed data types (strings, objects & arrays)All template variables are accessedconsistently:node.nidcontent.links
  • 35. D7 PAIN POINTSdoes Twig help?1. Mixed data types (strings, objects & arrays) FIXED
  • 36. D7 PAIN POINTSdoes Twig help?1. Mixed data types (strings, objects & arrays) FIXED2. Different methods of printing variables (print, render)
  • 37. D7 PAIN POINTSdoes Twig help?1. Mixed data types (strings, objects & arrays) FIXED2. Different methods of printing variables (print, render)Removed calls to render() fromtemplates:{{ node.nid }}{{ content.links }}
  • 38. D7 PAIN POINTSdoes Twig help?1. Mixed data types (strings, objects & arrays) FIXED2. Different methods of printing variables FIXED
  • 39. D7 PAIN POINTSdoes Twig help?1. Mixed data types (strings, objects & arrays) FIXED2. Different methods of printing variables FIXED3. Two ways to override markup
  • 40. D7 PAIN POINTSdoes Twig help?1. Mixed data types (strings, objects & arrays) FIXED2. Different methods of printing variables FIXED3. Two ways to override markupAll theme functions become templates.node.tpl.php becomes node.html.twigtheme_table() becomes table.html.twig
  • 41. D7 PAIN POINTSdoes Twig help?1. Mixed data types (strings, objects & arrays) FIXED2. Different methods of printing variables FIXED3. Two ways to override markup FIXED
  • 42. D7 PAIN POINTSdoes Twig help?1. Mixed data types (strings, objects & arrays) FIXED2. Different methods of printing variables FIXED3. Two ways to override markup FIXED4. Too many template files & Too many theme
  • 43. D7 PAIN POINTSdoes Twig help?1. Mixed data types (strings, objects & arrays) FIXED2. Different methods of printing variables FIXED3. Two ways to override markup FIXED4. Too many template files & Too many themeWe’re working on this right now
  • 44. D7 PAIN POINTSdoes Twig help?1. Mixed data types (strings, objects & arrays) FIXED2. Different methods of printing variables FIXED3. Two ways to override markup FIXED4. Too many template files & Too many theme @todo5. Insecure
  • 45. D7 PAIN POINTSdoes Twig help?1. Mixed data types (strings, objects & arrays) FIXED2. Different methods of printing variables FIXED3. Two ways to override markup FIXED4. Too many template files & Too many theme @todo5. InsecureAll variables are *automatically* sanitizedand most PHP functionscannot be executed in template files.
  • 46. D7 PAIN POINTSdoes Twig help?1. Mixed data types (strings, objects & arrays) FIXED2. Different methods of printing variables FIXED3. Two ways to override markup FIXED4. Too many template files & Too many theme @todo5. Insecure FIXED
  • 47. D7 PAIN POINTSdoes Twig help?1. Mixed data types (strings, objects & arrays) FIXED2. Different methods of printing variables FIXED3. Two ways to override markup FIXED4. Too many template files & Too many theme @todo5. Insecure FIXED6. Drupal-specific
  • 48. D7 PAIN POINTSdoes Twig help?1. Mixed data types (strings, objects & arrays) FIXED2. Different methods of printing variables FIXED3. Two ways to override markup FIXED4. Too many template files & Too many theme @todo5. Insecure FIXED6. Drupal-specificTwig is used elsewhere on the webis syntactically similar to other languagesand looks a lot more like HTML.
  • 49. D7 PAIN POINTSdoes Twig help?1. Mixed data types (strings, objects & arrays) FIXED2. Different methods of printing variables FIXED3. Two ways to override markup FIXED4. Too many template files & Too many theme @todo5. Insecure FIXED6. Drupal-specific FIXED
  • 50. D7 PAIN POINTSdoes Twig help?1. Mixed data types (strings, objects & arrays) FIXED2. Different methods of printing variables FIXED3. Two ways to override markup FIXED4. Too many template files & Too many theme @todo5. Insecure FIXED6. Drupal-specific FIXED7. A complex mix of subsystems
  • 51. D7 PAIN POINTSdoes Twig help?1. Mixed data types (strings, objects & arrays) FIXED2. Different methods of printing variables FIXED3. Two ways to override markup FIXED4. Too many template files & Too many theme @todo5. Insecure FIXED6. Drupal-specific FIXED7. A complex mix of subsystems
  • 52. D7 THEME LAYER
  • 53. D8 IMPROVEMENTSremove theme functions (and overrides) entirely
  • 54. D8 IMPROVEMENTSremove process.
  • 55. D8 IMPROVEMENTSremove render.
  • 56. D8 IMPROVEMENTSremove page alter?
  • 57. D9 IMPROVEMENTSremove preprocess?
  • 58. D7 PAIN POINTSdoes Twig help?1. Mixed data types (strings, objects & arrays) FIXED2. Different methods of printing variables FIXED3. Two ways to override markup FIXED4. Too many template files & Too many theme @todo5. Insecure FIXED6. Drupal-specific FIXED7. A complex mix of subsystemsWe can remove all theme functions, render,process & (maybe) preprocess too.
  • 59. D7 PAIN POINTSdoes Twig help?1. Mixed data types (strings, objects & arrays) FIXED2. Different methods of printing variables FIXED3. Two ways to override markup FIXED4. Too many template files & Too many theme @todo5. Insecure FIXED6. Drupal-specific FIXED7. A complex mix of subsystems @todo
  • 60. D7 PAIN POINTSdoes Twig help?YES!!!
  • 61. TWIG: OTHER WINSless code than PHP functionsD7D8theme_image becomes image.html.twig
  • 62. TWIG: OTHER WINSless code than PHP functionstheme_username becomes username.html.twigD7D8
  • 63. TWIG: OTHER WINSless code than PHP functionstheme_link becomes link.html.twigD7D8
  • 64. TWIG: OTHER WINSlots less code than PHP functionstheme_item_list becomesitem_list.html.twigD7D8
  • 65. TWIG: OTHER WINSAwesome template inspection(“devel themer” in core)
  • 66. TWIG: OTHER WINSAwesome variable inspection(devel’s dpm() in core)
  • 67. TWIG: OTHER WINSTemplate inheritancecomment-wrapper.html.twig before
  • 68. TWIG: OTHER WINSTemplate inheritancecomment-wrapper.html.twig after
  • 69. TWIG: OTHER WINSTemplate inheritancecomment-wrapper--forum.html.twig(child template)
  • 70. TWIG: OTHER WINSPossible performance gains (Much TBD)
  • 71. TWIG: OTHER WINSPossible performance gains (Much TBD)• PHPtemplate reads files from disk on every use(or stat()s them with APC)• Twig templates are read once & compiled intoclasses
  • 72. TWIG: OTHER WINSPossible performance gains (Much TBD)• PHPtemplate reads files from disk on every use(or stat()s them with APC)• Twig templates are read once & compiled intoclassesRendering should get much faster when the samecontent element appears multiple times on thepage.
  • 73. TWIG: OTHER WINSPossible performance gains (Much TBD)• PHPtemplate reads files from disk on every use(or stat()s them with APC)• Twig templates are read once & compiled intoclassesRendering should get much faster when the samecontent element appears multiple times on thepage.Consolidating many similar templates will result inan additional gain.
  • 74. TWIG: OTHER WINSIn-browser template editing finally safe.
  • 75. TWIG: OTHER WINSIn-browser template editing finally safe.• Saving PHP code in the database is a HUGE no-no.• Twig is not PHP, and is safe to store!
  • 76. TWIG: OTHER WINSIn-browser template editing finally safe.• Saving PHP code in the database is a HUGE no-no.• Twig is not PHP, and is safe to store!Modules like ‘Contemplate’ (Content templates) willfinally be safe to use.
  • 77. TWIG: OTHER WINSIn-browser template editing finally safe.• Saving PHP code in the database is a HUGE no-no.• Twig is not PHP, and is safe to store!Modules like ‘Contemplate’ (Content templates) willfinally be safe to use.In-browser template editing is something WordPressusers have been asking of Drupal for a very long time.
  • 78. TWIG: OTHER WINSTwig template files can be used on the front end, too.
  • 79. TWIG: OTHER WINSTwig template files can be used on the front end, too.One template can return markup for both your PHP-generated pages, as well as pages generated vi JS inAJAX callbacks.
  • 80. TWIG: OTHER WINSTwig template files can be used on the front end, too.One template can return markup for both your PHP-generated pages, as well as pages generated vi JS inAJAX callbacks.We can use other open source libraries like TwigJS.(https://github.com/schmittjoh/twig.js)
  • 81. TWIG: OTHER WINS2-way communication between UI and code.
  • 82. TWIG: OTHER WINS2-way communication between UI and code.No broken UIs.
  • 83. TWIG: OTHER WINS2-way communication between UI and code.No broken UIs.Template files can be created first, and the Drupal sitecan build itself* based on the presence and location ofvariables in the templates.*within reason
  • 84. D8 THEME ENGINE PROFILING
  • 85. WARMING OF TWIG IN D814%86%YesNo
  • 86. HOT THEMESFontFolioZURB Foundation
  • 87. ZURB Foundationhttp://g.ua/WrKG
  • 88. Links1. Theming Drupal 82. Twig documentation (RU)3. Twig coding standards4. DrupalCon Portland 2013: USING TWIG: THENEW TEMPLATE ENGINE IN DRUPAL 8
  • 89. Ask meTaras OmelianenkoCEO+380 97 508 84 74Skype: taras.omelyanenkot.omelianenko@dicslab.comwww.dicslab.com

×