Build better apps, faster

Works with: jQuery, Zepto, Dojo, Mootools, YUI

CanJS is a JavaScript library that makes developing complex applications simple and fast. Easy-to-learn, small, and unassuming of your application structure, but with modern features like custom tags and 2-way binding. Creating apps is easy and maintainable.

Get Started

You'll be up and running in no time

Simple To Use

Observables and live binding do the work for you.

var Todo = can.Model.extend({
  findAll: 'GET /todos',
  findOne: 'GET /todos/{id}',
  update: 'PUT /todos/{id}',
  destroy: 'DELETE /todos/{id}'
}, {});

can.Component.extend({
  tag: 'todos-app',
  scope: {
    selectedTodo: null,
    todos: new Todo.List({}),
    select: function(todo){
      this.attr('selectedTodo', todo);
    },
    save: function(todo) {
      todo.save();
      this.removeAttr('selectedTodo');
    }
  }
})
<todos-app>
  <h2>Todays to-dos</h2>
  {{#selectedTodo}}
  <input type="text"
         ({$value})="description"
         ($change)="save()">
  {{/selectedTodo}}
  <ul>
    {{#each todos}}
    <li>
      <input type="checkbox"
              ({$checked})="complete">
      <span class="{{#if complete}}done{{/if}}"
            ($click)="select()">
        {{description}}
      </span>
      <button ($click)="destroy()"></button>
    </li>
    {{/each}}
  </ul>
</todos-app>

CanJS.com Embed