React Concept Overview

React (pronounced “re-akt”) is a declarative and flexible JavaScript library created by Facebook for building user interfaces (UI).  It is a library as opposed to a full-fledged framework (like Angular or Ember).  The basic building blocks in React are called components.  Components define views, which are sets of screen elements that React can choose among and modify according to your program logic and data. Components use properties and state (data) to provide specific functionality to the views.  Although React can be used to build interfaces for many different platforms including web browsers, native mobile devices, virtual reality (VR), we’ll focus primarily on how to use React for the web browsers in the course.

In the traditional Model-View-Controller (MVC) paradigm, React focuses mainly on the “View” (user interface).  For this reason, React doesn’t require a framework to use in order for it to be useful and functional.  Since all you’re building are mostly components (think of a weather widget), it can be inserted into any existing web page.  But you can also create an entire single page application (SPA) using React as well.  The flexibility is almost endless.

Components

Every React application is made up of components, lots of them.  Components connect other components forming a hierarchy with the page document object model (DOM). Each component defines a class that contains application data and logic, and is associated with a render function that contains the HTML template that defines a view (UI) to be displayed in a target environment.  That’s a mouthful but it will become clear in the weeks ahead as we begin coding in React.