Upload
others
View
7
Download
0
Embed Size (px)
Citation preview
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