Skip to content

View engine for `koa` without any deps, built to be used with `bel`. Any other engines that can be written in `.js` files would work, too. For example, js file template can just return a stream :)

License

tunnckoCore/koa-bel

Repository files navigation

View engine for koa without any deps, built to be used with bel. Any other engines that can be written in .js files would work, too.

code climate standard code style travis build status coverage status dependency status

Install

npm i koa-bel --save

Usage

For more use-cases see the tests

const koaBel = require('koa-bel')

Javascript template views for koa@2. You can use koa-convert if you want to work in koa@1.x version.

Cool thing about that, is it not requires your templates to be bel or something other like yo-yo, or any other DOM thingy. You can simple return a stream or buffer or anything that can be added to ctx.body. By default it calls .toString() on the returned value, but you can bypass that if you pass opts.toString: false option.

Params

  • <dir> {String|Buffer}: directory to read the views
  • [opts] {Object}: optional options
  • returns {Function}: plugin for koa version 2

Example

const Koa = require('koa')
const bel = require('koa-bel')
const app = new Koa()

const port = 4290

app.use(bel('./views'))
app.use((ctx, next) => {
  ctx.render('home', {
    heading: 'Welcome page',
    description: 'This is our cool landing page, man!',
    subhead: 'What we offer?',
    services: [
      'Realtime Web Apps',
      'Security and Simplicity',
      'Logo Design and Prototypes'
    ]
  })
  return next()
})

app.listen(port, (err) => {
  console.log(`Server start listening on http://localhost:${port}`)
})

Example views/home.js

Here you can even use yo-yo, instead of bel. Or just return a buffer or stream and just pass options.toString: false option.

'use strict'

var bel = require('bel')

module.exports = function home (state) {
  return bel`<section>
    <h1>${state.heading}</h1>
    <p>${state.description}</p>
    <h2>${state.subhead}</h2>
    <ul>${state.services.map((service) => {
      return bel`<li>${service}</li>`
    })}</ul>
  </section>`
}

Related

Contributing

Pull requests and stars are always welcome. For bugs and feature requests, please create an issue.
But before doing anything, please read the CONTRIBUTING.md guidelines.

tunnckoCore.tk keybase tunnckoCore tunnckoCore npm tunnckoCore twitter tunnckoCore github

About

View engine for `koa` without any deps, built to be used with `bel`. Any other engines that can be written in `.js` files would work, too. For example, js file template can just return a stream :)

Resources

License

Code of conduct

Security policy

Stars

Watchers

Forks

Packages

No packages published