Created: 2012-03-22 16:11
Updated: 2016-08-22 06:29


Brutally simple micro-architecture for professional client-side javascript applications.


  • transparent data-binding, including modifications to arrays
  • one-liner for powering dynamic components like lists, details views
  • handle user actions in a consistent manner
  • maintain references to view components easily
  • supports any template engine with a compile and a render function, which yours probably does, and probably should
  • easy extension mechanism


jQuery or Zepto :/


HTML: todo.html

<!doctype html>
		<title>Motivational Todos</title>
		<script src=''></>
		<script src=""></script>
		<script src='motive.js'></>
		<script src='todo.js'></>
		<input id='todoInput' placeholder='What needs to be done?'/>
		<div id='todoOutput'/>

JS: todo.js

window.Todo = new Motive();

Todo .configure({ templateEngine: Hogan, template: {

dynamic: {

action: {
	'#todoInput': function(event){


}) .init(function(){



  • methods for un-everything
  • deep-property data-binding
Cookies help us deliver our services. By using our services, you agree to our use of cookies Learn more