node package manager
Share your code. npm Orgs help your team discover, share, and reuse code. Create a free org »

fun-html

Fun HTML

Build Status

Renders html from pure functions. div(span({class: 'foo'}, bar)) === '<div><span class="foo">bar</span></div>'.

Non-void tags are curried: div({id: foo})('bar') === <div id="foo">bar</div>.

Motivation

  • functional goodness (pure functions, currying, easy composition)
  • small (10 lines of code, few dependencies)
  • fast (no template parsing)
  • no dsl needed, just compose functions

Usage

The exported object has a function for each html element. If you just want a function to generate arbitrary tags, use fun-html-core.

var div = require('fun-html').div;
var img = require('fun-html').img;
 
// render a tag with content 
div('foo');
// => '<div>foo</div>' 
 
// render a tag with attributes and content 
div({class: 'bar baz', qux: bla}, 'foo');
// => <div class="bar baz" qux="bla">foo</div> 
 
// curried attributes 
div({class: 'bar'})('foo');
// => <div class="bar">foo</div> 
 
// void (self--closing) tags 
img();
// => <img !> 
 
// void tag with attributes 
img({class: 'foo'});
// => <img class="foo">