Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Drupal 8 overview

Drupal 8 overview

Quickly hacked the "offical" Drupal 8 Preview Slideshow to keep a session to my co-workers at Integral Vision. Heavily used Schnitzel's DCBarcelona Drupal 8 experience session record too. Thanks to all!

Tamás Hajas

October 07, 2015
Tweet

More Decks by Tamás Hajas

Other Decks in Technology

Transcript

  1. It works!
    It’s great!
    M. Schnitzel, Head of Technology, Amazee Labs

    View full-size slide

  2. Drupal 8 

    improvements
    for end-users
    & clients

    View full-size slide

  3. Authoring improvement: 

    WYSIWYG in Core

    View full-size slide

  4. Authoring improvement: 

    In-place editing

    View full-size slide

  5. Authoring improvement: 

    In-place editing

    View full-size slide

  6. Authoring improvement:

    New content creation page

    View full-size slide

  7. Authoring improvement:

    Preview on the frontend

    View full-size slide

  8. It’s mobile-first

    View full-size slide

  9. Responsive themes, images,
    breakpoints

    View full-size slide

  10. Mobile-friendly administration

    View full-size slide

  11. Mobile-first “overlay”

    View full-size slide

  12. Restyled administration interface 


    View full-size slide

  13. Multilingual
    improvements in
    Drupal 8

    View full-size slide

  14. source: http://www.drupal8multilingual.org/

    View full-size slide

  15. Community translation downloads

    View full-size slide

  16. Language data tracking expanded

    View full-size slide

  17. Translation on (almost) everything

    View full-size slide

  18. More info
    Installing and Choosing Modules for Multilingual in Drupal 8
    https://www.drupal.org/node/2415945
    Multilingual demo install
    https://www.drupal.org/project/multilingual_demo
    Workshop video
    http://www.drupal8multilingual.org/workshop
    Initiative site
    http://www.drupal8multilingual.org/

    View full-size slide

  19. Drupal 8
    improvements
    for site builders

    View full-size slide

  20. Fieldable blocks
    Everything is an entity and
    (almost) everything is fieldable

    View full-size slide

  21. Everything is in blocks

    View full-size slide

  22. Place multiple copies of any block

    View full-size slide

  23. New field types
    Date/Datetime
    Entity Reference
    …plus, Link, Phone, Email, Comments!

    View full-size slide

  24. Form displays: customize the look
    and feel of data entry forms
    built in view modes ui too

    View full-size slide

  25. Views in Core

    View full-size slide

  26. Drupal 8
    improvements for
    designers and
    themers

    View full-size slide

  27. Killed support for IE 6 & 7 

    (and most of 8)

    View full-size slide

  28. HTML5 Form Elements

    View full-size slide

  29. New front-end libraries

    View full-size slide

  30. Native Schema.org Output

    View full-size slide

  31. Twig Example: node.html.twig

    {{ title_prefix }}
    {% if not page %}

    {{ label }}

    {% endif %}
    {{ title_suffix }}
    {% if display_submitted %}

    {{ author_picture }}
    without('class') }}>
    {% trans %}Submitted by {{ author_name|passthrough }} on
    {{ date }}{% endtrans %}
    {{ metadata }}


    {% endif %}
    without('class') }}>
    {{ content|without('links') }}

    {% if content.links %}

    {{ content.links }}

    {% endif %}

    1. HTML5 tags
    2. {{ print a variable }}
    3. {% logic(stuff) %}

    View full-size slide

  32. Twig blocks & extends
    Twig Blocks are not Drupal Blocks!
    {# Extending the page template to override the title #}
    {% extends 'themes/THEMENAME/templates/page.html.twig' %}
    {% block title %}
    Nice New Title for the whole world to see.
    {% endblock %}
    https://www.newmediadenver.com/blog/twig-extending-templates

    View full-size slide

  33. CSS is SMACS & BEM based
    #id not used (for styling) / removed
    90% of the div removed
    libs (eg. jQuery) aren’t loaded by
    default
    better accessibility

    View full-size slide

  34. More info
    Theming session in DCBarcelona by mortendk
    https://events.drupal.org/barcelona2015/sessions/drupal-8-theming-0
    Backend of the front-end (DCBarcelona, laurii)
    https://events.drupal.org/barcelona2015/sessions/drupal-8-theme-system
    http://drupal.org/theme-guide/8
    drupal.org/coding-standards/css

    View full-size slide

  35. Decoupled Drupal
    http://buytaert.net/the-future-of-decoupled-drupal
    http://zensations.at/blog/headless-drupal-cake-lie

    View full-size slide

  36. Drupal 8
    improvements
    for developers

    View full-size slide

  37. Keep calm and
    drush cr

    View full-size slide

  38. Configuration management
    dev stage production

    View full-size slide

  39. Drush integration for automation

    View full-size slide

  40. Configuration management in Drupal 8 (Drupalaton 2013)
    https://videotorium.hu/hu/recordings/details/
    6837,Configuration_management_in_Drupal_8
    Configuration management in Drupal 8 (Drupalaton 2015)
    https://www.youtube.com/watch?
    v=OVFQDdTRCeM&list=PLB89p5xo_6ST7DM69sJVEPRIA9hrS6h2-
    &index=5
    http://nuvole.org/blog/2015/aug/10/drupal-8-configuration-management-
    beware-pitfalls
    More info

    View full-size slide

  41. Features?
    “In Drupal 8, Features will return to it's
    original mission of bundling functionality
    rather than just managing configuration.”
    – M. Potter, Features maintainer
    https://events.drupal.org/barcelona2015/sessions/features-drupal-8

    View full-size slide

  42. Getting off the island*
    * http://www.garfieldtech.com/blog/off-the-island-2013

    View full-size slide

  43. HttpFoundation
    HttpKernel
    Dependency
    Injection
    EventDispatcher
    Routing
    Yaml
    Symfony framework

    View full-size slide

  44. Not invented here 

    "Proudly Found Elsewhere"
    Much more modern, object-oriented code
    (classes, inheritance, interfaces, etc.)
    Embracing latest PHP standards (e.g. PSR-4*,
    namespaces, traits)
    Using many “best of breed” external libraries:
    Composer, PHPUnit, Guzzle, Zend Feed
    Component…
    Non-Drupal developers can start work right away
    * http://www.php-fig.org/psr/psr-4/

    View full-size slide

  45. Entity API
    Plugins
    Services

    View full-size slide

  46. Plugin System
    Bart Feenstra: The Drupal 8 plugin system: extensibility for all
    https://www.youtube.com/watch?
    v=IoxEtvydKuc&list=PLB89p5xo_6ST7DM69sJVEPRIA9hrS6h2-&index=7
    Drupal 8 Plugin Deep Dive (DCBarcelona)
    https://events.drupal.org/barcelona2015/sessions/drupal-8-plugin-deep-dive

    View full-size slide

  47. Web services
    other
    systems
    or
    framewor
    ks
    desktop
    Android
    applicati
    ons
    other
    Drupal
    sites
    Flash
    compone
    nts
    iPhone
    applicati
    ons
    kiosk
    applicati

    View full-size slide

  48. GETting data out of Drupal: 

    RESTful Web Services module

    View full-size slide

  49. GETting data into Drupal: Guzzle
    $client = \Drupal::httpClient();
    $config =
    \Drupal::config('3rdparty.settings');
    // Format arguments for passing in
    URL.
    $arg = urlencode($argument);
    // Pull data from 3rd party's REST
    API.
    $api_key = $config->get('api_key');
    $request =
    $client->get("http://3rdparty.com/
    $arg/?key=$api_key");
    // Get the response and do something
    with it.
    $response = $request->send();
    $json = $response->json();
    ...

    View full-size slide

  50. Hack core without hacking core
    Override services

    View full-size slide

  51. No IDE?
    No debugger?
    No Drupal 8!

    View full-size slide

  52. drupal.org/project/examples
    or check core’s code

    View full-size slide

  53. API documentation
    https://www.drupal.org/developing/api/8
    Symfony for Drupal developers
    https://events.drupal.org/barcelona2015/sessions/symfony-drupal-
    developers
    Dependecy injection
    https://events.drupal.org/barcelona2015/sessions/dependency-injection
    what-why-how-when
    More info

    View full-size slide

  54. Catch all of the improvements!
    https://www.drupal.org/list-changes/drupal

    View full-size slide

  55. Performance
    Making Drupal fly - The fastest Drupal ever is here!
    https://events.drupal.org/barcelona2015/sessions/making-drupal-fly-fastest-drupal-ever-here
    The future of decoupled Drupal
    http://buytaert.net/the-future-of-decoupled-drupal
    https://www.youtube.com/watch?t=41&v=JwzX0Qv6u3A
    BigPipe
    Smart Caching

    View full-size slide

  56. What about the upgrade path?
    Instead of an upgrade path, Drupal 8 have a
    migration path!
    Some Drupal 6 migrations already in core,
    more in the works, see https://
    groups.drupal.org/imp
    https://dev.acquia.com/blog/seamless-
    migration-drupal-8-make-it-yours

    View full-size slide

  57. What’s this 8.0.0 talk?
    Drupal 8 will use semantic versioning
    Drupal 8.1.0 will include new features and/or
    APIs
    New releases will be (mostly) backwards
    compatible
    New 8.x releases every 6 months (planned)
    No need to wait years for new things
    Bugfixes in minor releases, eg. 8.1.5

    View full-size slide

  58. What about contributed modules?
    Check status of contrib module upgrades at:
    drupal.org/project/contrib_tracker
    To avoid upgrade pain, stick to well-vetted
    contributed modules over custom code.
    Other tips: www.acquia.com/blog/getting-your-
    site-ready-drupal-8

    View full-size slide

  59. And my own modules?
    To start the upgrade of you own code, use
    drupal.org/project/drupalmoduleupgrader
    If you need to or want to start your module
    fresh, see drupal.org/project/console
    Creating Drupal 8.x modules
    https://www.drupal.org/node/1915030

    View full-size slide