Ember on Rails

A quick overview of some useful tools for getting Ember running nice and smooth within a Rails app. Topics included are: setting up Ember, creating an API, and testing.

Transcript

1. Ember on Rails Tom Kruijsen Utrecht.rb - 2014-02-03
2. Brightin
4. Warning: blatant self- promotion
5. Appuccino
6. Ember
7. A framework for creating ambitious web applications
9. MVC-ish
10. Awesome routing
11. Auto-updating templates
12. Upgrades JavaScript
13. Rails for browsers
14. Ember & Rails
15. Besties
16. Setting up Ember is a chore
17. Tools
18. gem 'ember-rails'
19. rails g ember:bootstrap
21. Emblem
22. gem 'emblem-rails'
23. No more </>{{}}
24. API
25. Ember Data is beta!
26. Ember Data is beta undocumented
27. Here be dragons
28. gem 'active_model_serializers'
29. gem 'ember-rails'
30. class CatsController < ApplicationController! def index! render json: Cat.all! end! end
31. class CatSerializer < ActiveModel::Serializer! embed :ids, include: true! attributes :id, :name! ! has_many :pictures! end
32. {! "cats": [! {! "id": 1,! "name": "Mimi",! "picture_ids": [! 2, 3! ]! },! {! "id": 2,! "name": "Sammie",! "picture_ids": [! 2, 3! ]! }! ],! "pictures": [! {! "id": 2,! "url": "http://s3-eu-west-1.amazonaws.com/catstagram-pics/2.png"! },! {! "id": 3,! "url": "http://s3-eu-west-1.amazonaws.com/catstagram-pics/3.png"! }! ]! }
33. Catstagram.Cat = DS.Model.extend! name: DS.attr()! pictures: DS.hasMany('picture')
34. Use the defaults and you’ll love Ember Data
35. Testing Ember with Rails
36. Testing Ember is hard
37. gem 'konacha'
39. Mocha is nicer than Qunit
40. Use Sinon and mock a lot
41. #= require 'sinon'! #= require 'application'! ! mocha.ui('bdd')! mocha.globals(['Ember', 'DS', 'Catstagram', 'MD5'])! mocha.timeout(5)! chai.Assertion.includeStack = true! ! ENV = {! TESTING: true! }! ! window.server = sinon.fakeServer.create()! ! window.testHelper =! lookup: (object, object_name) ->! name = object_name || "main"! Catstagram.__container__.lookup(object + ":" + name)! ! Catstagram.Router.reopen! location: 'none'! ! Konacha.reset = Ember.K! ! Catstagram.setupForTesting()! Catstagram.injectTestHelpers()! ! beforeEach ->! Ember.run ->! Catstagram.reset()! ! Ember.Test.adapter = Ember.Test.Adapter.create()
42. #= require 'spec_helper'! ! describe 'Cats page', ->! beforeEach ->! cat = Ember.Object.create! id: 1! name: 'Mimi'! ! stubStore = sinon.stub(testHelper.lookup('store'), 'find')! stubStore.withArgs('cat').returns([cat])! ! ! visit '/'! ! it 'shows the names of the cats', ->! expect($('li').text()).to.equal('Mimi')! ! it 'links to a cat page', ->! mock = sinon.mock(testHelper.lookup('route', 'cats_cat'))! mock.expects('setupController').once()! $('a').click()! mock.verify()
43. Summary
44. Ember is pretty cool
45. Rails provides some useful tools
46. Stick to the defaults
47. ember-rails is your friend
48. Questions? ! !
49. Ember on Rails Tom Kruijsen Utrecht.rb - 2014-02-03