May 6, 2021
A Drop of Decoupled Menu Initiative
The Decoupled Menu Initiative Team ran an online Hackathon during DrupalCon North America 2021. It is always a pleasure to see participation from a diverse group consisting of senior backend and frontend developers to those who have just started using Drupal. Here, I am examining why it held importance, what we achieved and how we can drive it forward. You can lend a hand in this initiative, even if you have never participated before in this or have just started using Drupal!
Google Suggest — more than just a suggestion
Back in 2004, Google introduced a revolutionary little feature called Google Suggest. It supercharged the search field to offer suggestions as you type, without a page reload. The nifty “requests” between the server and the web page provided a pleasing user experience.
The expectation from Content Management Systems changed to meet the excellent user experience. Instead of providing a simple text or a piece of pre-rendered code snippets, they (frontend dev) started demanding structured data like JSON from the server. This allowed Frontend Developers to write much cleaner and complex logic than ever before. Thus began a new era of Content Management System, where various CMSs started focusing on providing API endpoints serving JSON content.
Why Headless and what is in it for Drupal?
A Headless CMS is a backend only content management system built as a content repository that makes content accessible via an API for display on any device.
Many web pages are trying to mimic the native App’s user experience nowadays. An area where traditional CMS are struggling to cope up. Drupal is no longer being used to display just web pages. Multichannel publishing is becoming common. Drupal can serve content-hungry applications inside a smartphone or a shy data-cautious app inside a smartwatch.
Drupal as Headless CMS
Including JSON:API in core laid the foundation stone for Drupal to embrace the Headless CMS ability. Contenta CMS and DruxtJS used this foundation wholeheartedly. Decoupled Menu Initiative aims to make Headless CMS experience better for Drupal users. This core initiative is using the “menu in a decoupled systems” scenario to recognize improvements.
Hackathon during the Drupalcon NA 2021 was quite successful in identifying and implementing a lot of improvements. It was thrilling to see people from various disciplines join hands to enhance the decoupled Drupal experience. There was an overwhelming interest in improving the documentation and trying out the fresh “General Project” category on Drupal.org.
Hackathon organized several events around the following projects:
Generic Drupal Web Components
A library of generic web components that are accessible, framework agnostic, possible to style, and easy to use with data provided by Drupal.
Drupal svelte component menu
A decoupled menu component for Drupal in Svelte.
Identified various personas. Guides targeting different personas are planned. We have a rough outline now.
Following key statistics were achieved during hackathon:
- Over 39 issues to work on, 11 fixed, 10+ credits issued
- Gitlab CI integrations for linting and tests
- Storybook integration
- Tugboat integration with Gitlab CI
- Lighthouse branch previews (using Tugboat integration)
- Consuming Web Component hosted on Drupal.org inside a React App
- Collected over 14 pages of idea on how to improve documentation
- Drafted a rough plan on how to further collaborate about documentation
Hackathon helped accelerate development on issues collected over time in the Drupal.org issue queue. It’s a great way to get help and give help. I look forward to attending more hackathons like this to brainstorm and improve the Decoupled Drupal experience.