drupal 8 - découplez votre site grâce à une api afin de mettre à disposition votre contenu
TRANSCRIPT
CRÉERUNEFOIS,PUBLIERPARTOUTGRÂCEAUDÉCOUPLAGED’APPLICATIONSETÀ LAMISEENPLACED’API
JulienDubreuilConsultantDrupalspécialisédanslesproblématiquesBack-end,industrialisationetqualité
SOMMAIRE1. Retour sur 2014 et l’avenir du web à
cette époque
2. Ce que cela signifie de découpler son site
3. Comment mettre en place une telle stratégie avec Drupal
4. Faire du content-as-a-service
5. Quels projets pour une telle architecture
JulienDubreuilContributeurDrupaldepuis2009
Co-organisateurdugroupeutilisateursDrupalàParisdepuis2011
@juliendubreuilJuliendubreuil.fr
ConsultantDrupalspécialisédanslesproblématiquesBack-end,industrialisationetqualité
2ansentantqu’indépendant3anschezCommerceGuys3ansauFigaro
2014, CE QUE L’AVENIR NOUS RÉSERVAIT
1.
ApplicationsmonolithiquesVS
Applicationmicro-services
DrupaletWPpeuvent alors êtreconsidéréscommedessolutions
monolithiques
• Themingcompliqué
• Courbed’apprentissagetropgrande
• Manquederessourcesdisponibles
• FrustrationdesDevFront
DesWebhooks quipermettentàl’applicationconsommantl’APIderéagirencasdemodification
UneAPIRESTquiretournebiensouventduJSON
DescontenusaccessiblesviauneAPIREST
UnCMSdansleclouddustockagedescontenus
Uneinterfacewebpourl’éditiondecontenus Content-as-
a-Service(CaaS)
Latendance dessolutionsCaaS
Pourleséquipestechniques
Pourlesdéveloppeurs
Pourlesentreprises
SéparerlesproblématiquesBack-endetFront-end
Permetauxéquipesdetravaillerenparallèle.
Pasdepertedetempsàmonterencompétence
Utilisationdesdernièrestechnosettechniques
Mutualiseretréutiliserleurscontenus
Publierinstantanémentsurplusieursplateformesenmêmetemps
• Pasdefront-end,cen’estqu’unendroit
pourstockerducontenu
• Limitéentermed’outilsd’édition
• Trèspeuadaptableauxbesoins,voirenon
modifiable
• Délaissetouteslesproblématiquesde
présentationauxdéveloppeursfront-end
Pourlemeilleuretpourlepire
TECHNIQUEMENT, DÉCOUPLER SON SITE CA VEUT DIRE QUOI ?
2.
• UnCMSutilisécommegestionnairedecontenus• DescontenussontaccessiblesviauneAPIREST• UneAPIRESTretournebiensouventduJSON• Uneinterfacewebpourl’éditiondecontenu
Back-end• UneinterfacegraphiquedéveloppéedeA-Z• BâtiavecdestechnologiesJavascript
modernes• Uneconsommationdecontenusviades
webservices,• UnetransformationdeJSONenHTML
Front-end
Serveur Client
Requête
Réponse
Couplé,Découplé&Co
« Couplé »ou« Classic »,estl’utilisationnormaledel’outil.Drupalest chargédegénérér duHTMLqu’ilrenverra auclient
L’autreoptionestlemodedécouplé,ouDrupaln’estchargéquedemettreàdisposition desdonnéesetl’équipe front-end delesconsommeretafficher.
Ilexisteunealternative,unmixteentrelesdeuxappellée « Progressively Decouple ».Danscecas,Drupalestutilisécommeoutildegénérationdecontenupour l’équipe front-end toutenétantcapabledefournirdeladonnée viauneAPIpourdesélémentsdepages.
Avantages duHeadless• Flexibilitéetcontrôletotalpourlesdevs Fronts(pluslimitéparDrupalet
Twig)
• Lefrontdevientplusfacilementinterchangeable.
• Pasbesoindemigrerdescontenuspourchangerlefront.
• Permetdefairetravaillerl’équipeBack-endenparallèledel’équipeFront-
end
• MoinsdedépendanceenverslesspécialistesDrupal
• Unendroituniquedecontributiondecontenus
InconvénientsduHeadless• Lesfonctionnalités«out-of-the-box »deviennent(contentpreview,action
links,inplace-enditing)
• Ilfaudraréinventerlaroue(password reset)
• D’unsitewebonpassealorsàunécosystème(coûtdemaintenance,coût
dehosting,coûtd’évolution)
• Uneapplicationcomposéedeplusieurscouchesaugmenteaussila
complexitédecelle-ci(debug pluscompliqué.fortbesoindeloguerles
échanges)
InconvénientsduHeadless• Uneséparationstricteentrelesdonnéesetl’affichagedoitêtrefaiteet
perdurer(unemodificationdestructuredansleBack-endpeutavoirdes
conséquencessurl’unedesapplicationsfront)
• Potentiellementbesoind’uneéquipetechniqueplusimportantequedans
uneapprocheclassique.
• ByebyeauxfonctionnalitésdeSEOnative
EN PRATIQUE, DÉCOUPLER DRUPAL, ÇA DONNE QUOI ?
3.
Drupal7
• Services https://www.drupal.org/project/Services
• ViewsDatasource https://www.drupal.org/project/views_datasource
• RESTWS https://www.drupal.org/project/restws
• RESTful https://www.drupal.org/project/RESTful
• Codecustom
Drupal8IntègredésormaisplusieursmodulespermettantdemettreenœuvreuneAPI
REST
• RESTmodule
• Serializer
• HAL
• BasicAuthentification
RESTUILacommunauté a crée unmoduleRESTUIpermettant deréaliser lesmêmes
actionsqu’undéveloppeurdevraitécriredirectementdepuisuneUI
vouspermettantalorsdechoisirlesméthodesdisponibles(GET,POST,
PATCH,DELETE),lesformats(json,xml)renvoyés,etlesméthodes
d'authentification(cookieouhttpsilemoduleestactivé)supportées
ViewsPermetdemettreàdispositiondesressourcesetcollectionsderessources
Avantages
• Simpleàutiliser
• Faciledecréerunnouveauendpoint
Inconvénients
• Peut-êtreseretrouverlimité
• Pasdesplusperformantpourdesrequêtescomplexes
RESTaveclesmodulescore
• WebservicesRESTful traditionnel, centrésurles
ressourcesetdescollections.
• Permetplusieursformats:JSON,HAL+JSON
• Peutexposerautrechosequedesentités
• Peutêtreétenduaumoyendeplugins
RelaxedwebservicesAméliore lesmodulescoredeD8
• Traduction
• Révisions
• Fichiers attachés
• Gère lesréferences UUID
Permet defaireoffline.InspireddeCouchDB,lemodule
permet decréer une approche "offline-first”enutilisant une
librairie telle-que PouchDBou Hood.ie.
Json API• Unmodulecontrib enaccordaveclestandard
http://jsonapi.org/
• Exposetouteslesressources(entitées) contenuesdans
Drupal.
• Permetdefiltre/trier/paginer/ descollections
• Injectelescheminsdesentitésliéeslorsdelaréponse
• PermetderéduirelenombrederequêtesHTTPduesà
laconnaissancedesrelations
• Contenuplus lisible
Json APIExtras• Permet d’activer ou dedésactiver certaines ressources
• Surchargelenomdesressources.Exemple:articleà laplacedenode--article.
• Surchargelechemin d’accès auxressources:/jsonapi/node/article devient
/api/articles
• Permet dedésactiver certains champs
• Permet d’améliorer lerendu deschamps,comme pour leschampsdate
Nesteddata
Donnéespluspropresetpluslisibles
GraphQL• ExposetouteslesentitésDrupalselon lestandard
graphql.orgstandard.(non-RESTful)
• Permetdefiltre/trier/paginer/ descollections
• Injectelescheminsdesentitésliéeslorsdelaréponse
• Réduitlenombrederequêteshttp
• Dèsl’activationdumodule touteslesdonnéessont
accessibles(contrôled’accèsréaliséparEntity AccessAPI)
http://example.com/jsonapi/node/article?sort=created&filter[status][value]=1
APINamespace
Bundle
Typed’entités Filtres
Reservoir
• UnedistributionsignéeAcquia
• Undépôtdecontenus,configurépour
fonctionneravecJSONAPIetOAuth2.
• Fonctionnelledèssoninstallation
• 4axes:Contenus,API,Modélisationdecontenu,
Contrôled’accès
ContentaCMS• UnedistributionorientéAPI-first
• Maintenuparunecommunautédecontributeur
• Starterkitpourmettreenplaceunearchitecture
découplé
• Ceveut,simpleetnenécessitantquepeutde
configurationetsansavoirbesoindeconnaîtreDrupal
• Disposed’exemplesElm,React,Ember,Ionic,Angular
METTRE EN PLACE UNE STRATEGIE CONTENT-AS-A-SERVICE
4.
Unestratégiedecontenusrobuste
&APIdequalité
Stratégiedecontenus(Phase1)• Analysezl’existant
• Pensezcontenusetcomposants
• Imaginezdifférentsrendus(page,bloc,list,teaser…)
• Déterminezlesoutilsd’édition(prévisualisation,systèmederévisions,
publicationàdate…)
• Utilisezdescontenusdédiéspourleslandingpages
• Réfléchissezauxtaxonomiesàmettreenplacepourstructurervotre
contenu
Stratégiedecontenus(Phase2)
• ConvertissezlesrésultatsdevotreauditauformatdedonnéesdeDrupal
• Pensezauresponsiveavanttout,surtoutpourlesimages
• Utilisezlesbonstypesdechamps
• Servezvousdeschamps« entity références »dèsquepossible
Une APIdequalitéUneAPIc’estuncontratdéterminéentreleBack-endetleFront-end
• Documentée
• Versionnée
• Testable
• Permettrelesréponsespartiellespour filtreroulimiterlesrésultats
• Résiliente
• Utiliserunestratégiedecacheintelligente.
• Loguer lesrequêtesentrantesetlesréponses
QUELLES OCCASIONS POUR DÉCOUPLER UNE APPLICATION ?
5.
- S’ilyaplusd’uneapplicationquiconsommeducontenu
- Sivousn’avezpasd’expertiseDrupaleninterne
- Sil’équipefrontabesoind’uncontrôletotaldelastructuredespages
- Sivotreprojetestcomposédeplusieurséquipes
POUR ALLERPLUS LOIN6.
liens&références
RESTful WebAPIsServicesforaChangingWorldO'ReillyMediaSeptembre2013
liens&références• Tag#decoupleddublogdeDriesBuytaertDriesBuytaerthttp://buytaert.net/tag/decoupled
• CommentmettreenplaceunsiteDrupal« Headless »SimonGeorgeshttps://makina-corpus.com/blog/metier/2017/comment-mettre-en-place-un-site-drupal-headless
• LeblogdeYineoYannBoisselierhttps://yineo.fr/
Liens&Références• DistributionReservoirhttps://github.com/acquia/reservoir
• Contentacms initiativehttp://contentacms.org
• ContentaMakes Your ContentHappyLullabothttps://lullabot.com/articles/contenta-makes-your-content-happy
• 7Ways toMake Your APIMoreSuccessful -DanielJacobsonhttp://www.danieljacobson.com/blog/231
Liens&Références• Howshould you decouple Drupal?http://buytaert.net/how-should-you-decouple-drupal
• Json API,moduleDrupalhttps://drupal.org/project/jsonapi
• JSONAPI,lestandardpourconstruiredesAPIsenJSONhttp://jsonapi.org
• REST2.0IsHere andIts NameIsGraphQLhttps://sitepoint.com/rest-2-0-graphql/
• GraphQL forDrupal (Brouillon)https://fgm.gitbooks.io/graphql-for-drupal
CONCLUSION
#tl;dr• Drupalpeutêtreutilisédefaçoncouplée(traditionnelle),découpléeouun
mixteentrelesdeux• Leheadless n’estpastoujoursunebonneoption• Lecore fournitunesolutionRESTetilestpossibledel’étendre• DesalternativesexistenttellesqueJSONAPIetGraphQL• Passerdutempsendébutdeprojetàanalyseretpréparerleterrainpour
lescontenus• DéveloppezuneAPIdequalitéetinvestissezdutempssurla
documentation
Credit• Images- https://www.pexels.com• Icones - https://thenounproject.com/
Questions ?
71
MERCI
72
t w i t t e r : @ dr upa gor a
Drupagora 2017 – Créer une fois,publier partoutgrâceaudécouplage d’applications età lamise enplaced’API - Julien DubreuilTwitter : #drupagora