0.2.0 • Published 6 years ago

backticks v0.2.0

Weekly downloads
2
License
MIT
Repository
github
Last release
6 years ago

Backticks

An Express view engine for using ES2015 Template Literals.

Installation

$ npm i backticks

Features

  • Compiled and interpreted by V8 (minimun overhead to the project)
  • Learning new syntax is not required
  • Niceties like automatic escaping & automatic array joining
  • Support for layout using generator functions

Usage

Basic Usage

The basics required to integrate backticks renderer are:

var express = require('express'),
  backticks = require('backticks'),
  app = express();
  
app.engine('html', backticks());
app.set('views', 'views');
app.set('view engine', 'html');

app.get('/', function(req, res) {
  res.render('index', {title: 'Welcome', message: "Hello World"});
});

app.listen(3000);

Before Express can render template files, the following application settings must be set:

  • views, the directory where the template files are located. Eg: app.set('views', './views')
  • view engine, the template engine to use. Eg: app.set('view engine', 'html')

HTML template file named index.html in the views directory is needed, with the following content:

<!DOCTYPE html>
<html>
<head>
    <title>${title}</title>
</head>
<body>
    <h1>${message}</h1>
</body>
</html>

Using a Layout file

Backticks supports the usage of a layout file. The layout is processed in a generator function, so you have access to yield Within it.

By default, Backticks will try to load a "layout" file using the same folder and extension of your views.

Example:

var express = require('express'),
  backticks = require('backticks'),
  app = express();

app.engine('html', backticks({
  caching: true
}));
app.set('views', 'views');
app.set('view engine', 'html');


app.get('/', function(req, res) {
  res.render('index', {message: "Hello World"});
});

app.listen(3000);

views/layout.html:

<html>
  <head>
    <title>Hey, up here!</title>
  </head>
  <body>
    <div id="page">
      ${yield}
    </div>
  </body>
</html>

Template:

<div>
  <h1>${message}</h1>
</div>

Settings

These are the available options when instantiating backticks:

OptionDescriptionDefault Value
cachingWheter or not Backticks should cache viewsfalse
layoutFileFile to use as layout for viewsviews folder/layout.view engine
fnWhitelistBy default, values returned from functions provided in locals are automatically escaped. You can whitelist functions to avoid auto escapingArray.prototype

Should I use this in production code?

Use Backticks if you need something quick and simple. It is not as readable as the template syntax supported by Handlebars.js and similar templating engines. On the other hand, it is lightweight and new syntax is introduced: It's just JavaScript.

0.2.0

6 years ago

0.1.11

6 years ago

0.1.10

6 years ago

0.1.9

6 years ago

0.1.8

6 years ago

0.1.7

6 years ago

0.1.6

6 years ago

0.1.5

6 years ago

0.1.4

6 years ago

0.1.3

6 years ago

0.1.2

6 years ago

0.1.1

7 years ago

0.1.0

7 years ago