Decoupled Days 2019

Bring the power and safety of strongly-typed JavaScript to your Vue.js applications with TypeScript. We'll start with a crash course in TypeScript and the power of IDE integration, type annotations, and interfaces. We'll fire up a TypeScript-based Vue app using the Vue CLI and tinker with some of the community packages that make writing TypeScript in Vue so sublime.

Ten years ago, architecting content “systems” involved software solutioning and scaling the infrastructure to handle more traffic. DevOps meant “add Jenkins.” Enterprise-level development work generally required a week or two of architectural deliverables, even when third-party services were involved.

Today, the emerging content systems landscape requires a systems approach. As Head of Content Platform for The Economist, Dom and his team built a reactive microservices platform, between the original Drupal site and the new React front end. Then continued to evolve the multi-platform architecture as a whole, with a canonical content model at the center.

When it comes to building app-like websites, JavaScript frameworks have taken the web by storm. Where does this leave seasoned Drupal developers? Should we abandon our favored languages in favor of JS? Not necessarily; Drupal 8 is a stellar CMS which is more than capable of standing on its own. Because many of the JS frameworks focus on front-end development, and thanks to Drupal's API-first work, we can combine the best JS frameworks with our favorite frameworks. Empower yourself by learning the ins and outs of JS to enable yourself to dive into a JS framework.

The concept of decoupled Drupal has gone from a cutting-edge technology to a fairly common approach to build digital experiences.

If you are building a digital experience that includes a JS website you will need to have a node.js server for SSR purposes. In this talk we'll learn how to leverage that infrastructure to add a node.js proxy server between Drupal and all of your consumers. Most importantly we'll discuss how we can collaborate on this node.js starter kit that can be used in most of your decoupled projects.

Content! It’s everywhere! It’s displayed on websites and in apps. It’s streamed to smartphones, televisions, and watches. It’s heard on podcasts, read aloud by voice assistants, and explored in immersive, three-dimensional virtual realities. With so many platforms, how can you keep pace with the rapidly changing landscape of digital experiences and content distribution?

In this session, we'll discuss one of the first decoupled Drupal sites created by Mirum with Qualcomm. We will discuss learnings gained from different architectural approaches and business needs.

This will be a case study on the React Native app built for Northwell Health. Chris will discuss the patient and hospital side. Gregg will discuss the front-end React Native technical details. Heshan will discuss the Node-based application server that combines all the systems.

Decoupled Drupal is clearly here to stay, so what does this mean from a business point of view? As we consider all the implications of this change — a new programming language, new license, and the technical considerations of how we visualize and build websites — it’s important to identify how and when adaptations need to be made to our businesses to support all these changes.

In this session a currently provisional member of the Drupal Security Team gives a broad overview about how security bugs are present and could be prevented on Drupal projects with a special focus on API-like applications to raise awareness for decoupled approach from security perspectives.

Decoupled CMS is an enabler of not just content, but in new ways which it can be delivered and on more than one form factor. Think IoT, wearables, mobile, augmented reality, virtual reality and voice. In this session you will see how a CMS can support a 'smarter things' strategy in your company together with examples of this platform in action.

This session will explain how to use Twig with Storybook and Drupal to bring all the advantages of UI component libraries into a decoupled Drupal project.

While hosting a Drupal website can be a challenge, it is largely a solved problem with several PaaS providers providing optimized Drupal hosting. Even if we didn’t want to use that, there is extensive documentation around best practices in hosting a PHP application or Drupal specifically.

With the advent of page editors like Gutenberg and Layout Builder, content management systems are increasing focus on enhancing the editorial experience. In migrating Major League Soccer's website to Drupal 8, we had a very unique set of goals. Our first goal was to give content editors the flexibility to create stories and preview them as they would appear on the front end. We also wanted to store structured content in the database instead of many field tables. Another goal was to share React components between the this and the front-end system, to prevent inconsistency and promote reuse. Enter Slate.js, a React-based editor with a strong foundation and growing community. Join us for a walkthrough of how we've been integrating it into Drupal 8 as an alternative to CKEditor, Paragraphs and Bricks. The target audience of this session is developers who have intermediate experience with React and Drupal and have a desire for enhancing the admin and editorial experience in Drupal.

Out of the myriad of API design standards two are top of mind these days: GraphQL and JSON:API. We at Four Kitchens have a had the unique experience of running both side by side for an API serving millions of requests per day powering one of the nation’s leading media companies apps, devices and websites.

As microservices and decoupled architectures continue to mature it becomes increasingly important to be able to work efficiently between local and live environments across the entire stack. What does it take to build a decoupled interface against a Drupal backend and how can we share the work with others?

As much as we like decoupled architectures, the process of development is still remarkably coupled to deployment. This talk is a deep dive into the recently launched Netlify Dev, which is a new tool to improve the local development experience, yet solving "works on my machine" syndrome by simulating Edge routing logic via WASM. We will cover how Netlify Dev achieves a zero config experience with your static site generator of choice, while remaining technology agnostic. We will explore how we can dramatically improve the setup and provisioning of serverless functions and third party APIs for event driven architectures. And finally conclude with some ideas on possible directions for the future, and an invitation to discuss, collaborate, and build the future together.

In this session we'll go through all the new features that are (or will be) included in the 4th version of GraphQL module for Drupal.

They are very exciting and they open the possibilities of this module even further, like support for SDL based schemas! Instead of just exposing everything Drupal has to offer, it allows us to craft a tailored schema. This contract is not imposed by Drupal, but by the business needs that have to be met.

Design systems are the new rage, but much like responsive web ten years ago, it's a concept that is still hard to conceptualize or understand. With that being said, how do you even build/implement a design system, let alone manage projects that involve a design system?

Traditional content management systems (CMS) are based on architecture and technology that was introduced 20 years ago.

JAMStack is here to stay and also is the new content management system. What if you can use your repository to store not only code but also all of your content, for dynamic digital experience applications? Now is possible using a GUI/Git-based CMS on top of your preferred SSG.

20% of Global searches is Voice based and in the next 2 years by 2020; this number will increase to 50%. If that does not bother a content creator or marketer! I am not sure what will!

Many web development teams have those "all-round" developers who pick up the responsibility of knowing enough about the back-end, front-end, and site-architecture to be able to integrate the different domains. Having more than one team work on the project becomes tricky, as the integration developers trip over each other, approaching problems in slightly different ways. By agreeing on and building a structured data schema (graph?), and making that schema queryable over GraphQL, you are able to get closer to teams of deep specialization. You can have a team of back-end developers who can focus on what they know. You can have a team of front-end developers who can get access to the data they need in a clear and consistent way across all projects. And because the structure of the data graph is already agreed, they can build their various components simultaneously, with the data consumers (often front-ends) using mock responses.

Implementing a caching layer with a regular Drupal site is pretty standard. But as soon as we have a decoupled website with server-side rendering, things get more complicated

PatientPoint is a point-of-care marketing company specializing in delivering patient and physician education. They have an extensive library of patient education content that they use to build education playlists delivered to more than 51,000 physician offices, 1,000 hospitals and 140,000 Healthcare providers — and they are still growing.

In this session, we talk about decoupling Drupal and building a Decoupled Days event application in React Native, with Redux, Redux-thunk and Animated API

One of Centarro's major development initiatives is to make it easier to decouple Drupal Commerce. Our roadmap for these features is influenced directly by the work we’ve done to support large merchants who depend on both the scalability and flexibility of JavaScript-based front-ends to support high transaction volumes and multiple web and mobile front-ends.

Building a decoupled application is one half of the story before you can deploy it to production. To make sure you have a sturdy application you will have to test it on multiple fronts. You will have to tests various types of components, async operations, integration between multiple components, and a lot more.

More than an epic frat from the 80’s, today we have AWS Lambda, which is taking running code without servers to the next level. In this talk Chris will go over the different ways to write Node.js applications that will run on the AWS Lambda serverless framework, including developing locally with debugging tools, deploying to the cloud, and exploring the Lambda console. An attendee should be familiar with Amazon Web Services and at a high level what serverless technology using AWS Lambda is.

With its 2.0 release, Gatsby added experimental support for GraphQL schema stitching to Gatsby’s already-excellent GraphQL system. This new feature allows you to create a single, universal graph of data composed of multiple GraphQL endpoints.

I’m JD and I have mental illness. I’m also not alone. Every year, roughly 20% of the US adult population deals with some form of mental illness, however that number is MUCH higher in the tech community.

Decoupling isn’t just for your data — decoupling your design through the use of a shared design system can provide flexibility and re-use that could otherwise be impossible. This session will explore the advantages and disadvantages of developing a design system that is an external dependency of a project — both from the context of a traditional CMS architecture and a decoupled Drupal architecture.

Next.js is one of the top choices when you need performant and robust React.js server side rendering with smart code splitting on your front end. Things like smart code-splitting, routing, lazy loading, isomorphic state between server and client side (browser) or Webpack optimised configurations can be a hassle, but Next.js framework make your developing process go forward.

With over 50,000 downloads, Emulsify has been an important tool both internally at Four Kitchens and in the Drupal community, helping to drive the component-driven development movement forward. We are extremely proud to announce version 5, an exciting new direction that can finally help deliver a truly flexible design system regardless of technology.

In this session I will talk about how you can use GraphQL as a data normalization layer for your APIs and use it in clients like apps and your static sites like GatsbyJS. Learn how you can host a GraphQL server on AWS Lambda. We will walk through real world examples and discuss issues like caching and authentication.

Discussions about "when" to use decoupled architecture are plentiful and important, but it often assumes or ignores another tricky decision: "Where" to decouple. This talk will discuss the “Decouple Line” and how moving it around can provide some amazing features to your API.

Our engagement with a leading global agency—to overhauling one of their client's important project comprising of multiple websites across multiple brands—was challenging in many ways, especially since we didn't have a team familiar with the technology at the start. What we had was a prior experience of building decoupled applications, robust, agile management practice and a strong decoupled (read: remote) work culture in place.

Drupal 8 supports a "headless" mode out-of-the-box. A headless CMS allows content creators to manage their content through a familiar admin interface and providing the content via API endpoints, allowing developers to implement a fully customized front-end experience using reusable components and a modern framework as React.

Gatsby and Drupal are a great match for building a fast statically generated site with the administration power of Drupal. However, anyone that has built a production level Gatsby/Drupal website has realized pretty quickly that while it’s great for developers, it’s not the most intuitive experience for content editors.

While working on a large-scale program, built on the Scaled Agile Framework (SAFs), a specialist Drupal agency collaborates closely with one of the world's largest companies and redefines the use and setup of decoupled Drupal.

As our industry matures, we become more specialized and focused in our disciplines. However, web applications are still commonly built in ways that require a deep knowledge of all of the moving parts in order to fully contribute. We see this regardless of organization: large enterprises, small web applications, and even communities like Drupal. As our capabilities to build with technology grow, we desire to mitigate that complexity through comprehensive understanding while still remaining specialized within our discipline.

This session will present a beginner’s guide and demo on how to use GraphQL. Decoupled Drupal is the future, but learning an entirely new stack can be daunting. Writing GraphQL inside Twig templates gives developers a path to an accessible soft-decoupled approach. This session will introduce GraphQL queries and demonstrate the advantages of changing the Drupal push model to a pull model by letting the template define its data requirements

In most of the projects, content authors are the last to meet their tool of work, and quite often with a huge disappointment. With all the effort focused on UX/UI to the end users, the best architecture to the development team, content authors are often neglected. I will discuss the needs of content authors, what initiatives are across open source CMSs (Drupal, Wordpress, Contentful) and how tools such as OpenStory can open a new type of SaaS offering: Content As a Service. OpenStory is an open source interface that allows content authors to better do their job through a personalised dashboard, personalised authoring interface, content analysis and some the perks. OpenStory team has also contributions to the Drupal Admin UI due to their Drupal heritage.

Many developers use Lego metaphors to describe their work. Drupal modules, WordPress plugins, and npm packages all get compared to bricks stacking together. For the metaphor to work, developers need to know how the pieces fit together. That's easier said than done when the popular pieces keep changing.

That's a wrap!