Video Tutorial: Building a React App - pt1: Introduction

Anybody interested in Javascript development has likely stumbled on MVC frameworks, a term that is pretty much going strong recently and defines a library built according to the “model - view - controller” design pattern. React.js is a Javascript library that acts as the “view” part of an MVC development workflow and it’s gaining popularity. Scrivito.com offers many video tutorials on React.js and this starting point is a quick dive into React’s basic functions.


Meet React.js

The basic concept of React is that you can inject HTML markup into a page using Javascript. The idea behind that simple concept is to build a web application by assembling React components instead of manipulating the existing DOM structure with numerous Javascript snippets. The big advantage of this approach becomes clear when you need to update a small part of the content and you don’t want, obviously, to reload the entire page and in general when your web application data interactions happens mainly in the browser.

How it works, at a glance

A React component provides an HTML structure that may include custom Javascript and CSS; once created we can call it wherever we want in our existing structure, therefore keeping the code well structured. React maintains a virtual DOM and can easily and quickly update it when data changes; old and new data are compared and only the additions are added to the virtual DOM, that is re-rendered into normal DOM. Without React all data manipulation has to be carefully managed by custom Javascript.

All those features make React an ideal choice for building web interfaces and can save us a lot of time and headaches. If this video tickled your fancy, check out this link to see more tutorials.

Ready to start? Create your free account now