Henrique Alves
Henrique Alves@healves82

Dec 21, 2016

Before dive into React

I’m helping a few friends to get started with React but only the fundamentals. They don’t have any previous experience with front-end development.

If you’re already a front-end developer you may skip to What to learn in 2017 if you’re a frontend developer.

Asking the right question

How to make the right questions, when to ask them and what not to ask is important. Let’s say you’re not sure how to manage states and Google react state management. You can easily land on a post about stores and redux. This is going to make your head spin and overheat your brain.

In almost every conversation I tell them the follow:

Stop googling and reading everything about React.

The web is full of noise and outdated information as well. It’s easy to end up in the wrong place. Some of the tutorials may tell you how to setup Webpack. Nothing wrong here but you don’t need this information just yet.

Start from the basics. There are no shortcuts.

Some of the questions are not related with React at all. They’re classic JavaScript questions. Avoid shortcuts. They may look harmless in the beginning. In the medium and long run they confuse and scramble important concepts.

In all cases they asked about Redux.

No. You don’t need Redux, React Router, CSS Modules, Webpack or anything else to learn React.

At this point I already asked them to stop what they are doing and get back to the first base.

Getting familiar

If you’re not coming from a front-end development background you should get the basics. The subject becomes familiar and you know how to ask for directions.

Focus on the key concepts not details.

Mozilla Developer Network or MDN is a good place to start. I use it as main place to check any spec documentation about HTML, CSS or JavaScript.

Web and Browser

CSS

JavaScript

Bundlers

Tooling

Git and GitHub

  • Git flow
  • Create repositories on GitHub
  • What is a pull request
  • Clone a project from GitHub in your terminal with git clone
  • Pull, commit and push changes

Component design

Don’t get intimidated by this list.

Read. Experiment. Fail. Repeat. Keep going until you get it right.

It’s a solid foundation not only to learn React but any other web technology.

If there is anything else that should be in this list please ping me on Twitter.