The ability to reply to discussions is limited to PRO members. Want to join in the discussion? Click here to subscribe now.

React Flux: Actions

React Flux: Actions

4:37
Actions contain no functionality, but rather describe an event in our application. In this lesson we will describe our Actions as they relate to our application. These Actions will then be available for triggering in our Views and for execution in our Store.
Watch this lesson now
Avatar
egghead.io

Actions contain no functionality, but rather describe an event in our application. In this lesson we will describe our Actions as they relate to our application. These Actions will then be available for triggering in our Views and for execution in our Store.

Avatar
Sean Coonce

What's the best way to scale app-actions.js as your app becomes more and more complex? Is it suitable to simply append all of your apps actions to what could become a potentially massive file?

Avatar
Joel

What's the best way to scale app-actions.js as your app becomes more and more complex? Is it suitable to simply append all of your apps actions to what could become a potentially massive file?

I'm not an expert, but as I see it, you are dividing your application up into many small applications, so each would have actions that corresponded to the functionality of the individual module.

Perhaps Flux gives a better idea about this in practice.

In reply to Sean Coonce
Avatar
Gabriel

It's important to remember, that this Lesson use the 'react/lib/merge', and this lib 'll be deprecated on the next version of React, if you want to keep your code up to date, run the following line in your terminal (make sure to execute this inside your project directory):
npm install object-assign --save

After that, replace this:
var merge = require('react/lib/merge');

for this:
var assign = require('object-assign');

And, everywhere that you use the 'merge', you replace with 'assign';

Avatar
Omer

I used the dispatcher from Facebook’s Chat Example to build the dispatcher and it should look like this now:

var Dispatcher = require('flux').Dispatcher;
var assign = require('object-assign');
var AppDispatcher = assign(new Dispatcher, {
handleViewAction: function(action){
console.log('action', action);
this.dispatch({
source: 'VIEW_ACTION',
action:action
})
}
});

module.exports = AppDispatcher;

Avatar
Christopher

be sure to:
npm install flux --save

if you use this dispatcher

In reply to Omer
Avatar
Christopher

Thanks for these corrections! They work!

In reply to Omer
Avatar
Sean Inglis

Thanks for this Gabriel - spent a bit of time blundering around in the source tree

I've been manually following the videos as a way of bumping up my React muscle memory so haven't benefitted from any corrections in the downloadable source.

In reply to Gabriel
Avatar
Lachlan

Thanks mate appreciate it.

In reply to Gabriel
Avatar
Cyrus

Thanks for posting this man! It really helped!

In reply to Omer
Avatar
Alexius Wronka

I need to create and add users to a MongoDB with react. Will this tutorial help?

HEY, QUICK QUESTION!
Joel's Head
Why are we asking?