Hey! This article references a pre-release version of Ember. Now that Ember
has reached 1.0, the code samples below are no longer correct and the expressed
opinions may no longer be accurate.
Previously I setup a Rails server to vend the most basic JSON API using the very interesting ActiveModelSerializers gem. Now it’s time to turn my attention to hooking up Ember.js. Specifically my goal in this series is to build a single resource like Rails scaffolding, but have most of the work on the client side and just APIs, auth, and business logic on the server.
First up, let’s use the nifty gem from the Ember.js core team in our Gemfile:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15
As you can see, I’m interesting in using ember-data which very much has the feel of a client side ActiveRecord (note: under heavy development with regular breaking changes), so I also needed to add the following to application.js under my ember require:
And of course we need to declare our client side model:
1 2 3 4
To make sure everything is working as expected, a quick trip over to the console in my browser shows the plumbing is working!
1 2 3 4
Hurray, we’ve loaded up the data store and been able to query for a specific record. Looking good so far! Next time will be client side routing and layouts.
Updated – I use to have heavy namespacing, but based on this issue I’m going to try Tom’s naming strategy of un-nested namespaces with upper camel case classes (App.MainHomeView) and lower camel case instances (App.mainHomeView).