Multi-frontend
Thanks to the component-oriented decoupling of Lupus Decoupled Drupal, it's really easy to connect a frontend of choice!
Supported frontend frameworks
Lupus Decoupled provides supports for the following frontend frameworks:
Framework | Technology | Status | Description | Link |
---|---|---|---|---|
Nuxt | Vue.js, JavaScript | Default, Stable & Complete | Easy setup via re-usable connector module. | Connector module |
Next.js | React, JavaScript | Proof-of-concept, In-complete | Example implementation, see README for details. | Example implementation |
Yours? | Add it! |
Adding a new frontend framework
Adding a support for a new framework is quite easy. Here is a short overview of what the frontend needs to take care of:
- Proxying requests: The frontend typically proxies requests to the Drupal
/ce-api
endpoint, while preserving the request URI and optionally some request headers. That way, a request to/news
is served by the frontend, which requests the backend API at/ce-api/news
and takes care of rendering the response. - Forwarding headers: By forwarding the cookie header, the frontend may easily leverage Drupal authentication handling.
- Rendering page content: The
content
section of a response contains a nested tree of custom elements that need to be rendered on the page. - Render a page shell: Request navigation menus and render them as part of a site layout.
- Support page attributes: Support all page attributes provided by the Drupal page API, i.e. render breadcrumbs and messages, support Metatags and Local tasks.
- Handle errors: Take care to not add special handling for HTTP 4xx responses, such that Drupal-controlled error pages get rendered as usual. Simply take care of forwarding the status code.
- Handle redirects: When the page-API generates a redirect response instead of a page, take care to issue a suiting redirect response with the given status code instead of rendering a page.
That's it!
Table of Contents