background preloader

Beginnining Ember.js on Rails

Facebook Twitter

Beginning Ember.js on Rails: Part 3. This is part of a series of posts about Ember.js.

Beginning Ember.js on Rails: Part 3

Please read Warming up to Ember.js as well as the Ember.js home page if you're new to Ember.js. As promised in Part 2 of this series, this post will show how records are added, updated and removed in our example app. This app uses our ultra-simple Ember REST library to communicate with a REST interface served by Rails. I'll try to point out when parts of this example use the persistence library (ember-rest.js) instead of core Ember (ember.js). Because our REST interface was completed in Part 2, let's move right to the client-side code... Creating records We'll start by extending our Ember model and views to enable creating records. Extend the model In order to serialize our model, we need to define its resourceName and resourceProperties. The optional validate() method will be called by ember-rest.js when saving records. Extend the listing view Our listing view needs to allow contacts to be added. Notice the "New Contact" link at the bottom.

Beginning Ember.js on Rails: Part 1. This is part of a series of posts on Ember.js.

Beginning Ember.js on Rails: Part 1

Please read Warming up to Ember.js as well as the Ember.js home page if you're new to Ember.js. Ember.js is not dependent upon any particular server stack. In fact, it can be used on its own to control single page web or mobile PhoneGap apps that don't have a backend at all. Check out the canonical Ember Todos app for a simple online example. I've chosen to write a demonstration app that I wish I could have referenced when I started learning Ember.

Just lovely, isn't it? DIY Demo Let's first get the example app running on your own system. Just pull it down from Github and fire it up in Ruby 1.9.2+: Point your browser to localhost:3000 to give this CRUD-dy app a try. Dependencies This example has just a few dependencies beyond the basic Rails 3.1 stack. The straightforward ember-rails gem pre-compiles handlebars templates in the asset pipeline. Architecture Ember does not require that your files be organized in a particular way. Beginning Ember.js on Rails: Part 2. This is part of a series of posts on Ember.js.

Beginning Ember.js on Rails: Part 2

Please read Warming up to Ember.js as well as the Ember.js home page if you're new to Ember.js. As promised in Part 1 of this series, this post will show how the example app uses our ultra-simple Ember REST library to query a resource's REST interface to display a list of records. Server-side Rails Our Rails code is close to the minimum needed to serve up a RESTful JSON interface.

It was originally generated with rails g scaffold and then simplified further. Model The Rails model for contacts is quite basic: Controller The controller is a simplified version of the scaffolding: There are a couple interesting aspects to this controller code. Also note that the update and destroy actions respond to success with: ... instead of the scaffolded default (head :ok), which jQuery.ajax() interprets as an error.

Routes As you can see, we're routing root requests to our contacts controller: Client-side Ember Application Let's move along to the model: Views Templates.