Skip to content

Template Engine Interface

Jun Yang edited this page May 17, 2016 · 7 revisions

Brick.JS is designed to support multiple template engines. This article describes how to implement a template engine for Brick.JS. Before do this, checkout this list for template engines already supported:

Template Engine Usage

When initializing Brick.js, the user will set config.engine to enable your engine:

var brk = brickJs({root: path.join(__dirname, 'modules')}); 
brk.engine('.hbs', <your engine>);

Note: Type of <your_engine> is Object, which is initialized using your Lib.

Provide a Render Method

Render Method (<your_engine>.render) is called when Brick.js need to render a template. <your_engine>.render is specified as follows:

Function(String templatePath, Object context, Function pmodularize, Function pctrl) => Promise<String HTML>

  • templatePath: Absolute file path for the template file.
  • context: Local context for template rendering.
  • pmodularize: Call pmodularize to do modularization, see below.
  • pctrl: Sub-module rendering callback, see below.
  • Promise<String HTML>: <your_engine>.render should return a Promise which resolves the result HTML string.

Identify Partials and Layouts

It's on your responsibility to decide whether to support partials and layouts. If you decided to do so, you'll need pctrl to render a partial (sub-module) or layout (also a sub-module).

pctrl is specified as follows:

Function(String moduleName, Object context) => Promise<String HTML>

  • moduleName: The name of the sub-module.
  • context: Context used to render the module.
  • Promise<String HTML>: pctrl returns a Promise which resolves the result HTML string.

Remember Modularization

Modularization will bind your HTML to CSS and JS. After rendering current brick (before extending the layout brick), your engine should request Brick.JS to modularize it. pmodularize is specified as follows:

Function(String html) => String modularizedHTML

  • html: The render result for the current brick.
  • modularizedHTML: Modularized HTML.

Clone this wiki locally