A framework for creating ambitious web applications.

More Productive Out of the Box.

Handlebars

Write dramatically less code with Ember's Handlebars integrated templates that update automatically when the underlying data changes.
Download Handlebars

Structure

Don't waste time making trivial choices. Ember.js incorporates common idioms so you can focus on what makes your app special, not reinventing the wheel.

Productivity

Ember.js is built for productivity. Designed with developer ergonomics in mind, its friendly APIs help you get your job done—fast.

Getting Started with Ember.js is Easy.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28

App = Ember.Application.create();

App.Person = Ember.Object.extend({
  firstName: null,
  lastName: null,

  fullName: function() {
    return this.get('firstName') +
           " " + this.get('lastName');
  }.property('firstName', 'lastName')
});

App.IndexRoute = Ember.Route.extend({
  model: function() {
    var people = [
      App.Person.create({
        firstName: "Tom",
        lastName: "Dale"
      }),
      App.Person.create({
        firstName: "Yehuda",
        lastName: "Katz"
      })
    ];
    return people;
  }
});


1
2
3
4
5
6
7
8
9
10
11
12
13

<script type="text/x-handlebars">
  {{outlet}}
</script>

<script type="text/x-handlebars" id="index">
  <h1>People</h1>

  <ul>
  {{#each model}}
    <li>Hello, <b>{{fullName}}</b>!</li>
  {{/each}}
  </ul>
</script>

Who's Using Ember.js?

Meet More Users

Buy Ember.js Gear and Support Development