Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Emberjs as a rails_developer

936 views

Published on

For "Firday Tech talks" @ JN Solutions (http://jnsolutions.com.au/)

Published in: Technology, Education
  • Be the first to comment

  • Be the first to like this

Emberjs as a rails_developer

  1. 1. Understanding As a Rails developer
  2. 2. Why client side JS frameworks? Rich user experience Persistence Best practices Much more..
  3. 3. Why ember...
  4. 4. Core Concepts Templates Views Models Controller Router
  5. 5. Templates Expressions, {{firstName}} Outlets, {{outlet}} Views, {{view}}
  6. 6. Views {{view Ember.TextField valueBinding='name' name='name' viewName='nameField'}}
  7. 7. Controllers App.TodosNewController = Ember.ObjectController.extend save: -> @content.save().then => @transitionToRoute 'todos.index' buttonTitle: 'Create' app/assets/javascripts/controllers/todos/newController.coffee
  8. 8. Models App.Todo = DS.Model.extend( name: DS.attr('string'') task: (-> "#{@get('name')}" ).property('name') ) DS.RESTAdapter
  9. 9. Router App.Router.map -> @resource 'todos', -> @route 'new' App.IndexRoute = Ember.Route.extend setupController: (controller, model) -> @controllerFor('application')
  10. 10. Naming conventions When your application boots, Ember will look for these objects: App.ApplicationRoute App.ApplicationController the application template
  11. 11. How it flows.. App.ApplicationRoute = Ember.Route.extend({ setupController: function(controller) { // `controller` is the instance of ApplicationController controller.set('title', "Hello world!"); } }); #router App.ApplicationController = Ember.Controller.extend({ appName: 'My First Example' }); #controller <!-- application template --> <h1>{{appName}}</h1> <h2>{{title}}</h2> #template (hbs)
  12. 12. Demo
  13. 13. Demo
  14. 14. Thanks http://emberjs.com/ http://reefpoints.dockyard.com/ember/2013/01/0 7/building-an-ember-app-with-rails-api-part-1. html http://railscasts.com/ http://blog.dcxn.com/2013/03/23/getting-startedwith-ember-js-on-rails/ http://www.cerebris.com/blog/2012/01/24/beginni ng-ember-js-on-rails-part-1/ Google.com

×