SlideShare ist ein Scribd-Unternehmen logo
1 von 24
Downloaden Sie, um offline zu lesen
Drupal 8 & Twig

                            Drupal Usergroup Hannover 09.10.2012




The Twig logo is © 2010-2012 Sensio Labs
{{ SteffenR }}

● Drupal - Developer bei

●   HTML / CSS / JS seit 1999
●   PHP seit 2002
●   Drupal seit 2008 (Danke DUG-Hannover)
●   244597 auf drupal.org
{{ twig }}
      liest sich auf jeden Fall interessant

"The flexible, fast and secure
template engine for PHP"

                      "Twig is a modern
                      template engine for PHP"

"Symfony 2 PHP framework comes
with a bundled support for Twig
as default templating engine"
{{ twig.description }}
               Was ist twig ?

● entwickelt von Armin Ronacher - als Phyton
  template-engine
● seit 2009 Default Template-Engine von
  Symfony2 (http://twig.sensiolabs.org/)
● erhältlich als Standalone-Lösung zur
  Einbindung in eigene PHP-basierte
  Lösungen
● basierend auf PHP5 - OOP-Templates
● das LESS/SASS für HTML :-)
{{ drupal.twig }}

#1499460
           "I just wanted to let everyone know that I'm in
support of rethinking the theme system. I'm also
comfortable that the team will come up with a good
solution." (Dries Buytaert, 18.04.2012)

                                            John Albin
         "We hand themers a loaded gun (PHP) and tell
them to hammer in a nail with it. Oh, and be careful"
(Drupalcon Denver)
{{ phptemplate }}
     html.tpl.php




        Drupal 7
      stark theme
{{ twig }}
  html.twig




    Drupal 8
twig_stark theme
{{ twig.advantages }}
         Vorteile von twig in Drupal

● mehr Sicherheit im Theming
● kein PHP/HTML Mix in Templates
● einfache Tag-basierte Syntax
● Wiederverwendbarkeit von Templates
● Vermeidung neuer Sicherheitslücken
● Integration in IDEs (Netbeans, vim, PHP-
  Storm etc..)
● gute Integration in Symfony2 - bringt beide
  Communities wieder ein Stück mehr
  zusammen
{{ twig.disadvantages }}
          Nachteile von twig in Drupal

●   steile Lernkurve (begrenzt auf Tag-Syntax)
●   neue Syntax für Drupal-Themer
●   Performance-Bedenken
●   Update Zyklen Drupal vs. Twig
{{ twig.internals }}
 Wie funktioniert das Ganze im Hintergrund ?

1. Template laden
    a. lexer - Zerlegung in kleinere Einzelteile (Token-
       Stream) zum Parsen
    b. parser - Konvertierung des Token-Streams in
       Abstract-Syntax-Tree oder Node-Tree
    c. compiler - Generierung des PHP-Codes
       für die Ausgabe aus Node-Tree / AST
2. Ausgabe des Template

http://twig.sensiolabs.org/doc/internals.html
{{ twig.features }}
         Was bringt uns das konkret ?

●   Filter
●   Kontroll-Strukturen
●   Template-Vererbung
●   Makros
●   Erweiterbarkeit durch OOP
●   Sandbox
●   erkennt automatisch den PHP-Datentyp -
    "bye bye Theme-Render Array of DOOM"
{{ twig.variables }}
                print $var_name ?
phptemplate




                                             twig




              region Template im Vergleich
{{ twig.filters }}
     Ausgabe von Variablen beeinflussen

● PHP-Funktionen ohne PHP
  ○ date, replace, url_encode, capitalize, striptags, join,
    reverse, length, sort, merge



● Chaining von Filtern
{{ twig.functions }}
      Ausgabe von Variablen beeinflussen




● range, cycle, constant, random,
  attribute, block, parent, dump, date
  http://twig.sensiolabs.org/doc/functions/index.html




 Ausgabe von Feld-Inhalten mit alternating CSS Classes
{{ twig.controlstructures }}
             loops, conditions




   einfache for-Schleifen, if-else Konstkrukte
{{ twig.controlstructures }}
              loops, conditions
phptemplate

                                    twig




               bessere Lesbarkeit
{{ twig.includes }}
 andere Templates einbinden




Wiederverwendbarkeit von Templates
{{ twig.includes }}
                       kleiner geht immer...

stark-theme - theme.inc    breadcrumb.twig




                          liest das Array breadcrumbs aus und zeigt
                          es als Liste an - hier wird die Funktion
                          join verwendet

Statt der vielen Theme-Funktionen in Drupal 7 stehen uns nun direkt die die
Templates zur Verfügung, natürlich auch über _preprocess-hooks geändert werden
könnten
{{ twig.inheritance }}
html.twig
                   Vererbung von Templates




maintenance-page.twig




selektives Überschreiben - Variable .mobi in page_preprocess gesetzt
{{ twig.macros }}
           re-usable pieces of view-logic




Einbindung des Sidebar Macros in bestehende Template Datei
{{ twig.demo }}
    na dann mal los ...




      http://twig.local/




einfaches Twig-Theme erstellen
{{ twig.questions }}

<h1>Fragen</h1>
<ul>
{% for question in audience.questions %}
   <li>{{ question|e }}</li>
{% endfor %}
</ul>
{{ twig.links }}

● Drupal 8 Theme and Twig Sprint
   http://drupal.org/sandbox/pixelmord/1750250

● Twig-Documentation
   http://twig.sensiolabs.org/documentation

● Templating Engines in PHP - http://fabien.potencier.
   org/article/34/templating-engines-in-php

● Drupal with Twig templates
   http://drupalmotion.com/article/drupal-twig-templates

● [meta] new theme system
   http://drupal.org/node/1499460

● What to Expect in Drupal 8
   http://lyemium.com/content/what-expect-drupal-8
{{ twig.end }}



{{ thx|default("Danke für die Aufmerksamkeit") }}




         {{ speaker.name|default("Steffen Rühlmann")   }}
             {{ speaker.web|default("www.port11.de")   }}
             {{ speaker.twitter|default("_steffenr")   }}
       {{ speaker.email|default("steffen@port11.de")   }}

Weitere ähnliche Inhalte

Ähnlich wie Drupal und twig

Puppet - Module entwickeln - Von der Planung bis zur Umsetzung
Puppet - Module entwickeln - Von der Planung bis zur UmsetzungPuppet - Module entwickeln - Von der Planung bis zur Umsetzung
Puppet - Module entwickeln - Von der Planung bis zur Umsetzung
inovex GmbH
 
Nagios Conference 2006 | Nagios Portalintegration by Julian Hein
Nagios Conference 2006 |  Nagios Portalintegration by Julian HeinNagios Conference 2006 |  Nagios Portalintegration by Julian Hein
Nagios Conference 2006 | Nagios Portalintegration by Julian Hein
NETWAYS
 

Ähnlich wie Drupal und twig (20)

Drupal 8: TWIG Template Engine
Drupal 8:  TWIG Template EngineDrupal 8:  TWIG Template Engine
Drupal 8: TWIG Template Engine
 
Drupal Austria Roadshow in Klagenfurt
Drupal Austria Roadshow in KlagenfurtDrupal Austria Roadshow in Klagenfurt
Drupal Austria Roadshow in Klagenfurt
 
Puppet - Module entwickeln - Von der Planung bis zur Umsetzung
Puppet - Module entwickeln - Von der Planung bis zur UmsetzungPuppet - Module entwickeln - Von der Planung bis zur Umsetzung
Puppet - Module entwickeln - Von der Planung bis zur Umsetzung
 
HTML5 - presentation at W3C-Tag 2009
HTML5 - presentation at W3C-Tag 2009HTML5 - presentation at W3C-Tag 2009
HTML5 - presentation at W3C-Tag 2009
 
PHP-Module in statischen Seiten - Architektur-Ansätze
PHP-Module in statischen Seiten - Architektur-AnsätzePHP-Module in statischen Seiten - Architektur-Ansätze
PHP-Module in statischen Seiten - Architektur-Ansätze
 
Devops ohne root
Devops ohne rootDevops ohne root
Devops ohne root
 
react-de.pdf
react-de.pdfreact-de.pdf
react-de.pdf
 
magnolia mit thymeleaf - ein agiler prozess-beschleuniger
magnolia mit thymeleaf - ein agiler prozess-beschleunigermagnolia mit thymeleaf - ein agiler prozess-beschleuniger
magnolia mit thymeleaf - ein agiler prozess-beschleuniger
 
Drupal Basics (7-8) Vortrag (01.2016)
Drupal Basics (7-8) Vortrag (01.2016)Drupal Basics (7-8) Vortrag (01.2016)
Drupal Basics (7-8) Vortrag (01.2016)
 
Drupal Multisite und Subversion
Drupal Multisite und SubversionDrupal Multisite und Subversion
Drupal Multisite und Subversion
 
Gradle - Beginner's Workshop (german)
Gradle - Beginner's Workshop (german)Gradle - Beginner's Workshop (german)
Gradle - Beginner's Workshop (german)
 
Joomla! Overrides - Die zu wenig genutzte Vielfalt
Joomla! Overrides - Die zu wenig genutzte VielfaltJoomla! Overrides - Die zu wenig genutzte Vielfalt
Joomla! Overrides - Die zu wenig genutzte Vielfalt
 
Einführung XHTML CSS JS // MM 08-11
Einführung XHTML CSS JS // MM 08-11Einführung XHTML CSS JS // MM 08-11
Einführung XHTML CSS JS // MM 08-11
 
AndroMDA - Einführung in eine Open Source Model Driven Architecture Lösung
AndroMDA - Einführung in eine Open Source Model Driven Architecture LösungAndroMDA - Einführung in eine Open Source Model Driven Architecture Lösung
AndroMDA - Einführung in eine Open Source Model Driven Architecture Lösung
 
Web Entwicklung mit PHP - Teil 3 Beta
Web Entwicklung mit PHP - Teil 3 BetaWeb Entwicklung mit PHP - Teil 3 Beta
Web Entwicklung mit PHP - Teil 3 Beta
 
Konfigurations Management mit Puppet (Webinar vom 17.10.2013)
Konfigurations Management mit Puppet (Webinar vom 17.10.2013)Konfigurations Management mit Puppet (Webinar vom 17.10.2013)
Konfigurations Management mit Puppet (Webinar vom 17.10.2013)
 
PLUX.NET – SOFTWAREKOMPOSITION DURCH PLUG & PLAY
PLUX.NET – SOFTWAREKOMPOSITION DURCH PLUG & PLAYPLUX.NET – SOFTWAREKOMPOSITION DURCH PLUG & PLAY
PLUX.NET – SOFTWAREKOMPOSITION DURCH PLUG & PLAY
 
Nagios Conference 2006 | Nagios Portalintegration by Julian Hein
Nagios Conference 2006 |  Nagios Portalintegration by Julian HeinNagios Conference 2006 |  Nagios Portalintegration by Julian Hein
Nagios Conference 2006 | Nagios Portalintegration by Julian Hein
 
Nagios Conference 2007 | Eventverarbeitung mit Nagios by Michael Streb
Nagios Conference 2007 | Eventverarbeitung mit Nagios by Michael StrebNagios Conference 2007 | Eventverarbeitung mit Nagios by Michael Streb
Nagios Conference 2007 | Eventverarbeitung mit Nagios by Michael Streb
 
Robuste Design Systems mit Storybook und Angular: vom Konzept zur lebendigen ...
Robuste Design Systems mit Storybook und Angular: vom Konzept zur lebendigen ...Robuste Design Systems mit Storybook und Angular: vom Konzept zur lebendigen ...
Robuste Design Systems mit Storybook und Angular: vom Konzept zur lebendigen ...
 

Drupal und twig

  • 1. Drupal 8 & Twig Drupal Usergroup Hannover 09.10.2012 The Twig logo is © 2010-2012 Sensio Labs
  • 2. {{ SteffenR }} ● Drupal - Developer bei ● HTML / CSS / JS seit 1999 ● PHP seit 2002 ● Drupal seit 2008 (Danke DUG-Hannover) ● 244597 auf drupal.org
  • 3. {{ twig }} liest sich auf jeden Fall interessant "The flexible, fast and secure template engine for PHP" "Twig is a modern template engine for PHP" "Symfony 2 PHP framework comes with a bundled support for Twig as default templating engine"
  • 4. {{ twig.description }} Was ist twig ? ● entwickelt von Armin Ronacher - als Phyton template-engine ● seit 2009 Default Template-Engine von Symfony2 (http://twig.sensiolabs.org/) ● erhältlich als Standalone-Lösung zur Einbindung in eigene PHP-basierte Lösungen ● basierend auf PHP5 - OOP-Templates ● das LESS/SASS für HTML :-)
  • 5. {{ drupal.twig }} #1499460 "I just wanted to let everyone know that I'm in support of rethinking the theme system. I'm also comfortable that the team will come up with a good solution." (Dries Buytaert, 18.04.2012) John Albin "We hand themers a loaded gun (PHP) and tell them to hammer in a nail with it. Oh, and be careful" (Drupalcon Denver)
  • 6. {{ phptemplate }} html.tpl.php Drupal 7 stark theme
  • 7. {{ twig }} html.twig Drupal 8 twig_stark theme
  • 8. {{ twig.advantages }} Vorteile von twig in Drupal ● mehr Sicherheit im Theming ● kein PHP/HTML Mix in Templates ● einfache Tag-basierte Syntax ● Wiederverwendbarkeit von Templates ● Vermeidung neuer Sicherheitslücken ● Integration in IDEs (Netbeans, vim, PHP- Storm etc..) ● gute Integration in Symfony2 - bringt beide Communities wieder ein Stück mehr zusammen
  • 9. {{ twig.disadvantages }} Nachteile von twig in Drupal ● steile Lernkurve (begrenzt auf Tag-Syntax) ● neue Syntax für Drupal-Themer ● Performance-Bedenken ● Update Zyklen Drupal vs. Twig
  • 10. {{ twig.internals }} Wie funktioniert das Ganze im Hintergrund ? 1. Template laden a. lexer - Zerlegung in kleinere Einzelteile (Token- Stream) zum Parsen b. parser - Konvertierung des Token-Streams in Abstract-Syntax-Tree oder Node-Tree c. compiler - Generierung des PHP-Codes für die Ausgabe aus Node-Tree / AST 2. Ausgabe des Template http://twig.sensiolabs.org/doc/internals.html
  • 11. {{ twig.features }} Was bringt uns das konkret ? ● Filter ● Kontroll-Strukturen ● Template-Vererbung ● Makros ● Erweiterbarkeit durch OOP ● Sandbox ● erkennt automatisch den PHP-Datentyp - "bye bye Theme-Render Array of DOOM"
  • 12. {{ twig.variables }} print $var_name ? phptemplate twig region Template im Vergleich
  • 13. {{ twig.filters }} Ausgabe von Variablen beeinflussen ● PHP-Funktionen ohne PHP ○ date, replace, url_encode, capitalize, striptags, join, reverse, length, sort, merge ● Chaining von Filtern
  • 14. {{ twig.functions }} Ausgabe von Variablen beeinflussen ● range, cycle, constant, random, attribute, block, parent, dump, date http://twig.sensiolabs.org/doc/functions/index.html Ausgabe von Feld-Inhalten mit alternating CSS Classes
  • 15. {{ twig.controlstructures }} loops, conditions einfache for-Schleifen, if-else Konstkrukte
  • 16. {{ twig.controlstructures }} loops, conditions phptemplate twig bessere Lesbarkeit
  • 17. {{ twig.includes }} andere Templates einbinden Wiederverwendbarkeit von Templates
  • 18. {{ twig.includes }} kleiner geht immer... stark-theme - theme.inc breadcrumb.twig liest das Array breadcrumbs aus und zeigt es als Liste an - hier wird die Funktion join verwendet Statt der vielen Theme-Funktionen in Drupal 7 stehen uns nun direkt die die Templates zur Verfügung, natürlich auch über _preprocess-hooks geändert werden könnten
  • 19. {{ twig.inheritance }} html.twig Vererbung von Templates maintenance-page.twig selektives Überschreiben - Variable .mobi in page_preprocess gesetzt
  • 20. {{ twig.macros }} re-usable pieces of view-logic Einbindung des Sidebar Macros in bestehende Template Datei
  • 21. {{ twig.demo }} na dann mal los ... http://twig.local/ einfaches Twig-Theme erstellen
  • 22. {{ twig.questions }} <h1>Fragen</h1> <ul> {% for question in audience.questions %} <li>{{ question|e }}</li> {% endfor %} </ul>
  • 23. {{ twig.links }} ● Drupal 8 Theme and Twig Sprint http://drupal.org/sandbox/pixelmord/1750250 ● Twig-Documentation http://twig.sensiolabs.org/documentation ● Templating Engines in PHP - http://fabien.potencier. org/article/34/templating-engines-in-php ● Drupal with Twig templates http://drupalmotion.com/article/drupal-twig-templates ● [meta] new theme system http://drupal.org/node/1499460 ● What to Expect in Drupal 8 http://lyemium.com/content/what-expect-drupal-8
  • 24. {{ twig.end }} {{ thx|default("Danke für die Aufmerksamkeit") }} {{ speaker.name|default("Steffen Rühlmann") }} {{ speaker.web|default("www.port11.de") }} {{ speaker.twitter|default("_steffenr") }} {{ speaker.email|default("steffen@port11.de") }}