This package is now deprecated and will not receive any updates in the future.
A Hapi.js plugin that works with the catalyst-server to aid in server-side rendering using Handlebars and React. It allows you to relate a Handlebars template and a React component to a route. This route will automatically be registered with the server and will decorate request.pre.component with the react component and the request.pre.template with the template. It will also register @hapi/vision and server views with Handlebars rendering for the page scaffolding
Install:
npm install @vrbo/catalyst-render
Register the plugin in the application's manifest:
...
"register": {
"catalyst-render": {
"plugin": "require:@vrbo/catalyst-render",
"options": {
"routes": [{
"route": "require:./routes/application.js",
"component": "require:../components/App/server.js",
"template": "./templates/welcome.hbs"
}]
}
}
}
...The require:./routes/application.js points to a route file that exports a Hapi.js route object and will look something like this (with a very basic render):
module.exports = {
method: 'GET',
path: '/',
options: {
handler(request, h){
const template = request.pre.template;
const Component = request.pre.component;
const body = ReactDOMServer.renderToString(<Component/>);
return h.view(template, { body })
},
id: 'root'
}
}| Param | Type | Description |
|---|---|---|
| server | object |
Hapi.js server |
| options | object |
Overriding options |
| options.routes | array |
A list of route objects to register on server. |
| [options.viewsOptions] | object |
Options to add to (or override) when on server.views method is called for adding things like partials ,, layouts, helpers and others. |
| [options.visionOptions] | object |
Proxy for options when registering @hapi/vision. |
| [options.resolveAssetHelper] | object |
A Handlebars helper to help resolve static assets, as in publishing to a CDN. |
| options.resolveAssetHelper.name | string |
Name of helper. |
| options.resolveAssetHelper.helper | function |
Helper function. |
This is an object for registering routes, React components, and templates
| Property | Type | Description |
|---|---|---|
| route | object |
Hapi.js route object to register on server. |
| component | object |
A React component to render. Available as request.pre.component in handler in above route. |
| template | array |
A Handlebars template to use to render page scaffold. Available as request.pre.template in handler in above route. |