Aprendizaje Migrando a EmberJS

Enlaces de Interés

  • Algunos RFCs para leer y entender los contextos y trasfondos

¿Cómo es que todo se enlaza?

  • Una ruta en app/router.js
  • Si necesita traer datos externos, un enrutador (o route handler) en app/routes/archivo.js
  • Un template en app/templates/archivo.hbs
  • ¿Por qué?: Ver abajo en Relación de ruta y template
  • Un componente de presentación en app/components/componente.hbs
  • Si el componente tiene comportamiento, una clase en app/components/component.js

Relación de ruta y template

Según el generador ember generate route route-name:
  • route <name> <options...>
  •         Generates a route and a template, and registers the route with the router.

Lo que significa que una página/ruta se compone de:
  • Definición en app/router.js
  • Enrutador en app/routes/route-name-js
  • Template en app/templates/template-name.hbs

Y según los docs de EmberJS:
  • Now, when the user visits /about, Ember will render the about template. Visiting /favs will render the favorites template.

Más ejemplos de los docs:
Router.map(function() {
  this.route('blog-post', { path: '/blog-post' });
});

  • The route defined above will by default use the blog-post.js route handler, the blog-post.hbs template, and be referred to as blog-post in any <LinkTo /> components.

Ejemplo Página About

Ruta en router.js
Router.map(function() {
  this.route('about');
});

No necesita enrutador para traer datos o personalizar la carga.

Template en app/templates/about.hbs
<Jumbo>
  <h2>About Super Rentals</h2>
  <p>
    The Super Rentals website is a delightful project created to explore Ember.
    By building a property rental site, we can simultaneously imagine traveling
    AND building Ember applications.
  </p>