According to the Stack Overflow 2017 Developer Survey, the most loved development framework is React, and the most wanted is Node.js.
A Headless CMS, such as Acquia’s Headless Lightning, provides a decoupled content repository to provide content editors a service for storing and governing structure content for any front-end React application. Together Node.js and a Headless CMS, as application services, are the standard back-end building blocks for your digital experience front-end and back-end development teams.
Content API and JSON to Node.js
Headless Lightning uses a Content API and JSON for Node.js applications to interact with the Drupal-managed content store.
Here are the building blocks:
HTML data sourced from Drupal’s content source
The following image shows a React application displaying and utilizing data which originated from API endpoints served from Drupal.
The same data referenced as the original JSON API code
The Drupal Headless Lightning sub-profile exposes the data as multiple JSON API services which are generated by the JSON API module and contributed extras.
The same data being viewed within the React application data store.
The following image shows the React application storing the API data by utilizing the Redux state method within the application.