Drupagora

Drupal 8
Léon Cros @chipway
5 décembre 2013
Léon Cros
> Communauté
> VP

ADFF

> Chipway

Drupal
Chipway : Spécialiste
Formations Drupal 6, 7, … d'initiation à avancé
> Chefs de projet Drupal
> Développeurs
> Webmasters...
Drupal CMS & CMF reconnu

.

.

.

4
Qui êtes-vous ?
> Chef de projet ?
> DSI ou RSI ?
> Développeur ?
> Site builder ou intégrateur ?
> Administrateur système...
Vous et Drupal ?
> Qui travaille avec Drupal ?
> Qui travaille avec Symfony 2 ?
> Qui découvre Drupal ?
Nouveautés Drupal 8 Core
Enjeux pour les Chefs de projet et DSI
Satisfaction client
> Périmètre
> Contraintes techniques
> Qualité
> Gestion du cha...
Un grand
Pas avec
Drupal 8 !
Développer
un site sans
Programmer ?
Développer
un site sans
programmer
?

> Core

facile à installer
> Complet (prêt à utiliser)
> Dans ma langue / mes langue...
Halte au cliqueur fou !
Un projet reste un Projet
> Faisabilité
> Conception
> Ressources
> Planification
> Suivi
> Bonnes...
Drupal plus simple
En français
Tout de suite !
Drupal plus simple
Options plus
explicites !
Drupal plus simple
Traductions
Immédiatement
disponibles !
Drupal plus simple
Approche Drupal : Contenus → … D7
Page Web

Affichage des blocs générés
Requêtes et Mise en forme des résultats
Structures...
Approche Drupal : Contenus → D8
Page Web

Services web

Affichage des blocs générés
Requêtes et Mise en forme des résultat...
Structurer : Nouveaux champs
> Entity reference
> Date
> Lien
> E-mail
> Téléphone
> Photo
User picture → champ
Structurer : Nouveautés Field UI
> Modes d'affichage (vue, formulaire...)
> CRUD amélioré
> Validation séparée du formulai...
Structurer : Nouveautés Field UI
> Field API entièrement réécrit
> Entités « fieldables » → « extensibles »
> Champ non pa...
Requête & Affichage : Views
Qui ne connait pas Views ?
> Requête sur tous types d'entités
> Filtres
> Tris
> Contextes
> A...
Requête & Affichage : Views
> Dans le Core
> Drupal 8 immédiatement utilisable
> Page d'accueil
> Administration des conte...
Page web : Affichage en Blocs
Tout est BLOC
> Simplification
> Multiples instances
> Entités extensibles
> Révisions
> Sup...
Moteur de Template
TWIG
> Connu, documenté
> Moins de templates / « Blocs Twig »
> Facile
> Plus Sécurisé que PHPTemplate
> Extensible
> Très...
Parlez-vous TWIG ?
> Template, ex de nom : node.html.twig
> Commentaires avec variables disponibles
> Imprimer une variabl...
Gestion des Assets CSS et JS en D8
Assetic
> Librairie Symfony2
> Assets
> Filters
> AssetBag
> (thème D7 : Sasson v3)
Drupal Mobile : Comment ?
> Web Services
> HTML 5
> Responsive Design
> Administration Mobile
Performance Front-end
> Javascript
> Jquery 2.0 + chargé si besoin
> CSS avec SMACSS
•Scalable and Modular Architecture fo...
Drupal 8 plus facile : Editeur
> CKEditor 4
(non exclusif)
> Utilisable dès l'installation du Core
> Intégration complète ...
Editeur de Texte
Editeur de Texte
Editeur de Texte
Editeur de Texte

Bouton image + téléverser
Editeur directe

Quick edit
Editeur directe

Quick
edit
Multilingue ?
I speak
english !

Je parle
français !

.

Drupagora 2013

38
Multilingue ?
I speak
english !

Je parle
français !
Se habla
espanol !

.

Я говорю на
русском !

Drupagora 2013

39
Drupal 8 : Multilingue
> Choix dès l'installation
> Affectation à tout et tous types d'entités
> Traduire en anglais ;)
> ...
Services Web : REST
> Inter-machines
> Modules REST + Serialization + HAL
> Formats de base JSON ou XML
> Méthodes HTTP : ...
Déploiement des Configurations
Sans CMI
Déploiement des Configurations
Configuration : <> contenu
> Paramètres
> Types de contenus
> Champs
> Vues
> Styles d'mage...
Déploiement des Configurations
Configuration stockée en fichiers
> Paramètres
> Modifs via l'interface admin
écrites direc...
Configurations : Active <> Staging
Nouvelle règle d'or
« Ne hackez jamais le core ! …
ou Dries tue un chaton»

« Ne hackez pas votre configuration active ! »...
Révolution POO
Il est temps
de passer
vraiment à
la POO !

This guy killed Procedural
Programming in Drupal
Révolution POO
PHP
Objet

Procédural

Librairie PHP ?
Composants Symfony

Pourquoi Symfony2 ?
« Nouvelle » approche :
Fièrement trouvé ailleurs
Composants Symfony2 utilisés
> HttpFoundation
> HttpKernel
> Injection de dépendances
> Event dispatcher
> Routage
> Seria...
Autres améliorations
> PHPUnit accélère les tests
> Module Tour (mieux que help)
> Support ESI/CSI/SSI p. cache
> Améliora...
Synthèse

Principales
Améliorations Drupal 8
par profil
Intégrateurs / Assembleurs
> Utilisation de Schema.org (RDF)
> Services web REST
> Blocs
> Editeurs
> Gestion des changeme...
Designers / Thémeurs
> Twig
> Backbone.js
> Assetic
> Javascript accessibility Features
> Jquery 2.0
> CSS Coding Standard...
Développeurs / Codeurs
> POO
> Composants Symfony2
> Symfony CMF
> Doctrine annotations
> Composer
> Namespaces & PSR-0 → ...
Développeurs / Codeurs
> YAML
> PHPUnit (simpletest out en D9)
> Nouvelles librairies externes
> Guzzle (drupal_http_reque...
Chefs de projet et DSI
Satisfaction client
> Périmètre (utilisable tout de suite, services web)
> Contraintes techniques (...
Synthèse Drupal 8 - Core
> Mobile / Responsive
> Editeur disponible dès l'installation
> Multilingue
> Séparation Configur...
Conclusion : Drupal 8 c'est PLUS
> Harmonisé / simplifié / mieux intégré
> Modernisé / Etat de l'art Dev PHP
> Généralisé ...
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
Fo...
Remerciements
Slides :

Drupal :

●
Dries
Angela “webchick” Byron
●
Contributeurs
●
Kristof De Jaeger
●
Communauté
●
Jen L...
Merci de votre attention
Questions ?
Vos retours sur #drupagora
@chipway

lcros@chipway.com

Slides sur :
http://fr.slides...
Drupal 8 + difficile : Développer
●

Programmation orientée Objet (POO)

●

Symfony2

●

Plus difficile ? Ou plus simple ?...
Gestion des Assets CSS et JS
Drupal 7 :
> Fichier .info du thème
> Hook_library_info
> #attached
> drupal_add_css(), drupa...
Elements form. HTML5
$form['telephone'] = array(
'#type' => 'tel',
'#title' => t('Phone'),
);
$form['website'] = array(
'#...
Editeur directe

Quick edit
Ex : search.settings.yml
active_modules:
- node
- user
and_or_limit: '7'
default_module: node
index:
cron_limit: '100'
ove...
Active <> Staging

.
Editeur directe

Quick
edit
Upcoming SlideShare
Loading in...5
×

Conference drupal-8-drupagora2013

1,032

Published on

Nouveautés Drupal 8 expliquées aux Chefs de Projets et DSI, lors de Drupagora, par Léon Cros.

Published in: Technology
0 Comments
4 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
1,032
On Slideshare
0
From Embeds
0
Number of Embeds
5
Actions
Shares
0
Downloads
0
Comments
0
Likes
4
Embeds 0
No embeds

No notes for slide

Transcript of "Conference drupal-8-drupagora2013"

  1. 1. Drupagora Drupal 8 Léon Cros @chipway 5 décembre 2013
  2. 2. Léon Cros > Communauté > VP ADFF > Chipway Drupal
  3. 3. Chipway : Spécialiste Formations Drupal 6, 7, … d'initiation à avancé > Chefs de projet Drupal > Développeurs > Webmasters et administrateurs > Designers et intégrateurs, ... > Audit et Conseil > Accompagnement/Coaching > Développement
  4. 4. Drupal CMS & CMF reconnu . . . 4
  5. 5. Qui êtes-vous ? > Chef de projet ? > DSI ou RSI ? > Développeur ? > Site builder ou intégrateur ? > Administrateur système, réseaux, DevOp ? > Autre côté technique ? > Non technicien ?
  6. 6. Vous et Drupal ? > Qui travaille avec Drupal ? > Qui travaille avec Symfony 2 ? > Qui découvre Drupal ?
  7. 7. Nouveautés Drupal 8 Core
  8. 8. Enjeux pour les Chefs de projet et DSI Satisfaction client > Périmètre > Contraintes techniques > Qualité > Gestion du changement > Délais > Budget
  9. 9. Un grand Pas avec Drupal 8 !
  10. 10. Développer un site sans Programmer ?
  11. 11. Développer un site sans programmer ? > Core facile à installer > Complet (prêt à utiliser) > Dans ma langue / mes langues > Facile à utiliser
  12. 12. Halte au cliqueur fou ! Un projet reste un Projet > Faisabilité > Conception > Ressources > Planification > Suivi > Bonnes pratiques
  13. 13. Drupal plus simple En français Tout de suite !
  14. 14. Drupal plus simple Options plus explicites !
  15. 15. Drupal plus simple Traductions Immédiatement disponibles !
  16. 16. Drupal plus simple
  17. 17. Approche Drupal : Contenus → … D7 Page Web Affichage des blocs générés Requêtes et Mise en forme des résultats Structures de contenus
  18. 18. Approche Drupal : Contenus → D8 Page Web Services web Affichage des blocs générés Requêtes et Mise en forme des résultats Structures de contenus
  19. 19. Structurer : Nouveaux champs > Entity reference > Date > Lien > E-mail > Téléphone > Photo User picture → champ
  20. 20. Structurer : Nouveautés Field UI > Modes d'affichage (vue, formulaire...) > CRUD amélioré > Validation séparée du formulaire (s2 validator) > Aide dans le champ (placeholder, blur) > Cardinalité sur mesure > Préfixe de champ > Multiples téléversements (uploads)
  21. 21. Structurer : Nouveautés 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
  22. 22. 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, ...
  23. 23. 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
  24. 24. Page web : Affichage en Blocs Tout est BLOC > Simplification > Multiples instances > Entités extensibles > Révisions > Support ESI > IHM Admin. Amélioré > Contexte
  25. 25. Moteur de Template
  26. 26. 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, ...
  27. 27. 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 !
  28. 28. Gestion des Assets CSS et JS en D8 Assetic > Librairie Symfony2 > Assets > Filters > AssetBag > (thème D7 : Sasson v3)
  29. 29. Drupal Mobile : Comment ? > Web Services > HTML 5 > Responsive Design > Administration Mobile
  30. 30. Performance Front-end > Javascript > Jquery 2.0 + chargé si besoin > CSS avec SMACSS •Scalable and Modular Architecture for CSS > Images adaptatives > Assetic (CSS, JS)
  31. 31. Drupal 8 plus facile : Editeur > CKEditor 4 (non exclusif) > Utilisable dès l'installation du Core > Intégration complète / formats de texte > Téléversement d'image intégré > Légende > Intégré avec module breakpoint > Edition inline (quick edit)
  32. 32. Editeur de Texte
  33. 33. Editeur de Texte
  34. 34. Editeur de Texte
  35. 35. Editeur de Texte Bouton image + téléverser
  36. 36. Editeur directe Quick edit
  37. 37. Editeur directe Quick edit
  38. 38. Multilingue ? I speak english ! Je parle français ! . Drupagora 2013 38
  39. 39. Multilingue ? I speak english ! Je parle français ! Se habla espanol ! . Я говорю на русском ! Drupagora 2013 39
  40. 40. Drupal 8 : Multilingue > Choix dès l'installation > Affectation à tout et tous types d'entités > Traduire en anglais ;) > Nouvel interface + simple > Suivi traductions Personnalisées > MAJ ← localize.drupal.org « complet dès le Cœur »
  41. 41. 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 > Profite du nouvel Entity API, de Views > Accès / Cookies + token > ← Serialize <> Normalize → > Extensible
  42. 42. Déploiement des Configurations Sans CMI
  43. 43. Déploiement des Configurations Configuration : <> contenu > Paramètres > Types de contenus > Champs > Vues > Styles d'mages > Permissions, Rôles > ...
  44. 44. Déploiement des Configurations Configuration stockée en fichiers > Paramètres > Modifs via l'interface admin écrites directement dans fichier yml > Format populaire YAML > Facile à lire et « écrire » > Entités de configuration
  45. 45. Configurations : Active <> Staging
  46. 46. Nouvelle 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
  47. 47. Révolution POO Il est temps de passer vraiment à la POO ! This guy killed Procedural Programming in Drupal
  48. 48. Révolution POO PHP Objet Procédural Librairie PHP ?
  49. 49. Composants Symfony Pourquoi Symfony2 ? « Nouvelle » approche : Fièrement trouvé ailleurs
  50. 50. Composants Symfony2 utilisés > HttpFoundation > HttpKernel > Injection de dépendances > Event dispatcher > Routage > Serializer > Validator > Yaml Utilise ≠ Application Symfony2
  51. 51. Autres améliorations > 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/ > Plugins (← hooks) > Entity API dans Core + amélioré > Objets Formulaires > Migration
  52. 52. Synthèse Principales Améliorations Drupal 8 par profil
  53. 53. Intégrateurs / Assembleurs > Utilisation de Schema.org (RDF) > Services web REST > Blocs > Editeurs > Gestion des changements de configuration > UUID > Tour (help)
  54. 54. 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
  55. 55. Développeurs / Codeurs > POO > Composants Symfony2 > Symfony CMF > Doctrine annotations > Composer > Namespaces & PSR-0 → 4 > Services Symfony
  56. 56. Développeurs / Codeurs > YAML > PHPUnit (simpletest out en D9) > Nouvelles librairies externes > Guzzle (drupal_http_request) > EasyRDF (parsing RDF) > Zend_Feed (Feeds)
  57. 57. Chefs de projet et DSI Satisfaction client > Périmètre (utilisable tout de suite, services web) > Contraintes techniques (plus adaptable) > Qualité (s2, POO, PHPUnit, ...) > Gestion du changement (complète et pro) > Délais (plus simple, complet, rapide) > Budget (baisse du point d'entrée, + simple, + Devs, + pérenne)
  58. 58. 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 !
  59. 59. Conclusion : Drupal 8 c'est PLUS > Harmonisé / simplifié / mieux intégré > Modernisé / Etat de l'art Dev PHP > Généralisé (multi-terminaux, services...) > Localisé (langues, traductions) > Professionnalisé et Ouvert aux nouveaux > Sécurisé > « Accéléré » > Plus facile à Adopter
  60. 60. 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
  61. 61. Remerciements Slides : Drupal : ● Dries Angela “webchick” Byron ● Contributeurs ● Kristof De Jaeger ● Communauté ● Jen Lampton ● Dries Buytaert Déjà > 1800 contributeurs ! ● Gábor Hojtsy ● Larry Garfield ● Jingsheng Wang ● Christopher Skene ● Boris Gordon ●
  62. 62. Merci de votre attention Questions ? Vos retours sur #drupagora @chipway lcros@chipway.com Slides sur : http://fr.slideshare.net/chipway/Conference-Drupal-8-Drupagora2013
  63. 63. Drupal 8 + difficile : Développer ● Programmation orientée Objet (POO) ● Symfony2 ● Plus difficile ? Ou plus simple ? ● Déconstruire & reconstruire ? . Drupagora 2013 63 63
  64. 64. Gestion des Assets CSS et JS Drupal 7 : > Fichier .info du thème > Hook_library_info > #attached > drupal_add_css(), drupal_add_js() Inconvénients : > jQuery.js lourd > Caching opaque
  65. 65. 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'), );
  66. 66. Editeur directe Quick edit
  67. 67. 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'
  68. 68. Active <> Staging .
  69. 69. Editeur directe Quick edit

×