Your SlideShare is downloading. ×
0
Twig&Drupal 8
Joonas Pajunen• Fraktio Oy• Symfony2 Developer• Twitter: joonsp
Arto Iijalainen• Druid Oy• Drupal backend developer• Drupal.org: Sir-Arturio• Twitter: arto_iijalainen
Twig
Overview• Twig in general• Why Twig is in Drupal 8?• Twig’s solutions to Drupal’s problems• Current state of the project &...
Templating engine• Used in Symfony and other projects• Twig is not a Symfony component• Inspired by Django, originally by ...
<body><ul id="navigation">{% for item in navigation %}<li><a href="{{ item.href }}">{{ item.caption }}</a></li>{% endfor %...
<body><ul id="navigation">{% for item in navigation %}<li><a href="{{ item.href }}">{{ item.caption }}</a></li>{% endfor %...
<body><ul id="navigation">{% for item in navigation %}<li><a href="{{ item.href }}">{{ item.caption }}</a></li>{% endfor %...
<body><ul id="navigation">{% for item in navigation %}<li><a href="{{ item.href }}">{{ item.caption }}</a></li>{% endfor %...
Language features• control structures• tests• variables• logic• math
<ul>{% for user in users %}{% if loop.index is divisibleby(2) and loop.length < 2 %}<li class=”even”>{% else%}<li class=”o...
Variable access• array key• object property• getBar or isBar function{{ foo.bar }}
Composability• extends• include• use• block
{# base.html.twig #}<head>{% block head %}{% endblock %}</head><body><div id="content">{% block content %}{% endblock %}</...
Filters, functions{{ post.published_at|date("m/d/Y") }}{{ [“seppo”,“kimmo”]|first|upper }} -> SEPPO{{ random([apple, orange...
Extensibility• custom functions, tags, filters• can override and customize syntax
class MoneyExtension extends Twig_Extension{    public function getFunctions() {        return array(            cents_to_...
$twig = new Twig_Environment($loader);$twig->addExtension(new MoneyExtension());{{ money(250) }} €becomes:2.5 €Example: cr...
Speed• parsed -> optimized php -> cached• C-extension available
Documentation• Extensive documentation available!• http://twig.sensiolabs.org/documentation
Good IDE highlight support• phpstorm• netbeans• eclipse• sublime text• notepad++• vim• textmate• etc …
WhyD8+ ?
New theme layer!D8
Why do we need a new theme layer?What’s wrong with D7’s theme layer?or
http://www.smile-day.net/wp-content/uploads/2012/03/Winking-Smiley-Face1.jpg
Flaws in D7’s theme layer• PHPtemplate is insecure• Template language is Drupal-only (PHPtemplate + drupalisms)• Lots of d...
PHPtemplate is insecure<?phpdb_query("DROP TABLE {node}");unlink(sites/default/files/myfilename.pdf);?>
PHPtemplate is insecure<?phpdb_query("DROP TABLE {node}");unlink(sites/default/files/myfilename.pdf);?>Not possible in Twig!...
Twig - Security• autoescape by default• sandbox
Template language is Drupal-onlyTwig is proudly found elsewhere!No need to reinvent the wheel.
Lots of different ways to address variables• array key• object property• getBar or isBar function{{ foo.bar }}• $foo[‘bar’]...
Theme system is overly complexhttp://www.slideshare.net/nyccamp/a-new-theme-layer-for-drupal-8
Theme system is overly complexhttp://www.slideshare.net/nyccamp/a-new-theme-layer-for-drupal-8
Two ways of creating markuptheme_admin_view();admin-view.tpl.phpOnly Twig templates left!admin-view.html.twig
Too many and too cluttered templatesTemplates will be cleaned and consolidatedin the refactoring process.
Flaws in D7’s theme layer• PHPtemplate is insecure• Template language is Drupal-only (PHPtemplate + drupalisms)• Lots of d...
Current development status• *DONE* Twig is now an official template engine in D8 core• *IN PROGRESS* Templates are being con...
Conclusions …
Thanks!
Twig
Upcoming SlideShare
Loading in...5
×

Twig

825

Published on

Twig presentation for DrupalCamp Finland 2013

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

No Downloads
Views
Total Views
825
On Slideshare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
10
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide

Transcript of "Twig"

  1. 1. Twig&Drupal 8
  2. 2. Joonas Pajunen• Fraktio Oy• Symfony2 Developer• Twitter: joonsp
  3. 3. Arto Iijalainen• Druid Oy• Drupal backend developer• Drupal.org: Sir-Arturio• Twitter: arto_iijalainen
  4. 4. Twig
  5. 5. Overview• Twig in general• Why Twig is in Drupal 8?• Twig’s solutions to Drupal’s problems• Current state of the project & conclusion
  6. 6. Templating engine• Used in Symfony and other projects• Twig is not a Symfony component• Inspired by Django, originally by Armin Ronacher, via and maintained by Fabien Potencier
  7. 7. <body><ul id="navigation">{% for item in navigation %}<li><a href="{{ item.href }}">{{ item.caption }}</a></li>{% endfor %}</ul><h1>My Webpage</h1>{{ a_variable }}{# <p> unimplemented feature </p> #}</body>Syntax
  8. 8. <body><ul id="navigation">{% for item in navigation %}<li><a href="{{ item.href }}">{{ item.caption }}</a></li>{% endfor %}</ul><h1>My Webpage</h1>{{ a_variable }}{# <p> unimplemented feature </p> #}</body>• print {{ }}Syntax
  9. 9. <body><ul id="navigation">{% for item in navigation %}<li><a href="{{ item.href }}">{{ item.caption }}</a></li>{% endfor %}</ul><h1>My Webpage</h1>{{ a_variable }}{# <p> unimplemented feature </p> #}</body>• print {{ }}• execute statements {% %}Syntax
  10. 10. <body><ul id="navigation">{% for item in navigation %}<li><a href="{{ item.href }}">{{ item.caption }}</a></li>{% endfor %}</ul><h1>My Webpage</h1>{{ a_variable }}{# <p> unimplemented feature </p> #}</body>• print {{ }}• execute statements {% %}• comment {# #}Syntax
  11. 11. Language features• control structures• tests• variables• logic• math
  12. 12. <ul>{% for user in users %}{% if loop.index is divisibleby(2) and loop.length < 2 %}<li class=”even”>{% else%}<li class=”odd”>{% endif %}{{ user.username }}</li>{% else %}<li>no users</li>{% endfor %}</ul>
  13. 13. Variable access• array key• object property• getBar or isBar function{{ foo.bar }}
  14. 14. Composability• extends• include• use• block
  15. 15. {# base.html.twig #}<head>{% block head %}{% endblock %}</head><body><div id="content">{% block content %}{% endblock %}</div></div>{# page.html.twig #}{% extends "base.html.twig" %}{% block content %}<h1>Index</h1><p class="important">Welcome to my awesome homepage.</p>{% include "footer.html.twig" %}{% endblock %}
  16. 16. Filters, functions{{ post.published_at|date("m/d/Y") }}{{ [“seppo”,“kimmo”]|first|upper }} -> SEPPO{{ random([apple, orange, citrus]) }}
  17. 17. Extensibility• custom functions, tags, filters• can override and customize syntax
  18. 18. class MoneyExtension extends Twig_Extension{    public function getFunctions() {        return array(            cents_to_euros => new Twig_Function_Method($this, centsToEuros)        );    }    public function centsToEuros($cents) {             return round($cents/100, 2);    }    public function getName() {        return money;    }}Example: creating a custom function
  19. 19. $twig = new Twig_Environment($loader);$twig->addExtension(new MoneyExtension());{{ money(250) }} €becomes:2.5 €Example: creating a custom function (usage)
  20. 20. Speed• parsed -> optimized php -> cached• C-extension available
  21. 21. Documentation• Extensive documentation available!• http://twig.sensiolabs.org/documentation
  22. 22. Good IDE highlight support• phpstorm• netbeans• eclipse• sublime text• notepad++• vim• textmate• etc …
  23. 23. WhyD8+ ?
  24. 24. New theme layer!D8
  25. 25. Why do we need a new theme layer?What’s wrong with D7’s theme layer?or
  26. 26. http://www.smile-day.net/wp-content/uploads/2012/03/Winking-Smiley-Face1.jpg
  27. 27. Flaws in D7’s theme layer• PHPtemplate is insecure• Template language is Drupal-only (PHPtemplate + drupalisms)• Lots of different ways to address variables• Theme system is overly complex• Two ways of creating markup: templates and theme functions• Too many and too cluttered templates
  28. 28. PHPtemplate is insecure<?phpdb_query("DROP TABLE {node}");unlink(sites/default/files/myfilename.pdf);?>
  29. 29. PHPtemplate is insecure<?phpdb_query("DROP TABLE {node}");unlink(sites/default/files/myfilename.pdf);?>Not possible in Twig! o/
  30. 30. Twig - Security• autoescape by default• sandbox
  31. 31. Template language is Drupal-onlyTwig is proudly found elsewhere!No need to reinvent the wheel.
  32. 32. Lots of different ways to address variables• array key• object property• getBar or isBar function{{ foo.bar }}• $foo[‘bar’]• $foo->bar• $foo->getBar()$foo->isBar()PHPtemplate Twig
  33. 33. Theme system is overly complexhttp://www.slideshare.net/nyccamp/a-new-theme-layer-for-drupal-8
  34. 34. Theme system is overly complexhttp://www.slideshare.net/nyccamp/a-new-theme-layer-for-drupal-8
  35. 35. Two ways of creating markuptheme_admin_view();admin-view.tpl.phpOnly Twig templates left!admin-view.html.twig
  36. 36. Too many and too cluttered templatesTemplates will be cleaned and consolidatedin the refactoring process.
  37. 37. Flaws in D7’s theme layer• PHPtemplate is insecure• Template language is Drupal-only (PHPtemplate + drupalisms)• Lots of different ways to address variables• Theme system is overly complex• Two ways of creating markup: templates and theme functions• Too many and too cluttered templates}}Twig will fixTheme layer will fix
  38. 38. Current development status• *DONE* Twig is now an official template engine in D8 core• *IN PROGRESS* Templates are being converted on Twig• *WAITING* Twig as a main template engine• *IN PROGRESS* Markup refactoring• … Creating Dream Markup• … Rely on Twig auto-escape• … Finish template suggenstions• HELP NEEDED!
  39. 39. Conclusions …
  40. 40. Thanks!
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.

×