Seminaire Drupal 8 à Nantes

DRUPAL 8
SÉMINAIRE SMILE
© Copyright Smile - Toute reproduction interdite sans autorisation

2
QUI SOMMES-NOUS ?

3
SMILE, EN QUELQUES CHIFFRES
1er INTÉGRATEUR EUROPÉEN DE SOLUTIONS OPEN
SOURCE
+ de 20
+ de 40
+ de 50
ANNÉES D’EXPERIENCE
AU SERVICE DE L’OPEN SOURCE
PARTENAIRES
OPEN SOURCE
MILLIONS D’EUROS
DE CHIFFRE D’AFFAIRES EN 2014
800
EXPERTS
DE L’OPEN SOURCE
25%DE CROISSANCE
PAR AN

4
16 AGENCES SMILE
DANS 8 PAYS
Smile développe
sa présence
dans toute
l’Europe

L’OPEN SOURCE : TECHNOLOGIE D’AVENIR
Technologies de pointe
sur les sujets
Cloud,
Big data
Jusqu’à 65%
de ROI SAVING
Drupal utilisé par la Maison Blanche
Linux motorise toutes les bourses mondiales
$
Plus de 92%
des grandes entreprises
utilisent massivement
l’open source
Twitter, Facebook, Google
sont bâtis sur des briques
open source
INNOVANT
SÉCURISÉ
POPULAIRE
MATURE &
STABLE

6
SMILE, LE PREMIER INTÉGRATEUR OPEN SOURCE EUROPÉ
SMILE LE PLUS GROS ACTEUR DE L’OPEN SOURCE EN EUROPE
800 collaborateurs, 16 agences, 300 nouveaux projets par an
MULTI-TECHNOLOGIES, EXPERTISE UNIQUE
Plus de 40 partenariats technologiques, le plus haut niveau de reconnaissance
pour la plupart.

7
SMILE, BEAUCOUP PLUS QU’UN SIMPLE INTÉGRATEUR
AMBASSADEUR
• Membre de l’APRIL et du PLOSS et en province
d’Alliance Libre, du Pôle Régional Numérique, du
PLOSS RA…
• Organisateur, sponsor et participant de plus de 10
événements majeurs chaque année : Open World
Forum, CMSday, Salon Solutions Linux,
Documation, Bargento…
• 30 séminaires et webinar par an.
• Des articles et livres blancs régulièrement publiés.
Plus de 100 000 téléchargements par an.
• Créateur et animateur du site :
open- source-guide.com
CONTRIBUTEUR
Des dizaines d’extensions et
de contributions pour les
solutions TYPO3, OpenERP,
eZ Publish, Redmine,
Magento, Drupal, jQuery,
Ginco, Play! Framework…
EDITEUR DE
ESIGate, MageCache,
Mongogento…

8
NOS EXPERTISES ET NOS CONVICTIONS
DANS NOS LIVRES
BLANCSCulture du web
Infrastructure
E-business
Gestion de contenu
ERP et Décisionnel
+ de
100 000
TÉLÉCHARGEMENTS / AN

9
ILS NOUS FONT
CONFIANCE
NOS RÉFÉRENCES

10
QUE FAIT-ON POUR VOUS ?
CONSEIL
Cadrage / Audits / Benchmark
AGENCE
Identité visuelle / Ergonomie
Accessibilité / Stratégie
Éditoriale / Référencement
EXPLOITATIO
N
Hosting / Infogérance /
Maintenance corrective et
évolutive / Support
FORMATION
Accompagnement au changement
Formation intra et inter entreprises
INGÉNIERIE
Conception / Développement /
Paramétrage
DES SERVICES DE
GRANDE QUALITÉ
POUR UNE
COUVERTURE À 360°
DE VOS PROJETS

11
5 OFFRES AU PLUS PRÈS DE VOTRE MÉTIER
WEB
Sites Internet / Portails web
Mobiles et nouveaux écrans
Gestion de contenus cross-medias
Dispositifs digitaux
WEB

12
WEB
E-BUSINESS
Catalogues
Plateformes e-commerce
Extranet Clients B2B
Cross-canal et expériences clients
multi-devices
E-BUSINESS

13
WEB
E-BUSINESS
COLLABORATIF
Portails intranet
Gestion documentaire
Digital Asset Management
Réseaux sociaux d’entreprise
Recherche
COLLABORATIF

14
5 OFFRES AU PLUS PRÈS DE VOTRE METIER
WEB
E-BUSINESS
COLLABORATIF
S.I. METIERS
Intégration de données
Business Intelligence
Progiciel de gestion intégré
Relation client
Gestion du Big Data
SI MÉTIERS

15
5 OFFRES AU PLUS PRÈS DE VOTRE METIER
WEB
E-BUSINESS
COLLABORATIF
S.I. METIERS
INFRASTRUCTURE
Gestion de parc / Helpdesk
Supervision
Virtualisation / Cloud privé
Gestion d’identité
Messagerie
INFRASTRUCTUR

16
VOS INTERLOCUTEURS
VINCENT MAUCORPS
Business Line Web Manager
@vmaucorps
Email : vincent.maucorps@smile.fr
DAVID TRIPONT
Expert Drupal
@davidtripont
Email : david.tripont@smile.fr

17
SOMMAIRE
PREMIÈRE PARTIE
DRUPAL 8: LES NOUVEAUTÉS
DEUXIEME PARTIE
DRUPAL 8: POURQUOI? QUAND? COMMENT?
TROISIÈME PARTIE
LE GUIDE DRUPAL 8
1
2
3

18
DRUPAL 8:
LES NOUVEAUTÉS

19
Drupal 8 en chiffres
Un long chemin
Un CMS plus simple à utiliser …
… et une architecture remise à neuf
Coup d’œil sous le capot
SOMMAIRE

20
+ 3 000 contributeurs au core drupal 8;
5 “core committers” (2 chez Acquia: Dries et Webchick)
+ 20 000 patch commités
15 versions alpha
16 versions beta
4 Release Candidates
Plus de 200 nouvelles fonctionnalités et améliorations
EN CHIFFRES

21
UN LONG CHEMIN
ReleaseAPI completionFeauture development
Development
opens
March
2011
Feature
freeze
December
2012
Feature
complete
February
2013
API
freeze
July
2013
Major API
locked down
October
2014
Drupal 8.0.0
Stable
November
2015
Drupal 8
RC
October
2015

22
Pour les contributeurs:
 L’initiative Spark
 Multilinguisme
 Views dans le core Drupal
 Des blocs sous stéroïdes
 Meilleur modèle de données
Pour les visiteurs:
 Une approche «mobile first»
 Une meilleure accessibilité
 Frontend Performance
 « Take a tour »
VUE D’ENSEMBLE

23
Spark: Une initiative Acquia créée par Dries afin d’améliorer
l’expérience utilisateur pour Drupal 8 (“backportée” sur Drupal 7)
 Contribuer:
o «Wysiwyg»
o «In place editing»
o Status «Brouillon»
 Design:
o Nouvel interface de création de contenu
o «Lifting» du thème admin
L’INITIATIVE SPARK
http://buytaert.net/announcing-spark-authoring-improvements-for-drupal-7-and-drupal-8

24
WYSIWYG
 inclus dans le core Drupal

25
In Place Editing
 Modifiez votre contenu directement
depuis le frontend
 Nous allons plus loin avec notre
module Edit UI
https://www.drupal.org/project/edit_ui

26
Nouvelle interface
de contribution

27
Prévisualisation :
 Visualiser vos contenus tels
qu’ils seront réellement
affichés sur le frontend (en
fonction des «view mode»)

28
Thème d’administration épuré

29
MULTILINGUISME
Une version pensée multilingue
 Blocs
 Menus
 Entités
 …
Seulement 4 modules !
Choix de la langue
par défaut
Translitération
Meilleure indexation

30
Listes d’administrations
personnalisables
Responsive
Galerie d’images
Slideshow
Réponse JSON
…
VIEWS DANS LE CORE DRUPAL (MODULE LE PLUS UTILISÉ

31
Nouveaux blocs « core »
 Breadcrumbs
 Nom du site
 Slogan
 …
Multi régions
(RIP multiBlock module)
 Menu partagé par les header / footer
Créez vos types de blocs
personnalisés
 À la manière d’un content type
 Vos bannières de pub simplifiées!
DES BLOCS SOUS STÉROÏDES

32
Des nouveaux types de champs
pour vos entités
 Les indispensables: date, entity
reference, …
 Éléments HTML5: téléphone, email,
lien, …
View mode & Form mode
 Affichez vos formulaire différemment
selon l’utilisation
Commentaires
 Option: «ouvert/fermé» devient un
champ!
o Toutes vos entités sont
« commentables »!
UN MODÈLE DE DONNÉES AMÉLIORÉ

33
Une application adaptée à tous
les écrans:
 Responsive design
 Mobile friendly toolbar
 Performance “Front end”
«MOBILE FIRST»

34
Tous les thèmes du core sont responsives
Support pour les images responsives inclus
«MOBILE FIRST»

35
Mobile Friendly Toolbar
«MOBILE FIRST»

36
Une aide simple pour vos nouveaux contributeurs
TAKE A TOUR

37
ET SOUS LE CAPOT ?

38
Pour les développeurs
« frontend »
 HTML5
 Nouvelles librairies JS
 Twig
 Schema.org
 Navigateur “Moderne”
Pour les développeurs
« backend »
 « Proudly Found Elsewhere »
 Configurations des environnements
 Entités
 Moteur Restful
 Cache
POUR LES DÉVELOPPEURS

39
Navigation
 <nav>, <header>, <main> et <section>
Formulaires
 champs date, téléphone et email
Effets HTML5/CSS
HTML5

40
Normalize.css
jQuery touch punch
DomReady
html5shiv et classList
NOUVEAUX OUTILS FRONTEND

41
$node->foo ou $node['foo'] ?
print $foo ou print render($foo) ?
►Aucune connaissance php
nécessaire
TWIG

42
SCHEMA.ORG

43
POUR DES NAVIGATEURS MODERNES

44
Architecture plus moderne
 POO
 Namespace
 Events
 …
À jour avec les derniers standards
 PSR-4
Librairie “best of breed”
 Sf2
 GuzzleHTTP
 Assetic
 …
“PROUDLY FOUND ELSEWHERE”

45
Une API repensée
 Oublions les limites dans Drupal 7 core
Déclarer vos entités en étendant EntityInterface
 RIP hook_entity
Multilinguisme natif
 $node->body[$langcode][0]['value'] => $node->get('body')->value
Des entités partout
 Blocs, Types de contenu, Utilisateurs, Vues, Taxonomie, …
DES ENTITÉS PARTOUT

46
Content Entities
 Champs custom
 Enregistrées en base de données
 Créées depuis le front office
Exemples
 ŽNodes
 ŽCustom Blocks
 ŽUsers
 ŽComments
 Taxonomy Terms
 Menu Links
 Aggregator Feeds/Items
Config Entities
 Déployées sur vos environnements
 Enregistrées dans la configuration
 Créées depuis le back office
Exemples
 Content Types
 Custom Block Types
 User Roles
 Views
 Taxonomy Vocabularies
 Menus
 Image Styles
2 TYPES D’ENTITÉS

47
Module entity_cache inclus
dans le core Drupal
Cache tags
 Vider les bons caches
Agrégation des CSS et JS par défaut
La communauté Drupal travail en ce moment à l’amélioration
générale des performances
CACHE

48
CONFIGURATIONS DES ENVIRONNEMENTS
DEV PRODTEST
S

49

50

51
Ne sera pas dans Drupal 8.0.0
 dans Drupal 8.x.0 ?
UUID dans le core Drupal
Modules deploy / RestWS
PARTAGER DU CONTENU DRUPAL À DRUPAL

52
Modules RESTful Web Services
(RestWS)
 API REST entièrement configurable
Intégration avec views !
 Vos listes disponibles via une API
REST sans coder!
GuzzleHTTP
 Un client HTTP simple et performant
(RIP drupal_http_request)
UN MOTEUR RESTFUL

53
Extranet
La mise en œuvre d’une
Webfactory est facilitée par:
 La nouvelle gestion des configurations
 Le moteur RESTful
Notre expérience sur
les Webfactories Drupal
 Total Web Factory
 Biomérieux
 Le module Webfactory pour Drupal 8
https://www.drupal.org/project/webfactory
WEBFACTORY & INDUSTRIALISATION DES DÉVELOPPEMEN
Blog
Blog
Blog
e-Commerce
Réseau
Social
Intranet
Wiki
Extranet
Blog

EXEMPLE DE
CHANGEMENT D’API

55
EXEMPLE DE CHANGEMENT D’API

56

57

58
https://www.drupal.org/project/console
 drupal drush : Exécute une commande drush
 drupal cache:rebuild : Vide et reconstruit le cache
 drupal generate:module : Génère un squelette de module
 drupal router:debug : Affiche toutes les routes de l'application
 drupal router:rebuild : Reconstruit toutes les routes de l’application
LA CONSOLE SYMFONY EN BONUS

59
DRUPAL 8:
POURQUOI?
QUAND?
COMMENT?

60
Les clés du succès de votre stratégie web
Rentabiliser son
investissement
POURQUOI?
Votre Site Web
Fidéliser
en proposant
une expérience
utilisateur
de qualité
Attirer des visiteurs

61
 SEO (Search Engine Optimisation)
o Schema.org pris en charge par RDFa
 Présence sur les réseaux sociaux
o Les nouveautés, en termes de web
services, vont permettre
l’automatisation de votre présence
sur les réseaux sociaux
 “Mobile first” design
o La prise en charge des terminaux
mobiles est obligatoire pour être bien
classé par les dernières version du
moteur d’indexation Google
POURQUOI?

62
Fidéliser
 Front-end
o HTML5
o Mobile / Responsive Design
o Accessibilité
 Multilinguisme
o Prise en charge cohérente au sein du
noyau
POURQUOI?
Votre Site Web
Fidéliser
en proposant
une expérience
utilisateur
de qualité

63
Rentabiliser son investissement
 Compétences plus génériques, plus
faciles à recruter
o PHPUnit
o Composants Symfony2
o Twig
 Maintenance facilité
o Pérennité du système de thème
o Meilleur gestion des configurations
qui facilite l’industrialisation des
déploiements
 Conduite du changement simplifiée
o Visite guidé
o Back-office encore plus
personnalisable
POURQUOI?
Rentabiliser son investissement

64
Migration depuis Drupal 7
Lancement d'un nouveau projet
QUAND?

65
 Planifier sans précipitation
 Choisir les bons modules
 Attendre Drupal 9?
VERSION STABLERELEASE CANDIDATEBETA
QUAND?

66
Drupal
9
Support
QUAND?

67
Drupal
9
Support
QUAND?
MigrationMigration

68
 L'enjeu du support
 Migration 6 ou 7: même combat
QUAND?

69
Support AcquiaSupport par la communauté
QUAND?

70
Support AcquiaSupport par la communauté
QUAND?
Migration

71
 Procéder par étape
 Que faire maintenant...
 ...et un peu plus tard
QUAND?

72
QUAND?
Modules du noyau
Modules
Complémentaires

73
QUAND?
Modules du noyau
Modules
Complémentaires
Plus riche que Drupal 7

74
Préparer la montée en compétence
COMMENT?

75
Développer un module
 Utilisation de concepts Symfony2
 Programmation orientée objet
Montée en compétence
 Utilisation de YML
 Révolution au niveau des API Drupal
 Expertise Symfony2 en support
COMMENT?
Database
Navigateur
Logique PHP
(accès aux
données)
Moteur de
Template

76
Créer un thème
 Drupal 8 s’appuie sur le moteur de template Twig
o Standardisation
o Maintenance
o Souplesse (surcharge)
 La connaissance du PHP
n’est plus un pré-requis (mais utile)
 Expertise Twig
 Maîtrise du système de surcharge
COMMENT?
Database
Navigateur
Logique PHP
(accès aux
données)
Moteur de
Template
(rendu HTML)

77
Oser les SPA
(Single Page Application) !
 Les nouveautés en termes de
Webservices ouvre la voie au
« Headless Drupal »
 Utilisation de requêtes Ajax
 Angular JS ou autres frameworks
FrontEnd
 Développement SOA (Mockup de
Webservices, bouchons…)
COMMENT?
Database
Navigateur
Logique PHP
(accès aux
données)
Framework
JavaScript
(rendu HTML)

78
MIGRER VERS
DRUPAL 8

Une migration vers une version majeure est
bien souvent un projet à part entière. La
charge de travail est étroitement liée à la
complexité du site.

DRUPAL 8: MIGRER VERS DRUPAL 8?
 Choisissez les bons modules
 References Entityreference
 Phone Telephone
 Link URL
 Services RESTful Web Services
 Utiliser l’éditeur de texte riche CKEditor
 Attention quelques modules natifs vont disparaitre
 Blog, Dashboard, OpenID, Poll
Ces modules deviennent des extensions communautaires
 Profile, Trigger
Ces modules disparaissent au profit d’alternatives
DEUX CAS DE FIGURE
LANCER UN PROJET SOUS DRUPAL 7
Anticipez Drupal 8 dès la phase de conception
 Mes extensions communautaires sont elles
disponibles pour Drupal 8?
 Le module Upgrade Status vous donne un état des
modules portés pour Drupal 8
 Quid des développements spécifiques?
 L’extension Drupal Module Upgrader vous donne les
bons indicateurs
SITE DÉJÀ EXISTANT SOUS DRUPAL 6/7
Avoir un aperçu de la tâche à accomplir

Upgrade status
Pour chaque module quatre
états possibles:
• Non disponible
• Version de développement
disponible
• Version stable disponible
• Intégré au core
FAIRE UN ETAT DES LIEUX
https://www.drupal.org/project/upgrade_status

Drupal Module
Upgrader
Analyse un module et génère
un rapport:
• Liste les API qui ont changé
ou qui ne sont plus
supportées
• Liens vers la documentation
FAIRE UN ETAT DES LIEUX
https://www.drupal.org/project/drupalmoduleupgrader
Exemple de rapport sur le module Socialize :

Migrate
Brique intégrée au core
Drupal:
• Migration des contenus et de
leur type
• Migration des utilisateurs et
de leurs rôles
• Migration des blocks
• Migration de la configuration
REPRISE DES CONTRIBUTIONS
Drupal 6 Drupal 7
Type de
contenu
Rôles Configuration
Contenus Utilisateurs
Migrate

84
LE GUIDE
DRUPAL 8

DÉMARRER UN SITE SOUS DRUPAL 8?
NOUS AVONS ESSAYÉ!

86
Recueil de besoins
 Publication d’actualités (blog)
o Possibilité de partager un contenu
o Ouvert aux commentaire des internautes
 Référencer des publications (référencer des contenus externes)
 Apprécier et commenter les extensions communautaires
o Noter des modules et permettre aux visiteurs de les noter
 Proposer un formulaire de contact
 Adapter l’ergonomie du site à toute résolution
LE GUIDE DRUPAL 8
UN SITE RÉFÉRENCE AUTOUR DE DRUPAL

LE GUIDE DRUPAL 8
 Créer des contenus riches
 Un éditeur de texte riche intégré
 Des types de champs étendus : Entity Reference, Link
 Créer des listes de contenus
 Le module Views est intégré
 Système de commentaire
 Natif
 Création de types de commentaire (commentaire
classique mais aussi commentaire pour évaluer un
module)
 Formulaire de contact
 Natif
QUELS MÉCANISMES UTILISER?
NATIF DRUPAL 8
 Fonctionnalités de partage
 Widget de notation
 Création de pages complexes
 Page d’accueil
NON COUVERT

LE GUIDE DRUPAL 8
Une actualité
Définition de plusieurs
champs:
• Déjà natifs en Drupal 7
Editeur de texte riche natif
• Mise en page et insertion
des images facilitées
LES CONTENUS RICHES

LE GUIDE DRUPAL 8
Les actualités
Le module Views permet:
• De créer des listes triées et
paginées
• Les vues constituent le
contenu d’une page ou d’un
block
CRÉATION DE LISTE DE CONTENUS
Blocks Page

LE GUIDE DRUPAL 8
Les types de
commentaire
• Commentaire simple sur une
actualité
• Commentaire avec
possibilité de voter sur un
module
DIFFÉRENTS TYPES DE COMMENTAIRES

91
Les développements spécifiques
concernent:
 La création du thème
o Intégration des styles
o Diaporama
o Adaptation de l’ergonomie pour toute
résolution (Responsive Design)
 Les quelques extensions communautaires
encore absentes
o Fonctionnalité de partage
o Google analytics
o Le calcul de la moyenne des votes
LE GUIDE DRUPAL 8
LES DÉVELOPPEMENTS SPÉCIFIQUES
Thème
Module
spécifique

92
Encore quelques bugs détectés dans le core
 La plupart peuvent être contournés
La mise à jour d’une version beta à une autre est encore
délicate
 Peut occasionner quelques régressions
Absence des modules communautaires souvent indispensables
 Génération automatique d’alias
o Pathauto
 Mediathèque
o En cours avec l’initiative Media Entity
LE GUIDE DRUPAL 8
POINTS D’ATTENTION

94
LE GUIDE DRUPAL 8
QUE FAIRE AUJOURD’HUI?
Je me lance en Drupal 8 si…
 Je lance un nouveau projet à périmètre restreint
o 90% des besoins sont couverts nativement par Drupal 8
 Je lance un nouveau projet d’envergure mais je peux allotir
o Construire les premiers briques du projet via les fonctionnalités natives
o Finaliser les prochains lots une fois les extensions communautaires disponibles
Je me lance en Drupal 7 si…
 Mon projet est complexe et nécessite des fonctionnalités étendues (Workflow
complexe, Réseau social d’entreprise, …)
o Une forte contrainte de délai

Seminaire Drupal 8 à Nantes

Recommended

Recommended

More Related Content

What's hot

What's hot (20)

Viewers also liked

Viewers also liked (16)

Similar to Seminaire Drupal 8 à Nantes

Similar to Seminaire Drupal 8 à Nantes (20)

More from Smile I.T is open

More from Smile I.T is open (8)

Seminaire Drupal 8 à Nantes

Editor's Notes