A roadmap to learn React. Personal choices.
Tags: react, javascript, beginners
Published: 2019-10-04 21:28:38

---
title: A roadmap to learn React. Personal choices.
published: true
description: A list of curated videos to learn React
tags: react, javascript, beginner
cover_image: https://thepracticaldev.s3.amazonaws.com/i/a7krhog6ftrt7zmyg6cp.jpg
---

# Another list?

Yes! In case you are working for some time with React or even consider yourself "fluent" in React, probably nothing here will be new to you neither stunning. However it's a good path for beginners.

## Why I've decided to create this list?

At the time of writing this post, I work in CodeMiner42 and we have in mind that no one born ready. Miners are encouraged to pursuit the knowledge abroad of their comfort zone and evolve beyond their limits.

These courses/videos helped during my learning process. So basically that is the criteria of choice.

## Why not entirely free courses and links?

In CodeMiner42, we have access to Frontend Masters and Egghead.io. This websites have a great variety of quality content. This boost provided by our company is amazing. Thanks ❤️
Also we have many lists in the internet that use only free resources. Since this started inside our environment. I decided to use the weapons I was given.

I will not explain each topic because this is part of your learning path. Understanding why and where you can, or should, use these is a good way to keep improving your knowledge.

## Javascript

- [Learn JavaScript fundamentals and functional programming techniques to write modern, professional JavaScript!](https://frontendmasters.com/courses/js-fundamentals-functional-v2/)
- [Learn ES6 (ECMAScript 2015) from @johnlindquist on @eggheadio](https://egghead.io/courses/learn-es6-ecmascript-2015)

## React

- Good Start, trully begginer's guide [React Tutorial for Beginners with Kent C. Dodds on egghead.io](https://egghead.io/courses/the-beginner-s-guide-to-react)
- This one is a little bit more advanced: [Advanced React Tutorial with Kent C. Dodds on egghead.io](https://egghead.io/courses/advanced-react-component-patterns)

## React Routes

- [Add routing to React apps using React Router v4 from @joemaddalone on @eggheadio](https://egghead.io/courses/add-routing-to-react-apps-using-react-router-v4)
- [React Router Tutorial | React For Beginners](https://www.youtube.com/watch?v=Law7wfdg_ls)
- [React Router: Declarative Routing for React.js](https://reacttraining.com/react-router/web/guides/quick-start)

## Redux

This two links should be watched in the sequence as linked here:

- [Redux Tutorial by Dan Abramov on egghead.io](https://egghead.io/courses/getting-started-with-redux)
- [Building React Applications with Idiomatic Redux from @dan_abramov on @eggheadio](https://egghead.io/courses/building-react-applications-with-idiomatic-redux)
- [Redux For Beginners | React Redux Tutorial](https://www.youtube.com/watch?v=CVpUuw9XSjY)

## Testing

Actually we have two major libs for testing react components. Enzyme and react-testing-library.

- This first link show some good to know concepts for unit testing. Not specifically for React. [Learn Testing Practices and Principles with Kent C. Dodds](https://frontendmasters.com/courses/testing-practices-principles/)
- [React Testing Cookbook from @trevordmiller on @eggheadio](https://egghead.io/courses/react-testing-cookbook)
- This one is more like a walkthrough the react-testing-library. [Understanding how react-testing-library works with Kent C. Dodds from @jhooks on @eggheadio](https://egghead.io/lessons/react-understanding-how-react-testing-library-works-with-kent-c-dodds)
- This course has also Integration tests using cypress.[Learn to Test React Applications with Jest, react-testing-library and Cypress](https://frontendmasters.com/courses/testing-react/)

## Hooks

- [React Hooks Tutorial by Kent C. Dodds on egghead.io](https://egghead.io/courses/simplify-react-apps-with-react-hooks)
- [Reusable State and Effects with React Hooks from @elijahmanor on @eggheadio](https://egghead.io/courses/reusable-state-and-effects-with-react-hooks)

## React In General

This section brings to us courses not only with basic React, but also other libraries commonly used alongside.

- [Build A React App With Redux from @avanslaars on @eggheadio](https://egghead.io/courses/build-a-react-app-with-redux)
- [Learn React Using Hooks to Build Real-World Applications with Brian Holt](https://frontendmasters.com/courses/complete-react-v5/)
- This is a path to follow and has some courses that were listed in other topics. [React.js Learning Path – Be Productive with React.js, Today's Most Popular Framework](https://frontendmasters.com/learn/react/)

## Webpack


- [Use Webpack 2 for Production JavaScript Applications from @kentcdodds on @eggheadio](https://egghead.io/courses/use-webpack-2-for-production-javascript-applications)

- [Webpack Tutorial - Replace Gulp/Grunt plugins with a single tool
](https://www.youtube.com/watch?v=9kJVYpOqcVU)

## Show your skills

Creating projects is a really good way to put in practice what you've learned. Here is a list of ideas:

- Todo list: it's widely used as a first app, but you can add improved features pushing yourself
- Pomodoro App
- RSS reader
- Some idea consuming publics API, eg: Github, weather, currencies, cryptocurrencies.

Last but not least, put all this on the Github. Don't be afraid to show your code, even this not being the best. You are learning and you will evolve. People don't have a present without a past.

Share the content which you used to learn React. Since this is not a free-list only, share also paid content. This can help people decide if the content is worth.