Ember without Ember Data

Question

Ember data is still not at version 1.0 and thus I decided to use Ember without Data models.

I have my own models, and those are created by the route model function.

However maintaining state between the frontend objects and the backend objects is a nightmare. Especially when one route uses another routes models.

• How can this be achieved, should I write my own store and model find method?
• Should I use Ember Data (even though it's not at version 1.0 ?) perhaps an ETA on Ember Data 1.0 ?
• write code to update the models on the frontend each time I change a model?
• Another method?

Is what I'm doing best practices or should I be doing it differently? My gut feeling is that without using Ember Data I should write my own store. I'd love to get feedback from some of you guys.

Example of a model:

App.Person = Ember.Object.extend(App.Serializable,Em.Copyable,{
  user_email : null //used in routing dynamic segements and as old email when making changes to email
  ,first_name: null
  , last_name: null
  , fullname : function () {
    return this.first_name + ' ' + this.last_name;
  }.property('first_name','last_name').cacheable()
};

App.Person.reopenClass({
  createRecord: function(data) {
    return App.Person.create({
      user_email : data.email
      , first_name: data.first_name
      , last_name : data.last_name
}});

Example of how I load the class models:

App.UsersRoute = App.AuthenticatedRoute.extend( {
  model : function () {
    return new Ember.RSVP.Promise(function(resolve, reject) {
      $.getJSON('/users').then(function(usersData) {
        var userObjects = [];
          usersData.forEach(function (data) {
            userObjects.pushObject(App.Person.createRecord(data));
          });
        resolve( userObjects);
        },function(error) {
          reject(error);
      });
    })
  },

Subroutes use the model:

App.UsersAvailableRoute = App.AuthenticatedRoute.extend( {
     model : function () {
        return {
          allUsers :  Ember.ArrayController.create({
            content : this.modelFor('users').filter( function (user) {
                      return user.availablity === 100
                      }),

Example of how I update the model in a controller:

App.UsersAvailableController = Ember.ArrayController.extend({
needs : ['users']
    ,applyPersonAssign : function (person,need,project) {
          need.set('allocated',person);
          var updateObject = Ember.copy(project,true);
          if (Ember.isEmpty(need.get('inProject'))) {
            updateObject.projectNeeds.pushObject(need);
          }

          return $.ajax({
            url: '/projects/' + updateObject.get('codename'),
            "type": "PUT",
            "dataType": "json",
            data: updateObject.serialize()
          })

Answer 1

If you're familiar with Ruby, Rails is a great solution for a backend.

The ember community has support for rails with the ember-rails gem which lets you use rails as a means to serve JSON.

Getting started

• Add the gem to your application Gemfile:

  gem 'ember-rails' gem 'ember-source', '~> 1.9.0' # or the version you need

• Run bundle install

• Next, generate the application structure:

  rails generate ember:bootstrap

• Restart your server (if it's running)

Building a new project from scratch

Rails supports the ability to build projects from a template source ruby file.

To build an Ember centric Rails project you can simply type the following into your command line:

rails new my_app -m http://emberjs.com/edge_template.rb

To install the latest builds of ember and ember-data. It should be noted that the examples in the getting started guide have been designed to use the released version of ember:

rails generate ember:install

Then all you need to do is render json in your controllers, like this

class ProjectsController < ApplicationController
    def index
        respond_to do |format|
            format.json { render json: Project.all }
        end
    end

    def show
        respond_to do |format|
            format.json { render json: Project.where(name: params[:name])}
        end
    end
end

make sure to update your serializers

class ProjectSerializer < ApplicationSerializer
  attributes :id, :name, :description, :imgUrl, :deployUrl
end 

setup your routes

EmberRailsBlog.ProjectsRoute = Ember.Route.extend({
    model: function(){
        return this.store.find('project');
    }
});

and finally your model

var attr = DS.attr;

EmberRailsBlog.Project = DS.Model.extend({
    name: attr(),
    description: attr(),
    imgUrl: attr(),
    deployUrl: attr()
});