React.js First Attempt

You’ve heard about this UI library called React and want to see what it’s about. Or maybe someone told you to come here. Either way, I’ll try my best to show you React. This guide assumes some familiarity with HTML, CSS, and JavaScript.

Follow me on Instagram

React.js is a JavaScript library for building user interfaces, built by top engineers at Facebook in 2013, and then released as an open-source project.

React is a JavaScript library, but is often mistakenly referred to as a framework. Like many popular frameworks (Bootstrap, for example), React is all about reusable components.

React gives you a template language and some function hooks to essentially render HTML. That’s all React outputs, HTML. Your bundles of HTML / Javascript, called “components”, are allowed things like storing their own internal state in memory (such as which tab is selected in a tab view), but in the end you just barf out HTML.

Oh look, your first exercise!

This guide assumes some familiarity with HTML, CSS, and JavaScript. Knowing what closures are and how “this” works in JavaScript will help but you’ll learn React regardless.

To setup React on your site, visit the official Getting Started page. This tutorial will jump right into how to use React.

Exercise: Hello

Should I Use React?

Short answer: yes.

Summary

React.js makes building UI simpler than ever. Facebook’s React library is a JavaScript library for building high performance User Interfaces. As they like to say, it’s the just “V” in MVC. Better yet, it’s not a framework. What that means is that React isn’t interested in how you handle your data, routing or business logic.

Follow me on Github

Subscribe to my Youtube Channel