Code Monkey home page Code Monkey logo

brio's Introduction

Brio Build Status

Templated layout builders.

npm install brio

brio

Usage

(Pretending that Javascript has multiline strings)

var brio = require('brio'), handlebars = require('handlebars');

var pages = brio(handlebars, {
	base: `<!doctype html>
	<html>
		<head>
			<title>{{page.title}}</title>
		</head>
		<body>
		{{{body}}}
		</body>
	</html>`,
	page: `---
	layout: 'base'
	---
	<h1>{{page.title}}</h1>
	<main>
	{{{body}}}
	</main>`,
	site: {
		home: `---
		title: 'Home',
		layout: 'page'
		---

		Welcome!`,
		post: `---
		title: 'Post'
		layout: 'page'
		---

		<h2>{{post.title}}</h2>
		<article>{{post.content}}</article>`
	}
});

pages('site.home', {}); /*⇒ <!doctype html>
	<html>
		<head>
			<title>Home</title>
		</head>
		<body>
		<h1>Home</h1>
			<main>
			Welcome!
			</main>
		</body>
	</html>
*/

pages('site.post', {post: {title: 'Hello world', content: 'Lorem ipsum dolor sit amet'}); /*⇒ <!doctype html>
	<html>
		<head>
			<title>Post</title>
		</head>
		<body>
		<h1>Post</h1>
			<main>
			<h2>Hello world</h2>
			<article>Lorem ipsum dolor sit amet</article>
			</main>
		</body>
	</html>
*/

API

brio :: (Template → Params → String) → Tree String Template → Path → Params → String

Takes a templater, a tree of templates, a path to a template, some params and spits out a compiled string.

Templaters

Are any curried function taking a template and some parameters and returning a string. Handlebars fits nicely, as does _.template.

Licence

MIT. © 2014 Matt Brennan.

brio's People

Contributors

apaleslimghost avatar

Stargazers

Roma Chi avatar  avatar

Watchers

James Cloos avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.