-
Notifications
You must be signed in to change notification settings - Fork 8
Home
Irving is a ReactJS based, isomorphically rendered, headless CMS frontend application.
Irving is a number of concepts, packages, and libraries that work together to create a powerful ecosystem of development tools.
By using a robust API with a simple routing strategy, Irving allows quick and easy development of headless websites. The concept behind Irving is to offload as much work as possible to the CMS/API layer.
Irving core is an isomorphic node application, ready to act as your site's frontend.
- Server side rendering
- Error handling
- Support for the Irving component API
This repo is a Node application with express.
- Server Side Rendering
In an effort to simplify the entire application, we extend the concept of a React Component to the API and data layer. By mapping out our data in the API in the form a component tree, the Irving application can remain simple and unaware of context/information it doesn't need.
By using a robust API with a simple routing strategy, Irving allows quick and easy development of headless websites. The concept behind Irving is to offload as much work as possible to the CMS/API layer.
When a user hits an endpoint in Irving, the application fires a request to the CMS' API. The response is parsed by Irving and displayed to the user as rendered React components.
When a user hits an endpoint in Irving, the application fires a request to the CMS' API. The response is parsed by Irving and displayed to the user as rendered React components.
The components API is how your CMS describes what Irving should render for any given route. Irving will make a request to your API with a ?path query param. The value of this query param is the path currently being loaded. Navigating to /about-us/ will create a request of /components?path=/about-us/. The CMS should parse this request and return a JSON response.
All responses follow this format,
{
"defaults": [],
"page": []
}Defaults is an array of components that informs Irving what components are "global" and should persist across all requests. This is good for setting up headers, footers, scripts, and other components that should exist on every page. Defaults can be passed at any point, but Irving will automatically add context=site to the initial request, which can be used as a flag to return the default components.
Page is an array of components for a specific route. Irving looks for top-level conflicts between the defaults and page arrays and overrides the defaults with the page component.
The components API is a generic structure for describing what should be rendered on a page. Every component consists of three top-level keys, name, config, and children.
{
"name": "",
"config": {},
"children": [],
}Name is a slug that indicates what component this is. This is used by React to figure out which React component to render.
Config is an JSON object of properties. These get passed into the React component as props.
Children is an array of other components. These will be automatically parsed as components and be available as nodes under the prop key children.
The context query parameter
Site used as a flag to instruct the API that this is an initial site load and defaults should be returned.
Features
https://github.com/alleyinteractive/irving/wiki/Proxying-Requests
Implementations