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
4
votes
1 answer

How to handle save states in React/Flux?

I've been working with react/flux for a few weeks now and while I feel like I've got a pretty good handle on everything from async loading to updating props/states/etc, one thing that is still bothering me is how to handle save states. For example,…
Andrew Cross
  • 1,921
  • 2
  • 19
  • 32
4
votes
1 answer

Reusability/Scalability issues with react-flux app

The question: Is there any way to have a standard flux workflow - using Actions and Stores inside of a component and still be able to use this component for multiple different purposes, or if not is there any way to have complex nested structure in…
Chavdar Slavov
  • 865
  • 8
  • 22
4
votes
2 answers

Where should HTTP requests be initiated in Flux?

There is a plenty of discussion on how to communicate with external services in Flux. It is pretty clear that the basic workflow is to fire an HTTP request, which will eventually dispatch successful or failure action based on the response. You can…
4
votes
1 answer

Efficiently structuring large React.js applications with multiple views

I have a react application with multiple views (e.g. Profile, Followers). Each of those views currently lives as it's own React component that executes on both server side and client side. I'm starting to struggle understanding the proper way to…
Ryan
  • 2,650
  • 3
  • 29
  • 43
4
votes
1 answer

Flux architecture and backend

I am trying to build a simple webapp, just to learn something new and I've decided to learn react js. I have implemented some backend in java and spring, but I don't really know how to integrate it with flux architecure. Is it even possible or…
MaxP21
  • 41
  • 1
  • 2
4
votes
1 answer

How to avoid action chains

I'm trying to understand Flux pattern. I believe that in any good design the app should consist of relatively independent and universal (and thus reusable) components glued together by specific application logic. In Flux there are domain-specific…
sas18
  • 161
  • 11
4
votes
1 answer

Handling multiple instances of the same component in Flux

Take e.g. the Flux TodoMVC and suppose I want to have two Todo-Apps next to each other. class TwoTodos extends React.Component { render () { return (
); } } Now, when you…
Aton
  • 1,125
  • 8
  • 18
4
votes
1 answer

Is it common practice to grab store data from an action creator in flux?

In the flux architecture, is it common practice to grab data from a store in an action creator? If not, would that mean that it's better to pass all needed data for network calls in through the component params? I have an application that has a 3…
BJacobs
  • 122
  • 1
  • 8
4
votes
1 answer

React, Flux, React-Router Dispatch Error - Possible batchUpdates solution?

Alright so I'm stuck on an issue with reactjs, flux architecture, and react-router. I have the following routes (just a portion of the routes):
BryceHayden
  • 596
  • 1
  • 6
  • 13
4
votes
1 answer

Dependent Actions in Flux and React JS

I'm currently having an issue in our Flux app where a component needs to first fetch the current user, and, if and only if the current user is fetched, fetch that user's notifications using a different Ajax call, as below: _onCurrentUserChange:…
an1lam
  • 629
  • 8
  • 15
4
votes
1 answer

Flux+React.js - Caching API request responses

I need input from someone experienced with React+Flux+async API requests pattern. What will be the better way to cache api response in the following situation: I have 3 lists pages of articles each with corresponding API endpoint to fetch…
Kosmetika
  • 20,774
  • 37
  • 108
  • 172
4
votes
1 answer

Where is filter, sorting, and searching done? In the REST Client (Model) or Store?

I understand that flux is this: REST Client API Pushes data to Action Action Dispatcher Store But when filtering, sorting, and searching or aggregating data in anyway, how would one handle multiple data sets and make them available for all views…
Alex V
  • 18,176
  • 5
  • 36
  • 35
4
votes
1 answer

Is there a faster way to reset a mock when testing with Jest?

I'm writing some React/Flux code and using Jest to test it. So far it's been great, except my test are already taking a long time to complete. The culprit seems to be resetting the mocks in between each test. My general set up will look something…
Gregory Bell
  • 1,861
  • 1
  • 19
  • 21
4
votes
3 answers

ReactJS: Compare props and state on shouldComponentUpdate

I want to check all properties and state if they are changed, return true if any changed and make a base component for all my root components. I'm wondering if it won't be the best practice and make my components slow. Also, what I did always…
Guilherme David da Costa
  • 2,318
  • 4
  • 32
  • 46
4
votes
1 answer

Dispatcher not registering callbacks in jest unit tests

I'm writing unit tests for a store in a react+flux app. I followed the example of setting up the mock dispatcher here, and my unit test looks like this: jest.dontMock "../../app/scripts/stores/item_store.coffee" jest.dontMock…
johnnyutah
  • 685
  • 1
  • 7
  • 23