3 THINGS YOU NEED TO KNOW When Starting With React

3 THINGS YOU NEED TO KNOW When Starting With React

Grégory D'Angelo's photo
Grégory D'Angelo
·

5 min read

The purpose of this article is to show you 3 things you need to know when starting with ReactJS. If I would have known these 3 things from the very beginning, I would have been much more effective with React a lot sooner and progress a lot faster.

So if you are just starting with ReactJS, or want to learn it, keep reading as I'll give you the tips to get you started quickly and effectively.

Get Really Good at JavaScript

The first thing you need to know before learning React is JavaScript. Indeed, the great thing about React is that it is "just" a JavaScript library. So the more you know about JavaScript the better you'll get at writing applications with React.

It is really important you master and become comfortable with JavaScript fundamentals as you'll be much more productive with React.

A common mistake a lot of people tend to do is to start learning React before having a solid JavaScript programming foundation. So please don't do this mistake yourself.

First, get really good at JavaScript. Otherwise, you'll quickly be overwhelmed by everything you'll have to learn alongside React and you'll probably quit before you even realize how awesome it is to work with React. So, build that solid foundation if you want to really focus on getting the most out of React.

For this, I suggest reading my blog post 10 JavaScript Concepts You Should Learn To Master React. Also, you may want to check out Eloquent JavaScript by Marijn Haverbeke. This is an excellent book about JavaScript that you can read online here (for free). Finally, you should consider the following online courses by Wes Bos: JavaScript30 (free), Beginner JavaScript, or ES6 for Everyone.

I've also included an entire lesson for you to learn Modern JavaScript with ES6 in the first part of the Become a React Developer course. Check this out, it is totally free!

Modern JavaScript with ES6

Focus on Only React

The second thing is focusing on learning only ReactJS. You need to start by understanding the three main design principles (Declarative Programming, Composition of Components, and Unidirectional Data Flow) that makes React unique, from the very beginning. That's gonna make a huge difference in your learning curve.

What is React?

Besides that, you don't need any extra 3rd party library or tool to start with React. The React API is pretty small and surprisingly simple. Actually, there are only two methods necessary to build a React application. One for creating React elements, and another one for rendering those elements.

The most simple app you can make only consists of the index.html file with the React dependencies. 

<html lang="en">
  <head>
    <title>React App</title>
  </head>
  <body>
    <div id="root"></div>
    <script src="https://unpkg.com/react@16/umd/react.development.js" crossorigin></script>
    <script src="https://unpkg.com/react-dom@16/umd/react-dom.development.js" crossorigin></script>
    <script type="text/javascript">
      var title = React.createElement("h1", null, "Hello, World!");
      ReactDOM.render(title, document.getElementById("root"));
    </script>
  </body>
</html>

Once again, you don't need to learn and configure any build tools to get you started. You can even use create-react-app to set up your React application by running one command without having to configure anything. 

npx create-react-app my-app

Unfortunately, a lot of online resources for beginners includes a bunch of tools, and make learning React more complicated than it is. That's why I've created the Become a React Developer course. It starts from the ground up all the way through becoming a React Developer. You'll learn everything you need to master React steps-by-steps.

Get Your Hands Dirty

There is no better way to learn something new, especially when it comes to learning a new programming language or a new library than building things. I really believe that it is the only way to grasp a concept and make the most out of your time.

You can watch hours of video content on Youtube, but if you don't practice early on, you won't learn anything from it.

Build (a lot of) things and start as early as possible in your learning journey.

This is also valid with learning ReactJS. Just put in the work and you will get better over time. But don't just follow steps-by-steps training materials and reproduce what the instructor is doing. Build React applications by yourself from scratch. You'll learn so much more this way. You can start with something simple and go from there to build more complex applications.

For example, from the very first part of the Become a React Developer course, you will build a Kanban-style app inspired by the popular Trello application all by yourself.

react-trello.png

So, practice, practice, and practice!

Conclusion

The purpose of this article was to give you the keys to getting started with ReactJS. By now, you should have an idea about what you should learn and focus on from the very beginning.

The most important points to remember are:

  • Get really good at JavaScript and modern JS to excel at building React applications
  • Focus on only React so you don't get lost with too much to learn at once
  • Build things from the very beginning to practice your newly acquired skills

If you enjoyed the article, consider sharing it so more people can benefit from it! Also, feel free to follow @AlterClassIO on Twitter and join our Discord server.

ReactJavaScriptFrontend DevelopmentWeb DevelopmentES6