4 Benefits to Learning React

Table of Contents

• The Basics of React
• 4 Reasons to Learn React
• The Downsides of React
• Is React Right For You?

Should you learn React? Sabio coding bootcamp graduate Sara Inés Calderón uses React every day in her engineering role at Musx in Austin. Here, Sara shares her four top benefits for learning React (plus a couple of inevitable drawbacks), and how you can use React in your own development projects.

HTML in Javascript. Virtual DOM. Component lifecycles. What are they, what do they mean — what in the heck is ReactJS? When I first started learning React, the concept of HTML-in-Javascript seemed cool, but that was all I really knew about this latest buzz-addled Javascript framework.

In the ensuing year, I’ve not only built multiple applications in React and React Native, I’m also currently the Lead Front End/React Native Engineer at a music startup in Austin, Texas. I’ve learned all sorts of things about React since I started down this snazzy path, and so I wanted to share some thoughts on why I think you might benefit from joining me.

The Basics of React

What is React?

React is a front end JavaScript library used to build user interfaces like real-time search or navigation menus. React was first deployed in 2011 by its creator, Facebook engineer Jordan Walke. React is still maintained by Facebook.

If you’re looking for examples, React is obviously used by Facebook and Instagram, as well as other websites like Airbnb, Coursera, Dropbox, eBay, Expedia, Netflix, The New York Times, and Reddit. In 2017, Stack Overflow’s Developer Hiring Trends Survey saw a huge increase in demand for React developers.

What is React Native?

React Native is used for building cross-platform mobile apps using JavaScript and React, rather than building individual native apps for iOS and Android using Swift/Objective-C and Java.

React Native can combine with native modules written in Swift, Objective-C, and Java, so programmers have the option to build part of an app in React Native, and part of it in native code.

4 Reasons to Learn React

1. React expands your reach to mobile.

I learned React for web first, then transitioned to React Native. That transition from React to React Native wasn’t as daunting as I had anticipated. The real challenges were the concepts of web vs. mobile that I found difficult, specifically things like styling, routing/navigating, setup, design, etc. That is to say, the way you design/build a website is very different from a mobile site. The technology itself was not the big barrier.

So, if you think you might want to do a bit of mobile development one day, React is a great place to start.

2. You learn ES6 & Vanilla Javascript.

JavaScript libraries are convenient and powerful, but they hide a lot of JavaScript behind the magic of a library. Vanilla JavaScript refers to JavaScript without the use of libraries (aka “plain” JavaScript).

I learned more ES6 (a version of JavaScript) and Vanilla JavaScript doing React than I did Angular. When you use React, everything is in Vanilla JavaScript, instead of some framework version of the language (like, for example, when you use jQuery to avoid browser incompatibility, you may be missing out on a better understanding of these concepts). React also gives you a lot of freedom to build a wide range of functionality and customization into your apps. Working in this framework helped me understand all sorts of Javascript concepts that simply weren’t getting into my head while I was using other frameworks.

3. React saves you time.

Efficiency requires writing self-contained pieces of code that work within the larger code set. And in my experience with JavaScript frameworks, nothing makes you work efficiently like React does. Since you’re literally already working with a bunch of components that communicate with each other, it’s easy to write utility functions or other services in this vein, too. So this architectural pattern is something you can take with you to other frameworks and libraries. In other words, React's modular approach allows you to change a component once, and it will change in every place it exists across the site, rather than having to change it for each individual instance.

4. You can use any technology with React.

React is super flexible in terms of how it renders a view, so you can use this library with basically any other framework of your choosing. For example, many developers will use Node.js with React to utilize server-side rendering. It gives you the flexibility to write awesomely fast and clean code while using any other technologies that your project calls for.

The Downsides of React

Of course, there are downsides! There are drawbacks and tradeoffs to every programming language. Because React is an open source JavaScript framework, you end up having to use a ton of other tools/dependencies just to get your app going. I never had to delve so deep into workflow tools like Gulp, webpack, and Grunt, for example, until I started using React. Then you’ll need your ES6 compiler (like Babel). And you probably want some dev dependencies, so you’ll need a logger perhaps?

You get the idea. React developers end up with a long list of dependencies that need to be manually tracked and added to a dev environment. Whereas in other frameworks like Angular, these tools come standard and you may not have to stop and think about them.

One of the most common complaints about React is that it doesn’t quite handle State, so you’ll need to use some state management tool (ie. Redux, Flux, or MobX). One thing I do sorely miss about Angular is how lovely it is to not to have to stop and think about managing your state before you do literally anything. On the other hand, that also gives developers the flexibility to create a cool, fast, custom app.

Is React Right For You?

In short, React is popular with employers, can expand your skillset into mobile (always a plus), will help you dive under the hood to learn more Vanilla JavaScript, and gives you the flexibility to build a fast, custom technology. Weigh the pros and cons of React, and if you have any questions, feel free to leave a comment or follow up with me on Twitter @SaraChicaD.

FURTHER READING

• React vs Angular
• React Native vs iOS/Android
• Node.js: An Intro for Beginners

Find out more and read Sabio reviews on Course Report. Check out the Sabio website.