es6views
v1.2.0
Published
View Engine for ExpressJS. Write your views using ES6 Template Strings. Simple, fast, extensible.
Downloads
226
Maintainers
Readme
ES6Views
View Engine for ExpressJS. Write your views using ES6 Template Strings. Simple, fast, extensible.
Installation
npm install --save es6views
Usage
// where ever you setup your view engine for ExpressJS
const esviews = require("es6views")
esviews.viewEngine(app)
app.set('views', path.join(__dirname, 'views'))
app.set('view engine', 'es6')
Templates
First off, create your base layout which will hold all the common logic for your views
const Layout = require("es6views").Layout
class MyLayout extends Layout {
parse() {
let markup = `<head>
<title>${this._data.title}</title>
</head>
<body>`
markup += [this.header(), this.content(), this.footer()].join("")
markup += `</body>`
this._markup = markup
}
header () {
const data = this.data
return `<header>${data.title}</header>`
}
content () {
return ``
}
footer () {
return `<footer>2008-${(new Date()).getFullYear() Dezine Zync Studios. All Rights Reserved.}</footer>`
}
}
module.exports = MyLayout
Then, inside a page template, you can do the following:
const MyLayout = require('./mylayout.es6')
class Posts extends MyLayout {
content () {
const data = this.data
const posts = data.posts
return posts.map(post => {
return `<article>${post.body}</article>`
}).join("")
}
}
module.exports = Posts
You can then use it in your route like so:
router.get('/posts', (req, res) => {
let locals = Object.assign({}, res.locals, {
posts: posts
})
res.render('projects', locals)
})