This course has been updated! We now recommend you take the Complete Intro to React, v6 course.

Check out a free preview of the full Complete Introduction to React (feat. Redux and React Router) course:
The "Default and Initial State" Lesson is part of the full, Complete Introduction to React (feat. Redux and React Router) course featured in this preview video. Here's what you'd learn in this lesson:

Redux reducers must always return a state. Brian adds a default case to the root reducer’s switch statement that will return the current state if no action is matched. He also uses the ES6 default parameter syntax to supply an initial state if none is passed to the reducer.

Get Unlimited Access Now

Transcript from the "Default and Initial State" Lesson

>> [MUSIC]

>> Brian Holt: Okay, so now we need a default, right. And the reason that we need a default is basically, this reducer must return state, and redux depending on it to return state no matter what. So what happens if another action gets fired that this root reducer doesn't recognize? Well, if you don't return anything, it blows away everything, because you're gonna call a function, it's gonna return undefined, right.

[00:00:28] So you must return something. So you're gonna say basically return state, right.
>> Brian Holt: Otherwise, if you don't return state, then everything gets blown away and people die and stuff like that.
>> Brian Holt: Okay, does that makes sense? Now, what we want to be able to do, is we also wanna be able to initialize our state as well.

[00:00:57] Cuz right now, when this gets initialized, it actually does call your root reducer once to initialize the state. So what we want to be able to do is, we actually want to have an initial state if nothing else happens. So let's create an initial state. We're gonna say, const initialState equals search term colon empty string.

[00:01:19] And this is gonna give us what our initial state we want it to look like. And what you can do here, which is kind of fun. Have you heard of like a default parameters from the ES6 before? So you can actually say, initialState here, and it says, if state is undefined, make it this.

[00:01:40] Or in other words if no state, state = initialState. Same diff.
>> Brian Holt: Or, if you prefer, state = state || initialState. That's equivalent to this is equivalent to this.
>> Brian Holt: Okay, but let's just go ahead and make it just that top one.
>> Brian Holt: Okay, any questions about that?

>> Brian Holt: It still doesn't work yet, cuz we have to do a bunch of other stuff. But that's the heavy lifting part of Redux. Everything else is just getting it to play nicely with React. But that's essentially Redux in about, like, that's it, that's really all there is to Redux.

[00:02:36] So it's actually pretty simple. It's pretty small. Well, I guess you actually have to create the store, so that const store is equal to redux. Put this up a little bit. redux.createStore and you just pass in your root reducer.
>> Brian Holt: That's it [LAUGH]. However, I want you to take note of something that's kind of interesting about Redux.

[00:03:04] Notice I only called the Redux is actually right there. Everything else is just pure JavaScript. I think that's pretty cool, right. Cuz then Redux is not getting in the way. There's not really a ton to learn about it. It's just all JavaScript programming, and then Redux just steps into kind of help you marshal that about.

[00:03:22] There's actually a gist out there that I don't know where it is, but you can actually see all of Redux implemented in 80 lines. It's really small. Now, they actually do some like optimizations for you. So the library itself is a little bit larger. But the basic bare bones of Redux is only like 80 lines of code.

[00:03:44] And I'll definitely tell you to go watch Dan Abramov's video on Egghead, because you actually write Redux with him, and it's pretty cool.