Your SlideShare is downloading. ×
0
Twig
Twig
Twig
Twig
Twig
Twig
Twig
Twig
Twig
Twig
Twig
Twig
Twig
Twig
Twig
Twig
Twig
Twig
Twig
Twig
Twig
Twig
Twig
Twig
Twig
Twig
Twig
Twig
Twig
Twig
Twig
Twig
Twig
Twig
Twig
Twig
Twig
Twig
Twig
Twig
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

Twig

788

Published on

Twig presentation for DrupalCamp Finland 2013

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
788
On Slideshare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
10
Comments
0
Likes
1
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. Twig&Drupal 8
  • 2. Joonas Pajunen• Fraktio Oy• Symfony2 Developer• Twitter: joonsp
  • 3. Arto Iijalainen• Druid Oy• Drupal backend developer• Drupal.org: Sir-Arturio• Twitter: arto_iijalainen
  • 4. Twig
  • 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. 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. <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. <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. <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. <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. Language features• control structures• tests• variables• logic• math
  • 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. Variable access• array key• object property• getBar or isBar function{{ foo.bar }}
  • 14. Composability• extends• include• use• block
  • 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. Filters, functions{{ post.published_at|date("m/d/Y") }}{{ [“seppo”,“kimmo”]|first|upper }} -> SEPPO{{ random([apple, orange, citrus]) }}
  • 17. Extensibility• custom functions, tags, filters• can override and customize syntax
  • 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. $twig = new Twig_Environment($loader);$twig->addExtension(new MoneyExtension());{{ money(250) }} €becomes:2.5 €Example: creating a custom function (usage)
  • 20. Speed• parsed -> optimized php -> cached• C-extension available
  • 21. Documentation• Extensive documentation available!• http://twig.sensiolabs.org/documentation
  • 22. Good IDE highlight support• phpstorm• netbeans• eclipse• sublime text• notepad++• vim• textmate• etc …
  • 23. WhyD8+ ?
  • 24. New theme layer!D8
  • 25. Why do we need a new theme layer?What’s wrong with D7’s theme layer?or
  • 26. http://www.smile-day.net/wp-content/uploads/2012/03/Winking-Smiley-Face1.jpg
  • 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. PHPtemplate is insecure<?phpdb_query("DROP TABLE {node}");unlink(sites/default/files/myfilename.pdf);?>
  • 29. PHPtemplate is insecure<?phpdb_query("DROP TABLE {node}");unlink(sites/default/files/myfilename.pdf);?>Not possible in Twig! o/
  • 30. Twig - Security• autoescape by default• sandbox
  • 31. Template language is Drupal-onlyTwig is proudly found elsewhere!No need to reinvent the wheel.
  • 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. Theme system is overly complexhttp://www.slideshare.net/nyccamp/a-new-theme-layer-for-drupal-8
  • 34. Theme system is overly complexhttp://www.slideshare.net/nyccamp/a-new-theme-layer-for-drupal-8
  • 35. Two ways of creating markuptheme_admin_view();admin-view.tpl.phpOnly Twig templates left!admin-view.html.twig
  • 36. Too many and too cluttered templatesTemplates will be cleaned and consolidatedin the refactoring process.
  • 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. 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. Conclusions …
  • 40. Thanks!

×