Conference drupal 8 au Forum PHP 2013 à Paris

2,868 views

Published on

Conférence sur les nouveautés de Drupal 8 lors du Forum PHP 2013 à Paris.
Léon Cros a parlé de Views, Symfony2, Editeur CKEditor, Édition directe, HTML5, Mobile et smartphones, services web, ...

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

No Downloads
Views
Total views
2,868
On SlideShare
0
From Embeds
0
Number of Embeds
3
Actions
Shares
0
Downloads
0
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide

Conference drupal 8 au Forum PHP 2013 à Paris

  1. 1. Présentation de Drupal 8 Forum PHP - Montrouge 22 novembre 2013 Léon Cros @chipway . Forum PHP 2013 .
  2. 2. Léon Cros Communauté Drupal VP ADFF Chipway @chipway / chipway-drupal . Forum PHP 2013 .
  3. 3. Chipway : Spécialiste • Formations Drupal 6, 7, ... – – – – – Webmasters et administrateurs Développeurs Designers et intégrateurs Chefs de projet Drupal … initiation à avancé • Accompagnement/Coaching • Développement • Audit, Conseil, AMOA, ...
  4. 4. Drupal CMS & CMF reconnu . . . 4
  5. 5. Qui êtes-vous ? • • • • • Développeur PHP ? Chef de projet ? Admin. système, réseaux, DevOp ? Autre côté technique ? Non technicien ?
  6. 6. Vous et Drupal ? • Qui connait Drupal ? • Qui connait Symfony 2 ?
  7. 7. Nouveautés Drupal 8 . Forum PHP 2013 7
  8. 8. Un grand Pas avec Drupal 8 !
  9. 9. Faire un site Sans Développeur ?
  10. 10. Un « site » sans Développeur ? • • • • Core facile à installer Complet (prêt à utiliser) Dans ma langue / mes langues Facile à utiliser • Êtes-vous un cliqueur fou ?
  11. 11. En français Tout de suite !
  12. 12. Choix plus explicite !
  13. 13. Approche Drupal : Contenus → Structures de contenus
  14. 14. Approche Drupal : Contenus → Requêtes et Mise en forme des résultats Structures de contenus
  15. 15. Approche Drupal : Contenus → Affichage des blocs générés Requêtes et Mise en forme des résultats Structures de contenus
  16. 16. Approche Drupal : Contenus → Page Web Affichage des blocs générés Requêtes et Mise en forme des résultats Structures de contenus
  17. 17. Approche Drupal : Contenus → Page Web Services web Affichage des blocs générés Requêtes et Mise en forme des résultats Structures de contenus
  18. 18. Structurer : Nouveaux champs • • • • • • • Entity reference Date Lien E-mail Téléphone Photo User picture → champ
  19. 19. Structurer : Field UI • • • • • • • Modes d'affichage (vue, formulaire...) Aide dans le champ (placeholder, blur) Cardinalité sur mesure Préfixe de champ CRUD amélioré Validation séparée du formulaire (s2 validator) Multiples téléversements (uploads)
  20. 20. Structurer : Field UI • Field API entièrement réécrit • Entités « fieldables » → « extensibles » • Champ non partagé entre types d'entités – Stockage / type d'entité – Même nom dans types d'entité <> • Accès simplifié aux champs, ex: – $node->field_foo->value
  21. 21. Requête & Affichage : Views • • • • • • Qui ne connait pas Views ? Requête sur tous types d'entités Filtres Tris Contextes Affichages : Listes ..., grilles, slideshows menus, ...
  22. 22. Requête & Affichage : Views • • • • • • • Dans le Core Drupal 8 immédiatement utilisable Page d'accueil Administration des contenus, utilisateurs Gestion des fichiers Responsive web + sortie → services web
  23. 23. Page web : Affichage en Blocs Tout est BLOC ● Simplification ● Multiples instances ● Entités extensibles ● Révisions ● Support ESI ● IHM Admin. Amélioré ● Contexte
  24. 24. Moteur de Template • xxxx • ...
  25. 25. TWIG • • • • • • • • Connu, documenté Moins de templates / « Blocs Twig » Facile Plus Sécurisé que PHPTemplate Extensible Très rapide Bonne intégration IDEs Utilisé ailleurs : python, Ruby, ...
  26. 26. Parlez-vous TWIG ? • Template, ex de nom : node.html.twig • Commentaires avec variables disponibles • Imprimer une variable : {{ title }} • Plus compliqué : {{ content.field.image }} • Commentaire {# @todo ... my comment here #} • Test • {% if title %} • <h3>{{{ title }}</h3> • {% endif %} • Plus fort: partie personnalisée par autre template • {% block toto %} • que la partie différente !
  27. 27. Gestion des Assets Stylesheets, CSS and js <> images • Drupal 7 : • • • • Fichier Theme.info hook_library_info() #attached drupal_add_css(), drupal_add_js() • • • Jquery.js lourd Caching Opaque • Inconvénients :
  28. 28. Gestion des Assets D8 Assetic • • • • • Librairie Symfony2 Assets Filters AssetBag (Thème D7 : Sasson v3)
  29. 29. Mobile Mobiles
  30. 30. Mobile en D8 : Comment ? ● Web Services ● Responsive Design ● HTML 5 ● éléments (picture, téléphone) ● Administration Mobile ● IE <= 8 . Forum PHP 2013 32 32
  31. 31. Elements form. HTML5 $form['telephone'] = array( '#type' => 'tel', '#title' => t('Phone'), ); $form['website'] = array( '#type' => 'url', '#title' => t('Website'), ); $form['email'] = array( '#type' => 'email', '#title' => t('Email'), ); $form['tickets'] = array( '#type' => 'number', '#title' => t('Tickets required'), );
  32. 32. Performance Front-end ● Javascript ● Jquery 2.0 + chargé si besoin ● CSS avec SMACSS – Scalable and Modular Architecture for CSS ● Images adaptatives ● Assetic (CSS, JS) . Forum PHP 2013 34 34
  33. 33. Drupal 8 plus facile : Editeur • CKEditor 4 (non exclusif) • Utilisable dès l'installation du Core • Intégration complète avec formats de texte – Cliquer/déposer boutons + config F.T. • Téléversement d'image intégré • Légende • Intégré avec module breakpoint • Edition inline (quick edit)
  34. 34. Editeur de Texte ● . Forum PHP 2013 36 36
  35. 35. Editeur de Texte ● . Forum PHP 2013 37 37
  36. 36. Editeur de Texte ● . Forum PHP 2013 38 38
  37. 37. Editeur de Texte ● Bouton image + téléverser . Forum PHP 2013 39 39
  38. 38. Edition directe Quick edit
  39. 39. Edition directe Quick edit
  40. 40. Edition directe
  41. 41. Multilingue ? I speak english ! Je parle français ! . Forum PHP 2013 43 43
  42. 42. Multilingue I speak english ! Je parle français ! Se habla espanol ! . Я говорю на русском ! Forum PHP 2013 44 44
  43. 43. Drupal 8 : MultiLingue 4 piliers Langues Interface Contenu Configuration
  44. 44. Langues Choix dès l'installation ● Supprimer anglais ;) ● Visibilité des blocs ● Langue dans Views ● Configuration souple ● Affectation + large ● ● ● Entités, Vues, Alias, Infos du site Non affecté <> non applicable Détection améliorée ● Translitération ●
  45. 45. Traduction Interface Traduire en anglais ;) ● Nouvel interface + simple ● ● pluriel Suivi traductions Perso. ● Import : Timeouts ● Dossier centralisé ● Mise à jour auto depuis localize.drupal.org ● Module séparé ●
  46. 46. Traduction du Contenu Tous types d'entités ● Configuration dynamique / bundle / champ ● Index recherche / langue ● API de recherche ● Support API node access ●
  47. 47. Traduction Configuration Onglet traduction ● Langue / fichier de config ● Config supporte schema ● Pour toute config ● UI pour seul Core ● UI amélioré / contrib ●
  48. 48. Services Web : REST • • • • • • • • • • • • . Inter-machines Modules REST + Serialization + HAL Formats de base JSON ou XML Méthodes HTTP : POST, GET, PATCH, DELETE Types de média json : json, hal+json URIs : GET /node/1, GET /entity/node/1 Link Relations Richardson Maturity Model : niveau 2. 3 @todo Profite du nouvel Entity API, de Views Accès / Cookies + token ← Serialize <> Normalize → Extensible Forum PHP 2013 50 50
  49. 49. Déploiement des Configurations Sans CMI
  50. 50. Déploiement des Configurations Principe CMI ALERT! ALERT! Important announcement about something. Important announcement about something.
  51. 51. Configuration : <> contenu • Paramètres • Types de contenus • Champs • Vues • Styles d'mages • Permissions, Rôles •…
  52. 52. Configuration en D8 Configuration stockée en fichiers • modifs via l'interface admin • écrites directement dans fichier yml • format populaire YAML • facile à lire / « écrire » • Entités de configuration
  53. 53. Ex : search.settings.yml active_modules: - node - user and_or_limit: '7' default_module: node index: cron_limit: '100' overlap_cjk: '1' minimum_word_size: '3' tag_weights: h1: '25' h2: '18' H3: '15'
  54. 54. Active <> Staging .
  55. 55. Active <> Staging .
  56. 56. Configuration Management Interface Règle d'or : « Ne hackez jamais le core ! … ou Dries tue un chaton» « Ne hackez pas votre configuration active ! » * * Alex Pott, Core committer and CMI maintainer . Forum PHP 2013 58 58
  57. 57. Architecture technique • > 500 lignes dans CHANGELOG.txt • 24 APIs nouveaux ou modifiés • Plugins (← hooks) • • • • • • Entity API dans Core + amélioré CMI Routage Services Objets Formulaires ...
  58. 58. Révolution POO Il est temps de passer vraiment à la POO ! This guy killed Procedural Programming in Drupal
  59. 59. Révolution POO PHP Objet Procédural Librairie PHP ?
  60. 60. Composants Symfony Pourquoi Symfony2 ? « Nouvelle » approche : Fièrement trouvé ailleurs
  61. 61. Composants Symfony2 utilisés • • • • • • • • . HttpFoundation HttpKernel Injection de dépendances Event dispatcher Routage Serializer Validator Yaml Forum PHP 2013 63 63
  62. 62. Améliorations diverses • PHPUnit accélère les tests • Module Tour – Mieux que help • Support ESI/CSI/SSI p. cache • Amélioration API fichiers/médias • Dossier Core/
  63. 63. Synthèse Améliorations Drupal 8 par profil © Chipway 2009-2011 Forum PHP 2013 65
  64. 64. Intégrateurs / Assembleurs Utilisation de Schema.org (RDF) ● Services web REST ● Blocs ● Editeurs ● Gestion des changements de configuration ● UUID ● Tour (help) ●
  65. 65. Designers / Thémeurs Twig ● Backbone.js ● Assetic ● Javascript accessibility Features ● Jquery 2.0 ● CSS Coding Standards ● Responsive Web Design ● HTML5 ● drupal_add_css, drupal_add_js, drupal_set_title, drupal_set_breadcrumb ●
  66. 66. Développeurs / Codeurs POO ● Composants Symfony2 (voir au-dessus) ● Symfony CMF ● Doctrine annotations ● Composer ● Namespaces & PSR-0 → 4 ● Services Symfony ●
  67. 67. Développeurs / Codeurs YAML ● PHPUnit (simpletest out en D9) ● Nouvelles librairies externes ● Guzzle (drupal_http_request) ● EasyRDF (parsing RDF) ● Zend_Feed (Feeds) ●
  68. 68. Drupal 8 + difficile : Développer ● Programmation orientée Objet (POO) ● Symfony2 ● Plus difficile ? Ou plus simple ? ● Déconstruire & reconstuire ? . Forum PHP 2013 70 70
  69. 69. Synthèse Drupal 8 - Core  Mobile / Responsive  Editeur disponible dès l'installation  Multilingue  Séparation Configuration / Contenu  Theming plus facile/ouvert  Tout est Bloc  Services web dans le Core  Cycle développement → Production géré  Et OOP ! . Forum PHP 2013 71 71
  70. 70. Conclusion : Drupal 8 c'est plus  Harmonisé / simplifié / mieux intégré  Modernisé / Etat de l'art Dev PHP  Généralisé (mobiles, services...)  Localisé (langues, traductions)  Professionnalisé et Ouvert aux nouveaux  Sécurisé  « Accéléré »  Plus facile à Adopter . Forum PHP 2013 72 72
  71. 71. Planning Drupal 8 Gel du Code Début Développement 10 Mar 2011 5 Jan 2011 Drupal 7.0 1 Juil 2013 17 Fév 2013 Gel des Fonctionnalités S2 2014 ? Drupal 8.0
  72. 72. Remerciements Slides : Drupal : ● Dries Angela “webchick” Byron ● ● Contributeurs Kristof De Jaeger ● ● Communauté Jen Lampton ● Dries Buytaert ● Gábor Hojtsy Déjà > 1600 contributeurs! ● Larry Garfield ● Jingsheng Wang ● Christopher Skene ● Boris Gordon ●
  73. 73. Merci de votre attention Questions ? Vos retours sur https://joind.in/9369 @chipway . lcros@chipway.com Forum PHP 2013 75

×