Intro to Ember.js

I've spent the last couple days going through coding examples with Ember.js as an attempt to expand my framework horizons.

Past Work

I developed several AngularJS applications for work; when I started Topophile I wanted to write without a framework with the hope that I'd learn why I might actually want a JS framework. The Topophile model builder is an application using file-based modules for services and interfaces in the application. A small amount of discipline in organizing the code kept things reasonable. The biggest problem I encountered near the end was the organization of callbacks between the lead application module and the many service modules. Using an event system would have tidied that up. I missed the build and deploy tools that had been developed by other engineers on past Angular apps, but not enough to set them up myself.

At that point, something like Angular seem to be good grounds for convention with a team, but didn't seem to be bringing a lot of value for the complexity choosing and configuring elements (scopes turned into dumping groups, directive configs were pound until they work) or the twitchiness of the digest cycle.

Why Try It?

Without having developed in Ember.js, it was attractive to me for several reasons:

  • from prior reading, they've worked hard to evolve their framework without abandoning their past (looking at Angular 2)
  • they've assemble a full single-page-application stack and configured it to work and deploy out-of-the-box (Ember CLI).
  • they seem to have a considered data modeling system, Ember Data. Having lived through several of these, I'm glad to see the design of this one.

First Impressions

Now spending some effort to get to know the framework, I've continued to be pleased.

  • The official documentation is pretty decent.
  • I've had no problem finding good community discussions.
  • Ember is all ES6, so learning to use ember is also a chance to learn and use more ES6 faetures. Explicit Namespaces are the best.
  • For the future, there seems to be good work in distributing isolated components. I'm hesitant of the devil-may-care npm inclusion I've experienced in other apps, but I appreciate people are creating utilities for ember. Django has been strong that way.

So far I've gone through two tutorials, the emberjs.com Super Rentals Tutorial which introduces us the basics of Ember CLI, test-driven development in ember, and all the boxes in a How-This-Works sort of diagram.

Next I went through the yoember Library Tutorial which offered a lot if you followed it, read links, and did the homework. The author spent some time showing different styles of control and evolved between them. Having a discussion about controller vs controller-less design both taught me more about ember and helped me as I read other apps.

Having made it through the tutorials and riffed on each a bit, I'm very impressed with the toolchain Ember.js has pulled together, especially testing and deployment. It's nice to have them out of the box.

Conceptual Work

My biggest conceptual challenge starting off was with the Ember router. I'm used to routers being pattern matchers and not much more, the examples I've seen put some controller logic there as well. I have no strong opinion about this, just noted my reaction to it.

The organization preferred in the tutorials: route (sets the model) -> template (runs the model -> model (has the logic) / component (has combined logic and sub-template) way of doing things seemed strange to me, but after working through it a couple times it fit in my head.

I've heard some complaints about handlebars, it's not my favorite but I've had plenty of displeasure dealing with in-DOM templates in Angular. I think I don't like JS templates.

Next Steps

For next steps:

  • I want to read / think / experiment with the Ember.Object class. Their extended javascript object is core and seems like something to understand better.
  • I could consider re-writing the topophile front-end in ember. When first playing with a tutorial Service, topophile's wrapper modules came straight to mind. I'd also enjoy the growth opportunity for writing tests as I port the code.
  • For another project in the background, I need to learn more about adapters connecting to API servers, either I'll be writing a JSON API endpoint for this project, or learning what it might take to write my own RESTy Ember Data adapter.
  • Read more of the discourse app, and find other examples of large ember application.
  • Thinking about other CRUD apps I did some light searching and found ember-cp-validations which I liked and will play with. I've not notice a straight out form library component, I wonder if there is one worth trying.