making drupal collide with the world outside · view react, angular, jsx, flux/redux, vue.js, web...
TRANSCRIPT
![Page 1: Making Drupal collide with the world outside · View React, Angular, JSX, Flux/Redux, Vue.js, Web Components, Polymer, React Native Data storage and fetching NoSQL databases, Real-time](https://reader036.vdocuments.us/reader036/viewer/2022062919/5ee10e1bad6a402d666c1389/html5/thumbnails/1.jpg)
Making Drupal collide with the world outside
Varun AroraCEO, OpenCurriculum
![Page 2: Making Drupal collide with the world outside · View React, Angular, JSX, Flux/Redux, Vue.js, Web Components, Polymer, React Native Data storage and fetching NoSQL databases, Real-time](https://reader036.vdocuments.us/reader036/viewer/2022062919/5ee10e1bad6a402d666c1389/html5/thumbnails/2.jpg)
Agenda● What's going on outside Drupal?● Drupal vs. !Drupal● Drupal Everywhere
![Page 3: Making Drupal collide with the world outside · View React, Angular, JSX, Flux/Redux, Vue.js, Web Components, Polymer, React Native Data storage and fetching NoSQL databases, Real-time](https://reader036.vdocuments.us/reader036/viewer/2022062919/5ee10e1bad6a402d666c1389/html5/thumbnails/3.jpg)
What’s going on outside Drupal?
![Page 4: Making Drupal collide with the world outside · View React, Angular, JSX, Flux/Redux, Vue.js, Web Components, Polymer, React Native Data storage and fetching NoSQL databases, Real-time](https://reader036.vdocuments.us/reader036/viewer/2022062919/5ee10e1bad6a402d666c1389/html5/thumbnails/4.jpg)
View React, Angular, JSX, Flux/Redux, Vue.js, Web Components, Polymer, React Native
Data storage and fetching
NoSQL databases, Real-time databases, Web Sockets, GraphQL, Parse / Firebase, ORMs
Infrastructure Containers (Docker, etc.), Cloud services, S3, Functions-as-a-Service.
Content Static site generators, Wix / Weebly / Medium
Other mad hipster shit
Webpack, IoT, Web app frameworks (RoR, Django, Spring)
![Page 5: Making Drupal collide with the world outside · View React, Angular, JSX, Flux/Redux, Vue.js, Web Components, Polymer, React Native Data storage and fetching NoSQL databases, Real-time](https://reader036.vdocuments.us/reader036/viewer/2022062919/5ee10e1bad6a402d666c1389/html5/thumbnails/5.jpg)
FOMO?
![Page 6: Making Drupal collide with the world outside · View React, Angular, JSX, Flux/Redux, Vue.js, Web Components, Polymer, React Native Data storage and fetching NoSQL databases, Real-time](https://reader036.vdocuments.us/reader036/viewer/2022062919/5ee10e1bad6a402d666c1389/html5/thumbnails/6.jpg)
Drupal vs. !Drupal
![Page 7: Making Drupal collide with the world outside · View React, Angular, JSX, Flux/Redux, Vue.js, Web Components, Polymer, React Native Data storage and fetching NoSQL databases, Real-time](https://reader036.vdocuments.us/reader036/viewer/2022062919/5ee10e1bad6a402d666c1389/html5/thumbnails/7.jpg)
Categories● Administration● Development / Engineering● Solving real-world problems
![Page 8: Making Drupal collide with the world outside · View React, Angular, JSX, Flux/Redux, Vue.js, Web Components, Polymer, React Native Data storage and fetching NoSQL databases, Real-time](https://reader036.vdocuments.us/reader036/viewer/2022062919/5ee10e1bad6a402d666c1389/html5/thumbnails/8.jpg)
AdministrationAuthoring multi-page content EasyWYSIWYG EasyConstantly tweaking complex code for any feature NopeEditing any data is form editing Not how world rollsCommunity Dope
Authoring multi-page contentWYSIWYGConstantly tweaking complex code for any featureEditing any data is form editingCommunity
![Page 9: Making Drupal collide with the world outside · View React, Angular, JSX, Flux/Redux, Vue.js, Web Components, Polymer, React Native Data storage and fetching NoSQL databases, Real-time](https://reader036.vdocuments.us/reader036/viewer/2022062919/5ee10e1bad6a402d666c1389/html5/thumbnails/9.jpg)
Development / EngineeringUnderstanding of database model LowPHP EasyDrupal lifecycle hooks Batshit weirdAltering form submissions and page flow PainfulEverything is a node Not so geniusUser management, authentication, signup EasyLearning curve on new functionality with UI High
Understanding of database modelPHPDrupal lifecycle hooksAltering form submissions and page flowEverything is a nodeUser management, authentication, signupLearning curve on new functionality with UI
![Page 10: Making Drupal collide with the world outside · View React, Angular, JSX, Flux/Redux, Vue.js, Web Components, Polymer, React Native Data storage and fetching NoSQL databases, Real-time](https://reader036.vdocuments.us/reader036/viewer/2022062919/5ee10e1bad6a402d666c1389/html5/thumbnails/10.jpg)
Development / EngineeringAltering what shows up on page > layers than onionsLayouts and themes, for most part Low qualityCreating modules with complex data needs NightmareExtending tables vs. creating new ones DRYData manipulation, persisting PoorURL management Easy
Altering what shows up on pageLayouts and themes, for most partCreating modules with complex data needsExtending tables vs. creating new onesData manipulation, persistingURL management
![Page 11: Making Drupal collide with the world outside · View React, Angular, JSX, Flux/Redux, Vue.js, Web Components, Polymer, React Native Data storage and fetching NoSQL databases, Real-time](https://reader036.vdocuments.us/reader036/viewer/2022062919/5ee10e1bad6a402d666c1389/html5/thumbnails/11.jpg)
Solving real-world problemsViews, CCK (Fields, Entities, m2m) HeavenRepeated patterns func. (eg. comments, forums) EasyOriginality inducing Far fromClient-centric NotScientifically optimizing performance, SQL PainfulBlank canvas thinking AbsentOptimal repeating patterns (eg. search) Nope
Views, CCK (Fields, Entities, m2m)Repeated patterns func. (eg. comments, forums)Originality inducingClient-centricScientifically optimizing performance, SQLBlank canvas thinkingOptimal repeating patterns (eg. search)
![Page 12: Making Drupal collide with the world outside · View React, Angular, JSX, Flux/Redux, Vue.js, Web Components, Polymer, React Native Data storage and fetching NoSQL databases, Real-time](https://reader036.vdocuments.us/reader036/viewer/2022062919/5ee10e1bad6a402d666c1389/html5/thumbnails/12.jpg)
Drupal Everywhere
![Page 13: Making Drupal collide with the world outside · View React, Angular, JSX, Flux/Redux, Vue.js, Web Components, Polymer, React Native Data storage and fetching NoSQL databases, Real-time](https://reader036.vdocuments.us/reader036/viewer/2022062919/5ee10e1bad6a402d666c1389/html5/thumbnails/13.jpg)
What we have been trying to do for the past ~8 years
![Page 14: Making Drupal collide with the world outside · View React, Angular, JSX, Flux/Redux, Vue.js, Web Components, Polymer, React Native Data storage and fetching NoSQL databases, Real-time](https://reader036.vdocuments.us/reader036/viewer/2022062919/5ee10e1bad6a402d666c1389/html5/thumbnails/14.jpg)
Macro reasons to reflect on state of things● Hybrid clouds and containers have helped anyone deploy
heterogeneous backends● The line where marketing stops and product begins is blurrier
than ever; everything is content and everything is not● Competing for user attention through front-end heavy apps
![Page 15: Making Drupal collide with the world outside · View React, Angular, JSX, Flux/Redux, Vue.js, Web Components, Polymer, React Native Data storage and fetching NoSQL databases, Real-time](https://reader036.vdocuments.us/reader036/viewer/2022062919/5ee10e1bad6a402d666c1389/html5/thumbnails/15.jpg)
Macro reasons to reflect on state of things● “Web administrator” is a mythical role● Drupal has uniquely excellent capabilities that the rest of the
tech ecosystem does not have (eg. Views, CCK, easy i18n)
![Page 16: Making Drupal collide with the world outside · View React, Angular, JSX, Flux/Redux, Vue.js, Web Components, Polymer, React Native Data storage and fetching NoSQL databases, Real-time](https://reader036.vdocuments.us/reader036/viewer/2022062919/5ee10e1bad6a402d666c1389/html5/thumbnails/16.jpg)
Flipping the model
![Page 17: Making Drupal collide with the world outside · View React, Angular, JSX, Flux/Redux, Vue.js, Web Components, Polymer, React Native Data storage and fetching NoSQL databases, Real-time](https://reader036.vdocuments.us/reader036/viewer/2022062919/5ee10e1bad6a402d666c1389/html5/thumbnails/17.jpg)
3 ways to flip● Drupal as an admin tool for all.● Drupal as a content management protocol.● Drupal as a controller for all.
![Page 18: Making Drupal collide with the world outside · View React, Angular, JSX, Flux/Redux, Vue.js, Web Components, Polymer, React Native Data storage and fetching NoSQL databases, Real-time](https://reader036.vdocuments.us/reader036/viewer/2022062919/5ee10e1bad6a402d666c1389/html5/thumbnails/18.jpg)
Drupal as an admin tool for all
http://getlevelten.com/blog/kristin-brinner/how-set-drupal-commerce-message-send-emails-store-admin-and-customer-include
![Page 19: Making Drupal collide with the world outside · View React, Angular, JSX, Flux/Redux, Vue.js, Web Components, Polymer, React Native Data storage and fetching NoSQL databases, Real-time](https://reader036.vdocuments.us/reader036/viewer/2022062919/5ee10e1bad6a402d666c1389/html5/thumbnails/19.jpg)
Drupal as an admin tool for all
http://www.htmlgoodies.com/beyond/webmaster/toolbox/article.php/3908431/Drupal-Version-7-Beta-A-Web-Developers-First-Look.htm
![Page 20: Making Drupal collide with the world outside · View React, Angular, JSX, Flux/Redux, Vue.js, Web Components, Polymer, React Native Data storage and fetching NoSQL databases, Real-time](https://reader036.vdocuments.us/reader036/viewer/2022062919/5ee10e1bad6a402d666c1389/html5/thumbnails/20.jpg)
Drupal as an admin tool for all
https://www.interworks.com/sites/default/files/blog/u55/d8_edit-page.gif
![Page 21: Making Drupal collide with the world outside · View React, Angular, JSX, Flux/Redux, Vue.js, Web Components, Polymer, React Native Data storage and fetching NoSQL databases, Real-time](https://reader036.vdocuments.us/reader036/viewer/2022062919/5ee10e1bad6a402d666c1389/html5/thumbnails/21.jpg)
Drupal as a content management protocol● Entities● Fields● Blocks● Metadata, taxonomy, config● Views
![Page 22: Making Drupal collide with the world outside · View React, Angular, JSX, Flux/Redux, Vue.js, Web Components, Polymer, React Native Data storage and fetching NoSQL databases, Real-time](https://reader036.vdocuments.us/reader036/viewer/2022062919/5ee10e1bad6a402d666c1389/html5/thumbnails/22.jpg)
Drupal as a controller for all● Be the routing, templating (using blocks), auth / sessions,
requests / responses, config, ORM compatibility, rules (for async processing) layer bound to different frameworks.
● Allow boilerplate generation for forms, accessibility● Multilingualism support.
![Page 23: Making Drupal collide with the world outside · View React, Angular, JSX, Flux/Redux, Vue.js, Web Components, Polymer, React Native Data storage and fetching NoSQL databases, Real-time](https://reader036.vdocuments.us/reader036/viewer/2022062919/5ee10e1bad6a402d666c1389/html5/thumbnails/23.jpg)
Drupal as a controller for all● Talk to services, using a visual system like Node Red.
http://www.internetoflego.com/connecting-it-all-together-pubnub-and-node-red/