React as a replacement for Drupal Modules
James Morton
In systems with many sites for individual clients, such as higher education and different schools, individuals clients can want custom and specific functionality for their sites. Drupal 8 modules can be excessively clunky, difficult to manage, and time consuming to update.
During this presentation we will explore a method of using a single Drupal 8 module combined with embedded react in order to create de-coupled, reusable applications quickly; drawing from a real-life example at Brown University.
In this example, we were starting an upgrade of hundreds of sites from d6/d7 to d8, and we found that multiple schools required one-off custom modules. Instead of rebuilding all the modules in d8, we created a single d8 module which contained a directory of Javascript files, each of which was a webpack uglified react application. Using a library of reusable components, we rebuilt the custom applications in react and embedded them in a page through the module's custom paragraph type; using a dropdown list of applications defined in configuration. This method was so successful, that we extended it further to other modules which were used across multiple sites, preferring the React applications to custom Drupal modules. We plan to expand its functionality in the future!
This method has many advantages over using multiple Drupal modules, and the potential to be useful in lots of different situations. We'll look at the advantages and disadvantages of the method, how we overcame obstacles such as storing data, sending mail, and CORS issues. We'll also see a working example of the module and configuration.
In systems with many sites for individual clients, such as higher education and different schools, individuals clients can want custom and specific functionality for their sites. Drupal 8 modules can be excessively clunky, difficult to manage, and time consuming to update.
During this presentation we will explore a method of using a single Drupal 8 module combined with embedded react in order to create de-coupled, reusable applications quickly; drawing from a real-life example at Brown University.
In this example, we were starting an upgrade of hundreds of sites from d6/d7 to d8, and we found that multiple schools required one-off custom modules. Instead of rebuilding all the modules in d8, we created a single d8 module which contained a directory of Javascript files, each of which was a webpack uglified react application. Using a library of reusable components, we rebuilt the custom applications in react and embedded them in a page through the module's custom paragraph type; using a dropdown list of applications defined in configuration. This method was so successful, that we extended it further to other modules which were used across multiple sites, preferring the React applications to custom Drupal modules. We plan to expand its functionality in the future!
This method has many advantages over using multiple Drupal modules, and the potential to be useful in lots of different situations. We'll look at the advantages and disadvantages of the method, how we overcame obstacles such as storing data, sending mail, and CORS issues. We'll also see a working example of the module and configuration.