Let’s pretend the top-level App component holds the user object in state. Here’s an example from Twitter, with all the avatars highlighted: Sooner or later you run into a situation where a top-level container has some data, and a child 4+ levels down needs that data. Data flows down and up through these wires, but the wires can’t be run through thin air – they have to be chained from one component to the next. You can think of the data like electricity, connected by colored wires to the components that care about it. The count, stored in App’s state, would be passed down as a prop:įor data to come back up the tree, it needs to flow through a callback function, so that callback function must first be passed down to any components that want to call it to pass data up. Data is passed down the component tree via props. If you’ve used React for more than a few minutes, you probably know about props and one-way data flow. There was an error submitting your subscription.
REDUX REACTJS FREE
I also put it together into a 5-day free course! (it’s a pretty long tutorial, so it makes sense to spread it out)
I’ve got an in-depth React tutorial that covers all the important stuff you need to know. Learning them both at the same time is a surefire recipe for confusion. Understand props, state, and one-way data flow, and learn to “think in React” before trying to learn Redux. Redux is an add-on to React.Įven if you intend on using them both, I super strongly recommend learning only React without Redux initially. React can be used on its own without Redux. Start simple and add complexity when and where you need it. Lots of global state, with interactions between disconnected parts of the app? Or a big app that will only get bigger over time? Give Redux a try. You can do that with classes, Hooks, or both.Ī bit more complex, with a few “global” things that need to be shared across the app? The Context API might be perfect for you. Super simple? Only a few bits of state in one or two places? Local component state will probably be great. But whether or not it makes sense for your app… well, it depends. The short answer: Even with plenty of alternatives, Redux is not dead yet. It’s especially valid, in 2020, to wonder… should you still use Redux? Is there something better out now, with Hooks or Context or some other library?
Or, keep reading! The tutorial below covers everything in the video and then some. This parallels the first part of this tutorial, where we’ll take a plain React app and add Redux to it one piece at a time.
0 kommentar(er)
