Join egghead, unlock knowledge.

Want more egghead? It's 45% off for a limited time only!

This lesson is for members. Join us? Get access to all 3,000+ tutorials + a community with expert developers around the world.

Unlock All Content for 45% Off

Already subscribed? Sign In

Save 45% for a limited time.

Get access to all courses and lessons on egghead today.

Autoplay

    Flux Architecture: Application Dispatcher

    Joe MaddaloneJoe Maddalone

    In this lesson we'll create a very simple application dispatcher utilizing the open source flux dispatcher from Facebook.

    reactReact
    0.14 - 16
    flux-architectureFlux
    Code

    Code

    Become a Member to view code

    You must be a Member to view code

    Access all courses and lessons, track your progress, gain confidence and expertise.

    Become a Member
    and unlock code for this lesson
    Transcript

    Transcript

    00:00 In this lesson, we're going to create a dispatcher for our Flux application. Now, we previously installed Flux to get the open-source dispatcher code from Facebook, so we're going to look right here in the lib directory at the Dispatcher.js file.

    00:15 For this application, all we're really concerned about -- and honestly, for most Flux applications -- is this method right here, "register," which just registers a callback in an object that the dispatcher's going to keep track off.

    00:27 The next one we're concerned about is "dispatch." Without diving too much into the code here, all it's really doing is preventing raise conditions, making sure that each dispatcher or callback is executed in the order that it's received.

    00:41 We could use the dispatcher directly, but what we're going to do is, create a new file called "AppDispatcher" right here in our dispatcher directory. We're just going to set up a facade around dispatcher. When you're creating your Flux application, it's important to have your distinct AppDispatcher separate from the Flux dispatcher, so that you can inject any logic you might need.

    01:04 For the purposes of our application, we just need a very simple facade over dispatchers. So we're going to import dispatcher from Flux. We're going to instantiate that as Flux = new Dispatcher. We're going to export a function called "register." That'll take in our callback, and return flux.register(callback).

    01:31 I'll export one more function called "dispatch," and that's going to take in an actionType. We'll talk more about that later. It's going to take in an action where it's going to call flux.dispatch(actionType, and action. That's all there is to it. We've created the dispatcher for our application.

    Discuss

    Discuss