s16 cours

16. Concevoir une application avec Redux 16.1. Qu'est-ce que Redux ? En 2013, Facebook a dit que AngularJS de Google est lent et lourd, donc en cette annéelà, il a introduit ReactJS à la communauté des développeurs. Pour le ReactJS était seulement une bibliothèque pour créer des Component et rendre ces Component sur l'interface. Le ReactJS n'avait pas la capacité de gérer l'état des applications. Peu de temps après, Facebook a introduit une bibliothèque Javascript nommé Flux pour gérer l'état des applications et elle est une bibliothèque créée pour soutenir le React.

En ce temps-là, Dan Abramov a étudié le Flux de Facebook et le langage ELM. Il était influencé par l'architecture ELM, et a trouvé la complexité de Flux. En mai 2015 Dan Abramov a annoncé une nouvelle bibliothèque appelée Redux, elle est basée sur l'architecture de ELM et éliminé la complexité de Flux.

Après sa naissance, le Redux a suscité un vif écho et a immédiatement attiré l'attention de la communauté React et même Facebook a également invité Dan Abramov à travailler. Actuellement, le Redux et le Flux existent en parallèle, mais le Redux est populaire et plus largement utilisé.

16.2. L'architecture de Flux L'architecture de Flux était introduit pour la première fois par Bill Fisher et Jing Chen à la conférence Facebook F8 en 2014. L'idée est redéfini le modèle MVVM (Model View View Model) qui était largement utilisé auparavant avec le concept de "flux de données unidirectionnel" (unidirectional data flow).

Des actions (actions) et des événements (events) dans le Flux vont passer par un "circuit fermé" avec la forme ci-dessous :

Les parties dans l'architecture de FLUX : VIEW : une composition hiérarchique (hierarchical composition) des React Component. ACTION : Est un objet pur créé pour stocker les informations relatives à un événement de l'utilisateur (Clique sur l'interface,..), il comprend les informations telles que : type de l'action, temps et location, ses coordonnées et quel state qu'il vise à changer.

DISPATCHER : Le seul point de l'application à recevoir des objets Action à gérer. STORE : Store écoute des Action, gère des données et l'état de l'application. Les Store basent sur les objets action pour répondre au USER INTERFACE correspondant.