Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

How to Successfully Implement Headless Drupal

2,755 views

Published on

Decoupled or “Headless” Drupal is one of the hottest topics in the industry right now, but can it work? Tune in to EPAM’s webinar to learn how their Drupal team was able to integrate a decoupled Drupal backend with HTML 5/AngularJS to create a website and, using Phonegap, a one-of-a-kind hybrid app for both Android and iOS.

Team members Seth Gregory (Acquia MVP), Kris Graham, David Vespoli, and John Sutton will walk through a recent case study to highlight how headless Drupal can cut the tether on themes, integrate with custom frontend experiences, and handle a massive amount of content along the way.

From this webinar, attendees will learn:

- An effective strategy for implementing headless Drupal
- How to integrate headless Drupal with an HTML 5/AngularJS frontend to create native Android and iOS apps
- Lessons learned through a successful case study with US Conference of Catholic Bishops

Published in: Technology
  • ★★ How Long Does She Want You to Last? ★★ A recent study proved that the average man lasts just 2-5 minutes in bed (during intercourse). The study also showed that many women need at least 7-10 minutes of intercourse to reach "The Big O" - and, worse still... 30% of women never get there during intercourse. Clearly, most men are NOT fulfilling there women's needs in bed. Now, as I've said many times - how long you can last is no guarantee of being a GREAT LOVER. But, not being able to last 20, 30 minutes or more, is definitely a sign that you're not going to "set your woman's world on fire" between the sheets. Question is: "What can you do to last longer?" Well, one of the best recommendations I can give you today is to read THIS report. In it, you'll discover a detailed guide to an Ancient Taoist Thrusting Technique that can help any man to last much longer in bed. I can vouch 100% for the technique because my husband has been using it for years :) Here's the link to the report ◆◆◆ https://tinyurl.com/rockhardxxx
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here

How to Successfully Implement Headless Drupal

  1. 1. 1 HOW TO SUCCESSFULLY IMPLEMENT HEADLESS DRUPAL (How WE implemented decoupled Drupal, successfully) OCTOBER  20,  2015  
  2. 2. 2 Brief Agenda Who we are & project overview1 Architectural design decisions2 Application components3 Outcome4 Q&A5
  3. 3. 3 ABOUT  EPAM  
  4. 4. 4 NavigationArts is now EPAM
  5. 5. 5 EPAM: A Pioneer in Product Development PRODUCT DEVELOPMENT EXPERTISE 100+  clients  amongst  independent  so>ware  vendors   5  out  of  Top  10  largest  so>ware  companies  are  clients   Serving  industry  leaders  as  well  as  emerging  technology   companies   DOMAIN-LED ENTERPRISE SOLUTIONS 2006   Q1  2015   ISVs  &  Technology   75%   22%   Banking  &  Financial  Services   0%   28%   Travel  &  Consumer   4%   24%   Business  InformaPon  &  Media   8%   13%   Life  Sciences  &  Healthcare   0%   7%   ORGANIC COMPETENCIES Core  Product  Engineering   User  Experience   Digital  Strategy   AnalyPcs  &  Big  Data   Commerce   Mobile   Social   PRODUCT ENGINEERING PRODUCT DEVELOPMENT SERVICESTECHNOLOGY SOLUTIONS 1990s 2000s TODAY EPAM FOUNDED IN 1993 1990s 2000s TODAY A  foundaPon  in  product  engineering  led  to  accelerated  growth  in   technology  soluPons  and  created  a  strong  plaWorm  for  a  new  type  of   services  offering  in  Product  Development  that  addresses  many  of  the   disrupPons  facing  industries  today.  
  6. 6. 6 What is headless or decoupled Drupal? •  Content  and  display  are  separated  (“decoupled”)   •  Front-­‐end  /  consumer  grabs  resources  through  defined  interface   •  Typically  RESTful   •  Typically  JSON  
  7. 7. 7 Why would you ever do this? •  More  flexibility  in  the  front-­‐end   •  More  flexibility  in  using  front-­‐end  resources   •  Mobile  apps   •  Lean  development  workflow  (lowercase  lean)   •  Prevent  front-­‐end  code  kludge  (can’t  write  db   queries)   •  MulPple  content  consumers  (mulPchannel)   •  Non-­‐website  consumers   •  Publish  “part”  of  a  site   •  MulPple  /  separate  architectures  or  infrastructures  
  8. 8. 8 WHY  (AND  HOW)  WE  DID  IT  (SUCCESSFULLY)  
  9. 9. 9 USCCB App iOS and Android mobile apps1 Website2 16,000+ microsites3 Salesforce data sync and single sign-on for microsite management4 Hard deadline in 6 mo. (the Pope is coming - literally.)5
  10. 10. 10 WE  CAN  DO  ALL  THE  THINGS  
  11. 11. 11 What we decided We want it to feel as “application-y” as possible1 Start with a website2 Cordova-based wrapper for native apps3 We’ll use AngularJS4 We’ll use decoupled Drupal5
  12. 12. 12 Proposed architecture Mobile app (Ionic w/ AngularJS)1 Website (AngularJS)2 Content entry (Drupal 7)3 API (Drupal 7)4
  13. 13. 13 OK, Sign us up for “Headless Drupal” •  No  “best  pracPce”  (yet)   •  Various  degrees  of  success  and   degree  of  “decoupling”  in  the   community   •  A  variety  of  contrib  modules   (Services,  Views  JSON,  RESTWS)  are   used  
  14. 14. 14 Attempt #1: Services •  Most  widely  used   •  Most  experience   •  Tied  to  Drupal  structures   •  Limited  ability  to  customize  resources  (without   greater  effort)   •  Hard  to  re-­‐use  front-­‐end  code   •  Too  much  overhead   CONS PROS
  15. 15. 15 Attempt #2: Views Datasource •  Can  completely  customize  resources   •  Easy  to  create  with  Views  UI     •  Lack  of  control  over  response  structure   •  “Stuck”  with  views   •  Limited  developer  workflow   •  Hard  to  re-­‐use  front-­‐end  code  (varying  structures)   •  Too  much  overhead   CONS PROS
  16. 16. 16 Re-evaluate •  RESTWS   –  Similar  problems  to  Services   •  Custom  soluPon   –  The  Pope  is  coming   •  There  is  another…   –  RESTful!  
  17. 17. 17 RESTful module •  Doesn’t  assume  data  structures   •  Expressive   •  Lots  of  built-­‐in  features  that  are  great  for  an  API,  such  as   –  Versioning   –  Bundle  based  resources   –  Resource  discovery   –  User  authenPcaPon   –  Caching   •  Easy  to  implement  and  extend  
  18. 18. 18 RESTful module •  Each  resource  is  a  ctools  plugin   •  It’s  easy  to  create  a  new  data  provider  or  formaler   •  Very  quick  to  extend  
  19. 19. 19 NOW  WHAT?  
  20. 20. 20 “How do I know what resource to grab when a user visits a URL on the app?” •  Landing  and  lisPng  pages  (aggregate   pages)  handled  by  AngularJS   •  Individual  pages  use  Drupal  aliases  
  21. 21. 21 Search? •  Standard  Search  API  Solr   •  Used  RESTful  Search  API  module  as  a   base   •  Built  out  facets  using  facet  realms  for   configuraPon  
  22. 22. 22 Translation •  EnPty  translaPon   •  Language  toggle  on  front-­‐end   •  Some  items  (Main  menu  /  nav)  are  translated  in  the  app  itself   •  API  Language  selecPon  is  by  URL  path  prefix  (just  like  Drupal  pages)   •  Some  nested  items  we  decided  to  provide  all  languages  for  (for  “look   ahead”)    
  23. 23. 23 Caching •  Using  Varnish  to  cache  the  API   •  RESTful  has  its  own  caching  (can  turn  on  or  off  in  the  plugin)  
  24. 24. 24 •  Main  site  menus  handled  by  Angular   •  Custom  sub-­‐menus  handled  by  API   •  Custom  Drupal  interface  for  custom   menus   Menus
  25. 25. 25 •  Easy  to  leverage  panels  +  views   for  a  custom  administraPon   area   Admin section
  26. 26. 26 •  The  Pope  didn’t  excommunicate  us   •  We  got  a  lot  of  traffic  -­‐  and  it   didn’t  crash   •  NaPonal  and  local  media  alenPon   Results
  27. 27. 27 •  TesPng  and  rolling  out  Parish  and  Diocese  Salesforce  integraPon   •  Our  API  only  serves  anonymous  traffic  (for  now)   •  We  built  a  fair  amount  into  the  front-­‐end  app   •  There’s  no  “preview”   •  We  made  compromises  to  simplify  things  wherever  possible   •  Prerender   •  Offline  content   What’s next / lessons learned
  28. 28. 28 •  D8  REST  is  a  good  step  -­‐  let’s  make  it  aesthePc  so  front-­‐end   devs  who  don’t  know  a  lick  of  Drupal  WANT  to  use  it!   •  Become  a  desired  backend  for  powering  fancy  new   frontend  frameworks  (drives  pace  of  innovaPon)   •  Hybrid  websites  -­‐  both  twig  and  API-­‐driven  elements   (“progressively”  decoupled  as  Dries  called  it)   •  Now  is  a  great  Pme  to  try  this  technology  and  help  steer  its   future.  Using  Drupal  8  +  RESTful  module  is  a  great  place  to   start   The potential for Decoupled Drupal
  29. 29. 29 Q&A David Vespoli Software Engineering Manager david_vespoli@epam.com Kris Graham Lead Software Engineer kris_graham@epam.com   QUESTIONS? Seth Gregory Software Engineering Manager seth_gregory@epam.com
  30. 30. 30 THANK  YOU!  

×