Ember Views For Dummies

The concept of view in Ember was unfamiliar to me for a long time until I watched Justin Giancola’s presentation.
So, what is a view in Ember? I’ll tell you because you had it coming!

What you see is all about views

Hey, Mr Canny, IT IS obvious, isn’t it? Uh-oh, right, but the description in Ember guides is kind of without the vital and practical example.

And the truth is, each and every Handlebars template ends up being rendered as a view whether you like it or not. By default Ember does it implicitly for you. Wanna proof?

This outermost Ember Application template: (whether you need it or not)

<script type="text/x-handlebars">
    <h1>My App</h1>
</script>

Will be rendered implicitly more or like it as:

<div id="ember160" class="ember-view">
    <h1>My App</h1>
</div>

As I said, you can change it explicitly with a little effort:

App.ApplicationView = Ember.View.extend({
    elementId: 'wrapper',
    classNames: ['foo', 'bar', 'baz']
});

And the result:

<div id="wrapper" class="ember-view foo bar baz">
    <h1>My App</h1>
</div>

To sum it up: all you see on a page and all you interact with is an explicit or implicit Ember view. Whether you like it or not. :)