A Fast and Easy To Use View Engine, Compiled In Go


Keywords
nodejs, express, npm, turbx, view engine, template engine, html, xhtml, md, markdown, go, golang
License
MIT
Install
npm install turbx@1.5.0

Documentation

Turbx

npm version dependency status gitHub top language npm license

npm weekly downloads npm monthly downloads

donation link

A Fast and Easy To Use View Engine, Compiled In Go.

Notice: This View Engine Is Currently In Beta

Whats New

  • Repeated vars can now optionally be pre compiled

Installation

sudo apt-get install libpcre3-dev

npm install turbx

Setup

const express = require('express');
const {join} = require('path');
const turbx = require('turbx');

const app = express();

app.engine('xhtml', turbx({
  /* global options */
  template: 'layout',
  opts: {default: 'some default options for res.render'},
  before: function(opts){
    // do stuff before res.render
  },
  after: function(opts, html /* html string containing the compiled output */){
    // do stuff after res.render
  },
}));
app.set('views', join(__dirname, 'views'));
app.set('view engine', 'xhtml');

app.use(function(req, res, next){
  res.render('index', {
    title: 'example',
    content: '<h2>Hello, World!</h2>',
    const: {
      // the const object can be used to precompile a var, and not need to compile it again
      GoogleAuthToken: 'This Value Will Never Change',
    },
  });
});

// pre compiling constant vars
app.use(async function(req, res, next){
  let preCompiled = await res.preCompiled('index');
  if(!preCompiled){
    const SomethingConsistant = await someLongProcess();

    await res.preRender('index', {
      myConstVar: SomethingConsistant,
    });
  }

  res.render('index', {
    title: 'example',
    content: '<h2>Hello, World!</h2>',
  });
});

// pre compiling and overriding the cache
app.use('/fix-cache', async function(req, res, next){
  res.render('index', {
    PreCompile: true, // this will override the existing cache and rebuild it with the new data (or create a new cache)

    title: 'example',
    content: '<h2>Hello, World!</h2>',
  });
});

Usage

<!-- this is a comment -->
/* this is also a comment */
// this is an inline comment


<!-- output a variable with escaped HTML -->
{{title}}

<!-- output a variable and allow HTML -->
{{{content}}}

<!-- output a variable with a fallback -->
{{title|name|'Default Title'}}


<!-- output a variable as an attribute (this method will remove the attribute if the value is undefined) -->
<a {{href="url"}}>Link</a>

<!-- this is a shortcut if the attribute name matches the variable name -->
<a {{="href"}}>Link</a>


<!-- you can safely insert object keys (if an object is undefined, this will return blank, and will Not crash) -->
{{obj.key}}

<!-- use dot notation for array indexes -->
{{arr.0}}

<!-- use the value of the "key" var as the key of "obj" -->
{{obj[key]}}
{{obj[myVar]}}


<!-- functions start with an _ -->
<_if var1 & var2 = 'b' | var2 = 'c' | !var3>
  do stuff...
<_elif !var1 & var2 = 'a'/>
  do other stuff...
<_else/>
  do final stuff...
</_if>

<_each myObj as value of key in index>
  {{key}}: {{value}}
  array index: {{index}}
</_each>


<!-- A component is imported by using a capital first letter -->
<!-- The file should also be named with a capital first letter -->
<!-- args can be passed into a component -->
<MyComponent arg1="value 1" arg2="value 2" type="h1">
  Some body to add to the component
</MyComponent>

<!-- component without a body -->
<MyComponent arg1="value"/>

<!-- file: MyComponent.xhtml -->
{{arg1}} - {{arg2}}
<{{type}}>
  {{{body}}}
</{{type}}>


<!-- file: layout.xhtml -->
<html>
  <head></head>
  <body>
    <header></header>
    <main>
      <!-- Insert Body -->
      <Body/>
    </main>
    <footer>
  </body>
</html>

Other Functions

  <!-- random paragraph of lorem ipsum text -->
  <_lorem/>
  <!-- paragraph of lorem ipsum text with 2 sentences -->
  <_lorem 2/>
  <!-- sentence of lorem ipsum text with 3-5 words -->
  <_lorem s 3 5/>
  <!-- word of lorem ipsum text with 5-10 letters -->
  <_lorem w 5 10/>

  <!-- embed a youtube video -->
  <_youtube url="https://www.youtube.com/watch?v=SJeBRW1QQMA" />
  <!-- embed a youtube playlist -->
  <_youtube url="https://www.youtube.com/playlist?list=PL0vfts4VzfNjnYhJMfTulea5McZbQLM7G" />
  <!-- alias for yourube embed function -->
  <_yt url="https://www.youtube.com/watch?v=SJeBRW1QQMA" />
  <!-- this function accepts multiple url formats -->
  <_yt url="youtu.be/SJeBRW1QQMA" />

Additional Features

// add basic rate limiting
// this function uses the express-device-rate-limit module made my AspieSoft
turbx.rateLimit(app, {opts /* for express-device-rate-limit module */});

// auto render views as pages
turbx.renderPages(app, {opts});
// also recognizes folders with an index.xhtml file
// ignores the components folder and tries to ignore root files named after error codes (or in an "error" folder)