Upload
xebia-france
View
143
Download
2
Embed Size (px)
Citation preview
@florentduveau#fluxdevoxx2015
Flux, l’architecture de Facebook
@florentduveau
Développeur chez Xebia
Un peu d’histoire…
« Celui qui ne sait pas d’où il vient ne peut savoir où il va » - Google
Quand j’étais petit (2005)
Ce que je faisais au quotidien avec Spring
2012
Comment gérer l’état de l’application ?
Backbone
Architecture = un bon gros bordel
MVC ? MVP ? MV????
AngularMVC ? MVVM ? MVW???
Architecture = un bon gros bordel
ReactLibrairie Javascript pour construire des composants
Flux : Qui ? Quand ? Comment ? Pourquoi ?
2011 - Palo Alto - Equipe de développement du chat
Comment garder la cohérence de l’état ?
Surtout sur la notification des messages non lus !!!
Architecture initiale
problème !
La bonne idée
F L U X
F L U X
F L U X
Les avantages :
•C’est simple (workflow unidirectionnel)
•Séparation entre les données et l’état de la vue
•Debug & Tests Unitaires simplifiés
F L U XL’implémentation
var Dispatcher = { _callbacks : { },
register: function (callback) {… return id;} // Ajout callback au catalogue unregister: function (id) {…} // Suppression callback du catalogue dispatch: function (action) {…} // Emission action aux callbacks waitFor: function (ids) {…} // Attente d’autres callbacks avant execution … });
Le DISPATCHER
F L U X
4 Composants Des évènements
F L U XPourquoi s’y intéresser ?
•Enfin une réponse concrète aux problématiques d’architecture front
•Une réponse apportée suite à un problème réel (Chat de Facebook)
•Architecture orientée évènements, générique et hautement « customisable »
F L U XLa foire aux frameworks
RefluxJS
Fluxy delorean
@YourTwitterHandle@YourTwitterHandle@florentduveau#fluxdevoxx2015
Q & A