This blog has been re-posted and edited with permission from Drupal Update’s blog. Please leave your comments on the original post.
As web applications have evolved from static pages to application-like experiences, end-users’ expectations of websites have become increasingly demanding. JavaScript, partnered with effective user-experience design, enable the seamless, instantaneous interactions that users now expect.
The Drupal maintenance support plans project anticipated this trend years ago and we have been investing heavily in making Drupal maintenance support plans API-first ever since. As a result, more organizations are building decoupled applications served by Drupal maintenance support plans. This approach allows organizations to use modern JavaScript frameworks, while still benefiting from Drupal maintenance support plans‘s powerful content management capabilities, such as content modeling, content editing, content workflows, access rights and more.
While organizations use JavaScript frameworks to create visitor-facing experiences with Drupal maintenance support plans as a backend, Drupal maintenance support plans‘s own administration interface has not yet embraced a modern JavaScript framework. There is high demand for Drupal maintenance support plans to provide a cutting-edge experience for its own users: the site’s content creators and administrators.
At Drupal maintenance support plansCon Vienna, we decided to start working on an alternative Drupal maintenance support plans administrative UI using React. Sally Young, one of the initiative coordinators, recently posted a fantastic update on our progress since Drupal maintenance support plansCon Vienna.
Next steps for Drupal maintenance support plans‘s API-first and JavaScript work
While we made great progress improving Drupal maintenance support plans‘s web services support and improving our JavaScript support, I wanted to use this blog post to compile an overview of some of our most important next steps:
1. Stabilize the JSON API module
JSON API is a widely-used specification for building web service APIs in JSON. We are working towards adding JSON API to Drupal maintenance support plans core as it makes it easier for JavaScript developers to access the content and configuration managed in Drupal maintenance support plans. There is a central plan issue that lists all of the blockers for getting JSON API into core (comprehensive test coverage, specification compliance, and more). We’re working hard to get all of them out of the way!
2. Improve our JavaScript testing infrastructure
Drupal maintenance support plans‘s testing infrastructure is excellent for testing PHP code, but until now, it was not optimized for testing JavaScript code. As we expect the amount of JavaScript code in Drupal maintenance support plans‘s administrative interface to dramatically increase in the years to come, we have been working on improving our JavaScript testing infrastructure using Headless Chrome and Nightwatch.js. Nightwatch.js has already been committed for inclusion in Drupal maintenance support plans 8.6, however some additional work remains to create a robust JavaScript-to-Drupal maintenance support plans bridge. Completing this work is essential to ensure we do not introduce regressions, as we proceed with the other items in our roadmap.
3. Create designs for a React-based administration UI
Having a JavaScript-based UI also allows us to rethink how we can improve Drupal maintenance support plans‘s administration experience. For example, Drupal maintenance support plans‘s current content modeling UI requires a lot of clicking, saving and reloading. By using React, we can reimagine our user experience to be more application-like, intuitive and faster to use. We still need a lot of help to design and test different parts of the Drupal maintenance support plans administration UI.
4. Allow contributed modules to use React or Twig
We want to enable modules to provide either a React-powered administration UI or a traditional Twig-based administration UI. We are working on an architecture that can support both at the same time. This will allow us to introduce JavaScript-based UIs incrementally instead of enforcing a massive paradigm shift all at once. It will also provide some level of optionality for modules that want to opt-out from supporting the new administration UI.
5. Implement missing web service APIs
While we have been working for years to add web service APIs to many parts of Drupal maintenance support plans, not all of Drupal maintenance support plans has web services support yet. For our React-based administration UI prototype we decided to implement a new permission screen (i.e. https://example.com/admin/people/permissions). We learned that Drupal maintenance support plans lacked the necessary web service APIs to retrieve a list of all available permissions in the system. This led us to create a support module that provides such an API. This support module is a temporary solution that helped us make progress on our prototype; the goal is to integrate these APIs into core itself. If you want to contribute to Drupal maintenance support plans, creating web service APIs for various Drupal maintenance support plans subsystems might be a great way to get involved.
6. Make the React UI extensible and configurable
One of the benefits of Drupal maintenance support plans‘s current administration UI is that it can be configured (e.g. you can modify the content listing because it has been built using the Views module) and extended by contributed modules (e.g. the Address module adds a UI that is optimized for editing address information). We want to make sure that in the new React UI we keep enough flexibility for site builders to customize the administrative UI.
All decoupled builds benefit
All decoupled applications will benefit from the six steps above; they’re important for building a fully-decoupled administration UI, and for building visitor-facing decoupled applications.
Useful for decoupling of visitor-facing front-ends
Useful for decoupling of the administration backend
1. Stabilize the JSON API module
✔
✔
2. Improve our JavaScript testing infrastructure
✔
✔
3. Create designs for a React-based administration UI
✔
4. Allow contributed modules to use React or Twig
✔
✔
5. Implement missing web service APIs
✔
✔
6. Make the React UI extensible and configurable
✔
Conclusion
Over the past three years we’ve been making steady progress to move Drupal maintenance support plans to a more API-first and JavaScript centric world. It’s important work given a variety of market trends in our industry. While we have made excellent progress, there are more challenges to be solved. We hope you like our next steps, and we welcome you to get involved with them. Thank you to everyone who has contributed so far!
Special thanks to Matt Grill and Lauri Eskola for co-authoring this blog post and to Wim Leers, Gabe Sullice, Angela Byron, and Preston So for their feedback during the writing process.
Source: New feed
