Cedr - is a page builder from library of blocks.
Generates the html page from the structure presented in the form of a js object.
In the description of the structure of the used blocks that are in the description of library blocks.
Inspired by BEM and bem-xjst
Before you can use cedr strongly recommended to read this methodolgy
Also may interesting:
$ npm install --save cedrconst cedr = require('cedr');
let library = {
'page': {
templates: {
'page': '<!DOCTYPE html><html><head></head><body class="{{ className }}">{{{ content }}}</body></html>',
'__header': '<div class="{{ className }}">This is Header: {{{ content }}}</div>'
}
},
'text': {
templates: {
'text': '<p class="{{ className }}">{{{ content }}}</p>'
}
}
}
let page = {
block: 'page',
content: [
{
block: 'text',
content: 'text'
},
{
block: 'page',
element: 'header',
content: 'Yeah!'
}
]
};
cedr(page, library);
// Return '<!DOCTYPE html><html><head></head><body class="page"><p class="text">text</p><div class="page__header">This is Header: Yeah!</div></body></html>'
cedr(page);
// Return '<div class="page"><div class="text">text</div><div class="page__header">Yeah!</div></div>'Example with express
'use strict'
const cedr = require('cedr');
const express = require('express');
const app = express();
const library = {
'page': {
templates: {
'page': '<!DOCTYPE html><html><head></head><body class="{{ className }}">{{{ content }}}</body></html>',
'__header': '<div class="{{ className }}">This is Header: {{{ content }}}</div>'
}
},
'text': {
templates: {
'text': '<p class="{{ className }}">{{{ content }}}</p>'
}
}
}
app.get('/', function (req, res) {
let page = {
block: 'page',
content: [
{
block: 'text',
content: 'text'
},
{
block: 'page',
element: 'header',
content: 'Yeah!'
}
]
};
res.send(cedr(page, library));
});
app.listen(3000, function () {
console.log('Example app listening on port 3000!')
})cedr can be called with or without library of blocks.
Type: Object
The object of page. More about page format
Type: Object
The object of library.
Returns a String of html.
MIT © antitim