React

Introduction to React

React was developed by Facebook in 2011 and has quickly become the world's most popular front-end javascript framework. The library is based around creating re-usable components that contain both markup (HTML) and logic (Javascript). By combining both HTML and Javascript into the same files React makes it easier to create more complex web applications than having HTML, CSS and Javascript seperate.

Definition

A JavaScript library for building user interfaces. – reactjs.org

React properties

  • Declarative: We tell React how we want the application to behave, while React translates this into working HTML, CSS and JS.
  • Composable, Reusable and Scalable: We can combine encapsulated components to build complex UIs similar to building with legos.

Advantages of using React

  • Faster user interfaces: Optimising performance by minimising DOM operations to update UI
  • Declarative property of React makes the code more predictable and debugging easier
  • Reusable components

How to use this tutorial

We would like to note that this tutorial is not an in-depth tutorial like the previous HTML, CSS and JS parts are. Instead, we highlight the most important parts of the official React documentation and guide you to other online resources that we found useful to understanding React. We will start off by highlighting React concepts, then, later on, we will recommend guides that you should follow along to start building React applications.

You are free to learn React in any way you please. If you prefer gaining a theoretical understanding before starting with the practical exercises, we recommend that you follow this tutorial. If you prefer learning by doing, feel free to start off with some of the exercises and then go back to the documentation later.

In the next lesson you will learn about some terms that are specific to React.