Data Structure
Networking
RDBMS
Operating System
Java
MS Excel
iOS
HTML
CSS
Android
Python
C Programming
C++
C#
MongoDB
MySQL
Javascript
PHP
Physics
Chemistry
Biology
Mathematics
English
Economics
Psychology
Social Studies
Fashion Studies
Legal Studies
- Selected Reading
- UPSC IAS Exams Notes
- Developer's Best Practices
- Questions and Answers
- Effective Resume Writing
- HR Interview Questions
- Computer Glossary
- Who is Who
What are Architecture Flux Components in JavaScript?
If you've been keeping up with the JavaScript world in the last few years, you've probably heard of the concept of a "flux" architecture. In a nutshell, flux is a pattern for managing data flow in applications. It was originally designed for use with React, but it can be used with any other JavaScript framework.
There are a few different ways to implement flux, but they all share a few key components−
Dispatcher − This is a central object that is responsible for managing all data flow in the application. All updates start with the dispatcher.
Stores − These are objects that contain the application data. They can be thought of as models, but they also have the ability to emit change events.
Views − These are the React components that make up the user interface. They listen for change events from the stores and update themselves accordingly.
In this tutorial, we're going to take a closer look at each of these components and see how they work together.
The Dispatcher
The dispatcher is the central hub of a flux application. It is responsible for managing all data flow. All updates start with the dispatcher.
A dispatcher is a singleton object, meaning there is only one instance of it in the application. It is also an event emitter. When an action occurs, the dispatcher emits an event with the action type and any relevant data.
The dispatcher broadcasts these events to the stores, which then update themselves accordingly. The views listen for change events from the stores and update themselves as well.
Stores
Stores are objects that contain the application data. They can be thought of as models, but they also have the ability to emit change events.
When a store receives an action from the dispatcher, it can choose to update itself accordingly. Once it has updated its data, it emits a change event.
The views listen for these change events and update themselves as well.
Views
Views are the React components that make up the user interface. They listen for change events from the stores and update themselves accordingly.
In a flux application, all updates start with the dispatcher. The dispatcher emits an event with the action type and any relevant data. The stores receive these events and update themselves accordingly. Once the stores have updated their data, they emit change events. The views listen for these change events and update themselves as well.
Conclusion
Flux is a pattern for managing data flow in applications. It was originally designed for use with React, but it can be used with any other JavaScript framework.
There are a few different ways to implement flux, but they all share a few key components: a dispatcher, stores, and views.
The dispatcher is the central hub of a flux application. It is responsible for managing all data flow. All updates start with the dispatcher.
Stores are objects that contain the application data. They can be thought of as models, but they also have the ability to emit change events.
Views are the React components that make up the user interface. They listen for change events from the stores and update themselves accordingly.
276 Views
