Downloaded 21 times
Uploaded byPhase2
Memorial Sloan Kettering: Adventures in Drupal 8
The document outlines the efforts of a team at Memorial Sloan Kettering to enhance digital experiences through a comprehensive multi-year strategy centered on Drupal 8. Key contributors discuss innovative migration techniques and integration challenges involved in transitioning from Drupal 6 to 8, emphasizing the importance of a collaborative and component-based architecture. The initiative aims to create sustainable and engaging digital platforms for better engagement in cancer and healthcare.
More Related Content
Similar to Memorial Sloan Kettering: Adventures in Drupal 8
Memorial Sloan Kettering: Adventures in Drupal 8
- 2. Memorial Sloan Kettering •Evan Liebman - Director of MSK Digital • Jacob Rockowitz - Drupal/CMS consultant Phase2 • Molly Byrnes - Account Director • Jonathan Hedstrom - Software Architect • Brad Wade - Senior Front-End Developer DigitasLBi • Jill Baker - Principal Creative Engineer Meet the Team
- 3. ” “ Researchers at MSKregularly push boundaries to innovate… We are inspired by their relentless efforts and are driven to do the same in our space. Evan Liebman, MSK
- 5. Creating meaningful digital experiences •Opportunities for deeper engagement is increasingly important in cancer and healthcare overall • Delivering the desired digital experiences to MSK constituents will require an institution- wide holistic vision, strategy and roadmap The Adventure Begins
- 6. Digital Roadmap • Amulti-year investment plan and define strategies that bring MSK’s brand promise to life through digital experiences • A holistic digital strategy with unified assets The Adventure Begins
- 7.
- 12. Why Choose Drupal8? Innovation • Inspired by the innovative work done at MSK Sustainability • Saw a longer-term future with D8 than D7 Talent Recruitment • Symfony and Object-Oriented Programming means Drupal will be more accessible to developers The Adventure Begins
- 13. DON’T BE LATE FINDUS AT: 1pm Th ROOM: Petree C
- 14. ” “ Drupal 8 - Don’tbe Late Jacob Rockowitz, Developer
- 16. Moving from D6to D8 Prototype & Core Realities • Proof-of-concept Migration Magic • Pushing from D6 to D8 YAML Forms • There is no module for that Migration Adventures
- 17. Prototype & Core Prototypecontaining 30000 nodes • Bartik with Admin UI Chasing Head • Began with Alpha3 (September 2013) Symfony & OO • Build, Learn, and Throw-away Testing • SimpleTest with some Functional Testing Migration Adventures
- 18. Pushing from D6to D8 Import using BULK INSERT • This is super fast Write YAML config files • Also super fast Serialize nodes (D6) & import (D8) • Not so fast but still the fastest solution Migration Adventures
- 19. ” “That module is nowin Drupal Core
- 20.
- 21. YAML Forms Backend • FormAPI(FAPI) + CRUD API + Send Mail Frontend • Easy to understand • Easy to edit Migration • Built webform render array in D6 • Generated YAML for D8 Migration Adventures
- 22. YAML Form Example MigrationAdventures
- 24. Core & Community ●Chasing Head ○ Since Alpha 3 (September 2013)! ● Working the Issue Queues ● Working with the Community An Adventure in Beta
- 25. Contrib space ● Portingcontrib modules • Redirect, Global Redirect, Login Security, Node Order, Diff, Honeypot, Libraries API, Masquerade, Memcache (and Redis, later removed) ● Total of 9 contrib modules ● Do more with less code An Adventure in Beta
- 26. ” “ 57 patches havebeen directly contributed and committed and 100s of issues reviewed. Jonathan Hedstrom, Phase2
- 28. Agile Design &Front-End Build • Simultaneous cycles of: UX → Visual Design → Front-end Development • Iterative development on a standalone Yeoman-based front-end ‘prototype’ site • Living reference guides within the site build updated as the work progressed • Collaborative prototyping between all teams Integration Adventures
- 30. Build Process • CustomYeoman generator (Starterkit) • NPM & Bower for dependency management • Grunt for build tasks • Assemble.io for static site generation (Handlebars compilation & helpers) • Libsass for Sass compilation Integration Adventures
- 31. Third-Party Libraries &Tools • jQuery & jQuery UI • Bootstrap Sass • Owl Carousel (v2) • Video.js • Picturefill • jPushMenu • Sticky.js • Chosen • Enquire • Icomoon Integration Adventures
- 32. Browser Compatibility • IE conditionalcomments to serve different HTML element with distinct class • StripMQ for query-less legacy CSS • Modernizr for feature detection • BlessCSS for avoiding IE selector & rule limits • Autoprefixer Grunt task Integration Adventures
- 33. ” “ A component, forour purposes here, is a small package of front-end software that does one thing well. A component should include all the appropriate pieces it needs to do its job, no more and no less. Starterkit Readme
- 34. Component-based Architecture • multiplereusable (and nestable) layouts • each comprised of .hbs, .scss, .js, .json files • BEM nomenclature (.component__subitem--variant) • built to be independent but context-aware • recorded in the component library • data feed via parseJSON, JSON objects; often with conditional/overridable default content Integration Adventures
- 35. Getting Off theIsland Integrating Code into Drupal • Grunt automation to build prototype and copy assets into Drupal theme • Including assets and declaring dependencies in Drupal theme • Drupal compatibility layer for JS/CSS Integration Adventures
- 36. Getting Off theIsland Matching the Markup • Overriding Twig templates - Custom Handlebar to Drupal Twig templates • Sending Digitas sample markup • Filter and transform body markup Integration Adventures
- 37.
- 38.
- 39.
- 40.
- 41.
- 42.
- 43. Forms & more BOFAT: 2:15 ROOM: 504 - Just Digital
- 44.
- 45. STAY IN TOUCH EvanLiebman Liebmane@mskcc.org THANK YOU
- 47. Sub Header Talking Point •P1 • P2 • P3 Header
- 48.