Gain insights into V15 React fundamentals, API work, code organization, testing, and state management. Discover hands-on skills by building a Hacker News App for your portfolio.

vuejs-sass.tar.gz

If you’re working with a legacy React codebase, then this course will prove useful. React has seen a great deal of change over the years, but there might be situations where you have to work with an older version.

In this course, you will learn the fundamentals of V15 React. You will learn how to work with an API, how to organize and test your code as well as how to give your React app state. Throughout this course, you will have hands-on experience building a fully functional Hacker News App. By the end of this course, you will be prepared to build your own applications and have something to showcase in your portfolio.

If you’re looking for the updated version of this course featuring V16, please visit The Road to React: The one with Hooks.

Nicole Ferguson

I’m doing Robin’s Road to Learn React course this weekend & I almost feel guilty for having so much fun.

 Web developer

Eric Priou

The Road to learn React by Robin Wieruch is a must read. Clean and concise for React and JavaScript.

Web developer

Nicholas Hunt-Walker

This is one of the most well-written & informative coding books I’ve ever worked through. A solid React & ES6 introduction.

Instructor at a Seattle Coding School

Andre Vargas

The Road to Learn React by Robin Wieruch is such an awesome book! Most of what I learned about React and even ES6 was through it!

Muhammad Kashif

I recommend this to any student or professional interested in learning react basics to advanced level. I have 17 years of experience in web and desktop app development, and before reading this I was having trouble in learning react. It works like magic.

The Road to React: The One with Class Components

### When do you need state management?
Previous chapters have shown you that state management can be a crucial topic in larger applications, as React and a lot of other SPA frameworks struggle with it. As applications get more complex, the big challenge in web applications is to tame and control the state.

### How React Makes State Management simple

Compared to other solutions, React has already taken a big step forward. A unidirectional data flow and a simple API to manage state in components is indispensable. These concepts make it easier to reason about your state and your state changes. It also makes it easier to reason about it on a component level and on an application level to a certain degree.

It is possible to introduce bugs by operating on stale state when using an object over a function in `setState()`. We lift state around to share or hide necessary state across components. Sometimes a component needs to lift up state, because its sibling component depends on it. Perhaps the component is far away in the component tree, so the stated needs to be shared across the whole component tree. Components are more involved in state management, as the main responsibility of components is representing the UI.

Because of this, there are standalone solutions to take care of state management. Libraries like [Redux](https://redux.js.org/introduction) or [MobX](https://mobx.js.org/) are both feasible solutions in a React application. They come with extensions, [react-redux](https://github.com/reactjs/react-redux) and [mobx-react](https://github.com/mobxjs/mobx-react), to integrate them into the React view layer. Redux and MobX are outside of the scope of this course, but I encourage you to study the different ways to handle scaling state management as your React applications become more complex.

### Further Reading:

- Read about [external state management and how to learn it](https://www.robinwieruch.de/redux-mobx-confusion/)
- Check out my second book about state management in React called [Taming the State in React](https://roadtoreact.com/)


# When do you need state management?
Previous chapters have shown you that state management can be a crucial topic in larger applications, as React and a lot of other SPA frameworks struggle with it. As applications get more complex, the big challenge in web applications is to tame and control the state.

# How React Makes State Management simple

Compared to other solutions, React has already taken a big step forward. A unidirectional data flow and a simple API to manage state in components is indispensable. These concepts make it easier to reason about your state and your state changes. It also makes it easier to reason about it on a component level and on an application level to a certain degree.

It is possible to introduce bugs by operating on stale state when using an object over a function in `setState()`. We lift state around to share or hide necessary state across components. Sometimes a component needs to lift up state, because its sibling component depends on it. Perhaps the component is far away in the component tree, so the stated needs to be shared across the whole component tree. Components are more involved in state management, as the main responsibility of components is representing the UI.

Because of this, there are standalone solutions to take care of state management. Libraries like [Redux](https://redux.js.org/introduction) or [MobX](https://mobx.js.org/) are both feasible solutions in a React application. They come with extensions, [react-redux](https://github.com/reactjs/react-redux) and [mobx-react](https://github.com/mobxjs/mobx-react), to integrate them into the React view layer. Redux and MobX are outside of the scope of this course, but I encourage you to study the different ways to handle scaling state management as your React applications become more complex.

# Further Reading:

- Read about [external state management and how to learn it](https://www.robinwieruch.de/redux-mobx-confusion/)
- Check out my second book about state management in React called [Taming the State in React](https://roadtoreact.com/)


In this lesson you learn why you would consider using a third-party state management library such as Redux or MobX. 

Taming the State

In this lesson you learn why you would consider using a third-party state management library such as Redux or MobX.

Introduction

Intro to React and some JavaScript Basics

Basics in React

Getting Real with an API

Code Organization and Testing

Advanced React Components

State Management in React and beyond

Final Steps to Production

Appendix: Bootstrapping your React App

Taming the State

When do you need state management?

How React Makes State Management simple