EmberEmber.js Source: AirPair Angular.js - Backbone.js - Ember.js Source: AirPair Title PowerPoint...

A framework for creatingambitious

web application

Ember.js

À propos

• Créé par Yehuda Katz en 2011

• Framework d'application web côté client.

• MVC modèle architectural

• Conçu pour les SPA (Single Page Application)

Conception

• Modèles• Routeur• Contrôleurs• Vues• Composants• Templates• Helpers

(Router)

Handlebars(gestion

templates)

(Ember-Data)

Source: CodeProject

Modèles/Ember-Data/Store

• Modèle : stocker les données de l’application (persistance)

• Ember-Data : une couche d’abstraction de stockage de donnés, une librairie séparée pour faciliter l’utilisation des modèles.

• DS.Store : gestion des modèles (création, suppression, recherche…)

Modèles/Ember-Data/Store

Routeur/Routes

• Le Routeur : un synopsis de toutes les routes

• Route : – la version URL des objets de l’application– appeler le modèle, via le hook model, pour qu’il

soit accessible dans les contrôleurs et templates

– mettre à jour les contrôleurs

Routeur/Routes

Contrôleurs

• Récupérer le modèle d’une route

• Faire le pont entre le modèle et la vue ou le template

• Représentation des modèles– 1 seul modèle : ObjectController– Plusieurs modèles : ArrayController

Contrôleurs

Vues

• Encapsuler les templates, combiner les templates et les données

• Répondre aux évènements créés par l’utilisateur

• Associée à un Contrôleur, un Template et une Route

Vues

Composants

• Une vue complètement isolée, qui n’a pas d’accès au contexte dans lequel il est appelé

• Excellent moyen pour créer un élément personnalisé et réutilisable

Templates/Handlebars

• Template : la partie HTML d’une vue

• Handlebars : une librairie de gestion des templates utilisée par l’équipe Ember

• Différence d’une vue?

Templates/Handlebars

Avantages et Inconvénients

• Avantages:- Documentation simple à comprendre - Performant- Structuré

• Inconvénients:- Lourde- La communauté d'utilisateur n'est pas très grand- Convention

Angular.js - Backbone.js -Ember.js

Angular.jsSize: 39,5 kB

Backbone.js43.5 kB (JQuery + Underscore)

20.6 kB (Septo + Underscore)

Ember.js136.2 kB (jQuery + Handlebars)

Angular.js - Backbone.js -Ember.js

Source: AirPair

Angular.js - Backbone.js -Ember.js

Source: AirPair