You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Universal html rendering middleware for Rill.
Uses set-dom to update html in the browser.
Need isomorphic event handling? Check out @rill/delegate!
Installation
npm install @rill/html
Example
// We will use handlebars for our example.consthbs=require('handlebars')consthomePage=hbs.compile(` <html> <head> <title>My App</title> <meta name="description" content="Rill Application"> </head> <body> {{title}} <script src="/app.js"/> </body> </html>`)// Setup a universal Rill application.constapp=require('rill')()// Setup the html diffing/rendering middleware.app.use(require('@rill/html')())// Setup a homepage route.app.get('/',({ req, res },next)=>{// Just set the response body to some html.// updates the dom in the browser, or render a string in the server.res.body=homePage({title: '@rill/html'});// On the server the final response will be.` <!DOCTYPE html> <html> <head> <title>My App</title> <meta name="description" content="Rill Application"> </head> <body> @rill/html <script src="/app.js"></script> </body> </html> `})
Sub page rendering.
Sometimes the goal is not to diff the entire page, or you want to use something like @rill/page to handle the document.
@rill/html adds the ability to change the root element with an option for this purpose.
// Use a query selector to set the root element to diff.app.use(require('@rill/html')({root: '#my-element'}))
