Questions tagged [reactjs-flux]

Flux is the application architecture that Facebook uses for building client-side web applications with React. It complements React's composable view components by utilizing a unidirectional data flow.

Flux is the application architecture that Facebook uses for building client-side web applications with React. It complements React's composable view components by utilizing a unidirectional data flow.

Flux applications have three major parts: the dispatcher(s), the store(s), and the view(s) (React components).

Flux eschews MVC in favor of a unidirectional data flow. When a user interacts with a React view, the view propagates an action through a central dispatcher, to the various stores that hold the application's data and business logic, which updates all of the views that are affected. This works especially well with React's declarative programming style, which allows the store to send updates without specifying how to transition views between states.

###Some popular implementations of Flux


Related tags

822 questions
51
votes
8 answers

Automatic redirect after login with react-router

I wanted to build a Facebook login into my react/react-router/flux application. I have a listener registered on the login event and would like to redirect the user to '/dashboard' if they are logged in. How can I do that? location.push didn't work…
Daniel Schmidt
  • 11,605
  • 5
  • 38
  • 70
49
votes
2 answers

Redux: Opinions/examples of how to do backend persistence?

I am wondering how folks using Redux are approaching their backend persistence. Particularly, are you storing the "actions" in a database or are you only storing the last known state of the application? If you are storing the actions, are you…
Lee
  • 503
  • 1
  • 4
  • 4
46
votes
6 answers

How to structure Redux components/containers

I’m using redux and I’m not sure about how to organize my components, I think the best is to keep them in folders with the name of the main component as the name of the folder and all inner components inside: components Common/ things like…
Franco Risso
  • 1,572
  • 2
  • 13
  • 18
45
votes
5 answers

When to use .toJS() with Immutable.js and Flux?

I'm trying to use ImmutableJS with my React / Flux application. My stores are Immutable.Map objects. I'm wondering at which point should I use .toJS() ? Should it be when the store's .get(id) returns ? or in the components with .get('member') ?
chollier
  • 912
  • 1
  • 7
  • 8
43
votes
6 answers

Pass object through Link in react router

Is it possible to pass an object via Link component in react-router? Something like: Click In the same way as I would pass props from the Parent to Child component. If it's not possible what is the best…
knowbody
  • 8,106
  • 6
  • 45
  • 70
43
votes
2 answers

In Flux architecture, how do you manage client side routing / url states?

As a follow up to the Store lifecycle question, In a typical web app its nice to have a shortcut to the current application state via the URL so you can re-visit that state and use the forward and back buttons to move between states. With Flux we…
krs
  • 4,096
  • 19
  • 22
41
votes
6 answers

Flux+React vs Backbone+React

What are the advantages of Flux+React over Backbone+React. Are there any performance differences in addition to the code development ease for a huge complex code base. What if we have a 1:1 relation between the model and a react view in a…
Student
  • 4,481
  • 8
  • 27
  • 32
38
votes
2 answers

Flux best practices: Stores dispatching actions, AJAX calls in Web API Utils?

I understand that this image has been the ultimate guide of most, if not all, Flux programmers. Having this flow in mind, I have a few questions: Is it correct/highly advisable to have all of my $.ajax calls inside my Web API Utils? Callbacks…
ton
  • 1,143
  • 3
  • 13
  • 34
32
votes
2 answers

Test a React Component function with Jest

Original First of all, I am following the Flux architecture. I have an indicator that shows a number of seconds, ex: 30 seconds. Every one second it shows 1 second less, so 29, 28, 27 till 0. When arrives to 0, I clear the interval so it stops…
Ferran Negre
  • 3,712
  • 3
  • 34
  • 56
31
votes
1 answer

From AngularJS to Flux - The React Way

As a developer with good hands-on AngularJS experience, how do I adjust my mental model of writing web apps in Flux using React? I'm not looking for a Flux+React vs Angular answer (already plenty of that online), but I would like to know what are…
pilau
  • 6,635
  • 4
  • 56
  • 69
30
votes
4 answers

Two-way data binding (Angular) vs one-way data flow (React/Flux)

In the last week, I’ve been trying to make sense how two-way data binding (Angular) and one-way data flow (React/Flux) are different. They say that one-way data flow is more powerful and easier to understand and follow: it is deterministic and helps…
Glenn Mohammad
  • 3,871
  • 4
  • 36
  • 45
30
votes
1 answer

How does react-router pass params to other components via props?

Thus far, the extent of my knowledge about how properties are passed from one component to another via parameters is as follows //start: extent of my knowledge Suppose there exists some state variable called topic in A.jsx. I want to pass this down…
thetrystero
  • 5,622
  • 5
  • 23
  • 34
30
votes
2 answers

How do you manage asynchronous Store operations with Flux?

In the Facebook talk on the Flux architecture, Jing mentions at 12:17 that the dispatcher enforces that no actions can be dispatched until the current action is fully processed by the stores. The dispatcher here is the main piece that enforces…
Michelle Tilley
  • 157,729
  • 40
  • 374
  • 311
25
votes
4 answers

React + Flux - should store data be stored in a component state, or props?

If that the flux store is a singleton that maintains the state of the data why do the components use setState and not setProps when accessing the stores? Wouldn't it just mean that I started saving the application state in two (or more) places? Both…
Guy Nesher
  • 1,385
  • 2
  • 14
  • 26
24
votes
4 answers

Reactjs: Key undefined when accessed as a prop

Tools: Reactjs 0.14.0 Vanilla Flux I need unique identifiers for 2 reasons: Child Reconciliation Keeping track of what child was clicked So let's say I have a list of messages that looks like this: [ { id: 1241241234, // <-----The…
Nick Pineda
  • 6,354
  • 11
  • 46
  • 66
1
2
3
54 55