Drupal, React.js

Loosely Coupled: Open Drupal Ajax dialog boxes from React via Drupal Behaviour

Dialogs are a quick and easy way to display additional information without reloading the entire page. Dialog boxes can display just some static text, any node or form of your page, a views page, or any custom markup you'll feed them. In order to open some link/node/page in a modal window, you can add the following structure to the link...

by Deepali Agarwal
Tag: Loosely Coupled
03-Jan-2023

Drupal, React.js

Loosely Coupled: Pass data to React app via drupalSettings

There may be a need to pass a variable, checkbox settings, or some global settings from drupal to react. This can be achieved by passing data from drupal into an API and consuming the same API in react. But why call an extra API when we can achieve it without it? We will be using #attached/drupalSettings to accomplish this. Step 1:...

by Deepali Agarwal
Tag: Loosely Coupled
29-Dec-2022

Drupal, React.js

Loosely Coupled: Integrate React JS into Drupal sites

React is a JavaScript library that makes it painless to create interactive UIs. Unfortunately, embedding React into a Drupal site is not straightforward. In this article, I will show you relatively simple methods of how to do so. React can be integrated with Drupal in 2 ways: Fully decoupled Partially Decoupled (Loosely...

by Deepali Agarwal
Tag: Loosely Coupled
27-Dec-2022