Learn React with these resources

In this article, I share a list of the recommended resources that have helped me learn React.

Assumed Knowledge

Before starting with these resources you should have some experience with JavaScript. In particular, you should feel comfortable using ES6 syntax (eg. arrow functions and classes). Trying these resources before you are familiar with JavaScript will just frustrate you. If you feel that you are lacking some (or a lot of) knowledge I would recommend having a look at Learn JavaScript with these resources.

Getting started

Yes, React is taking over front-end development. The question is why. - Samer Buna

  • A nice introduction to React

Tutorial: Intro To React - Official Documentation

  • Learn React by example from the official documentation.
  • Make sure you do the improvements at the end! You are welcome to compare your solutions with mine.

Hello World - Official Documentation

  • Implement the example in Thinking in React on your own to see where your gaps are and then read the documentation from the beginning.
  • Come back to the advanced guide once you have a bit more practice with React.

Practice

Once you have completed the resources above I would recommend practising the concepts by starting a project of your own. It can be something similar to My Movies, which is a project I started for the same reason.

Testing

It can be a little overwhelming learning how to test before you have had any practice but that is not a reason to forget them altogether! A nice place to get started is the official Jest documentation, which is very well written.

React Testing Examples

Why I Never Use Shallow Rendering - Kent C. Dodds

  • This article helped reaffirm my opinions on front end testing

Additional resources

Once you start feeling more comfortable with React I would recommend having a look at the following resources.

React Status newsletter

  • Helps me keep up to date with React with weekly updates

Syntax Podcast - Wes Bos and Scott Tolinski

  • Helps me to keep up to date with what’s happening in web development with some episodes specific to React

TypeScript React Starter

  • This reference helped me get going with Typescript

The 100% correct way to structure a React app (or why there’s no such thing) - David Gilbertson

  • This article helped reaffirm my opinions on structuring a React app

React code style guide - Daniel Jauch on CSS-Tricks

  • Some handy tips on styling your React code

Timeline:

  • July 2018: First published
  • May 2019: Added Testing
  • June 2019: Updated Testing and Additional Resources

David

Thanks for visiting Learn it my way! I created this website so I could share my learning experiences as a self-taught software developer. Subscribe to for the latest content if this interests you!

Profile pic

David

Thanks for visiting Learn it my way! I created this website so I could share my learning experiences as a self-taught software developer. Subscribe to for the latest content if this interests you!