A simple and fast Headless Drupal 8 solution: Acephalous

Drupal 8 is by far the best CMS I have ever used. And I use the term CMS loosely. Drupal 8 is more like an Enterprise Web Development platform and, it is extremely easy to set up.

You,

1. Install it on local using either Lando or DrupalVM
2. Extend it in whatever way you seem fit
3. Export configs
4. Commit and push

I wanted a similarly easy solution but for a Headless Drupal 8 application. An out of the box Headless Drupal application with a JavaScript front-end as well. This is what Acephalous does.

Acephalous has two parts. An API first Drupal 8 distribution and an Angular (any JS framework can be used) front-end application. Let me paint you a picture and then I'll explain.

There are still improvements that I am working on, but this is basically how it works:

1. User visits a url say "/article/some-article-that-user-is-visiting"
2. The Angular app contains a router which calls a RoutingComponent. Now, the best way to do this is to create components for all Entity types. So there will be an ArticleComponent, PageComponent, UserComponent, and so on. The RoutingComponent decides which of these components should handle the request.
   To do this, RoutingComponent needs more information. It sends a request to a URL provided by the Decoupled Router module.
3. The Decoupled Router module returns a serialized response of the entity info (type, bundle, nid, uid).
4. The RoutingComponent now has enough information to return the right component to process this request. i.e., ArticleComponent.
5. The ArticleComponent now appends a "?_format=json", gets the response, and builds the article page and renders it on the browser.

 

This project is still in its early stages and cannot be used yet, but the hard part is done. All I have to do is make some improvements to reduce payload and number of requests and add components to handle other known entities and a generic component to handle any entity.

The Decoupled router module currently only resolves entity URLs. I need it to resolve view URLs, image URLs, and other custom URLs as well. I hope to have more contributors from the Drupal community, to work on this so that we can provide an easy and out of the box Headless Drupal solution.

Setting up the dev environment is quite easy:

git clone --recurse-submodules git@github.com:codingsasi/acephalous.git
cd drupal
lando start
lando composer install
lando rebuild // and open url on browser to continue installation

// For angular
cd ../ng
npm install
ng serve // or npm start then go to http://localhost:4200

I hope this everyone finds this project to be as useful as I do. Please reach out via mail or phone with improvements, PRs and any help is appreciated.