Using EmberJS without routing

1

Is it possible to use Ember without the routing component? Basically, does Ember force you to develop at a site level or can you make small, reusable components that can be mixed and matched wherever necessary. I’m evaluating some frontend frameworks and this would be a nice feature to have.

I’ve played around with React a little and one of the nice things is that you can attach Components to pretty much anything. They’re allowed to be used independent of a site level architecture.

Angular kind of lets you do this. You can inline your controllers, but you still need to bootstrap the Angular digestion machine. I enjoy Angular and I’ve successfully built a couple sites with it, but I get the sinking feeling it’s not the right way to solve the sorts of problems we face on the web today.

Can we use Ember piecemeal or does it have to be all or nothing?

Thanks.

2

@Montlebalm I’ve been wondering something similar recently and the conclusion is that the current code base is designed to solve the big problem of building ambitious web applications. In the future, the framework might provide an easy out of the box way to build small widgets that can run outside of app, but this is not the current priority.

With that said, because Ember does so much for you, you could essentially build a widget without using routing. Here is minimul code that you need to get output to the screen:

App = Ember.Application.create();

<script type="text/x-handlebars">
    <h2>Ember.js Widget</h2>
    This is a widget that loads data from a template. You could do other things here.
</script>

From here, with little code you could load data that you can present in your widget.

App.ApplicationRoute = Ember.Route.extend({
  model: function() {
      return Em.$.getJSON('http://example.com/posts.json')
  }
});

To present this data in your widget

<script type="text/x-handlebars">
    <h2>Ember.js Widget</h2>
    <ul>
    {{#each}}
       <li>
       <a href="{{unbound url}}">{{title}}</a>
       </li>
    {{/each}}
    </ul>
</script>

As you can see, with every little code, you can have something that functions as a widget, pulls data from external source. You can also use Ember Components here which would allow you to accomplish even more with little code.

3

@Montlebalm, yes, you can use Ember without routing but in this case you would have to do wiring between views and controllers by yourself.

4

Sorry for the necro-post, but I’m wondering if you could expand on this. I have a page where I would like to show a dropdown list of categories, but the categories themselves are not a navigable collection so it doesn’t make sense to have a route for them.

1 Like