Update Ember syntax (#1704)

It has been a while since Ember has moved away from views to components :)

ember.md

@@ -7,68 +7,65 @@ category: JavaScript libraries
 
 ### Routes
 
-    App.Router.map(function() {
+    Router.map(function() {
-      this.resource('trips', function() {
+      this.route('trips', function() {
-          this.route('item', { path: '/:trip_id' });
+          this.route('item', { path: '/:tripId' });
       });
 
       this.route('upcoming');
-      this.route('about', { path: '/about' });
+      this.route('about', { path: '/aboutus' });
       this.route('schedules');
       this.route('history');
-      this.route('post');
+      this.route('post', { path: '/post/:postId' });
     });
 
 ### A route
 
-    App.IndexRoute = Ember.Route.extend({
+    import Route from '@ember/routing/route';
-      setupController: function(controller) {
-        controller.set('title', 'my app');
-        // <h1>{{title}}</h1>
-      },
     
-      setupController: function(controller, model) {
+    export default PostRoute extends Route {
-        controller.set("model", model);
+      model({ postId }) {
-        this.controllerFor('topPost').set('model', model);
+        // Post will be accessible as `this.model` in the controller
-      },
+        // or `{{@model}}` in the template.
-
+        return this.store.find('post', postId);
-      model: function(params) {
-        return this.store.find('posts');
-        return this.store.find('post', params.post_id);
-      },
-      
-      serialize: function(model) {
-        // this will make the URL `/posts/foo-post`
-        return { post_slug: model.get('slug') };
       }
-    });
+    }
 
-### View
+### Component
     
-    App.InfoView = Ember.View.extend({
+    import Component from '@glimmer/component';
-      templateName: 'input',  /* optional */
+    import { tracked } from '@glimmer/tracking';
     
-      fooName: "Hello"  /* {{ view.fooName }} */
+    export default PostEditor extends Component {
+      @tracked title;
      
-      click: function(e) {
+      get fullTitle() {
-        "I was clicked";
+        return `Post: ${title}`;
       }
       
-    });
+      titleUpdate(event) {
+        this.title = event.target.value;
+      }
+    }
 
-### markup
+### Template
 
-    <img {{bindAttr src="avatarURL"}}>
+    <div ...attributes>
-    <button {{action follow}}>
+        <label for="title">Title</label>
+        <input
+            id="title"
+            value={{@post.title}}
+            {{on 'input' this.updateTitle}}
+        />
 
-Value binding:
+        <p>
+            {{this.fullTitle}}
+        </p>
+    </div>
 
-    {{view Ember.TextField class="input block" valuebinding="emailAddresses"}}
+Invoking the component:
 
-Actions:
+    <PostEditor class='my-post' @post={{@model}} />
 
-    <button {{action invite emailAddresses}}>Invite></button>
-
-    <a href="#" {{action set "isEditingContacts" true target="view"}} 
 
 {% endraw %}