What you need to know to get started with React

Introduction

Welcome to the React.JS course. Before diving into the technical nitty-gritty of React, let’s talk a little bit about the history of this popular JavaScript library.

In 2013, React.JS was introduced by Facebook, as a JavaScript library for creating and managing complex user interfaces. It does this by breaking up the interface into independent, composable and reusable chunks of code called Components, which have their own private memory (called the State). Components can be rendered inside the Browser, in the server or through a mobile app (when using React Native) depending on the choice and requirements of the application.

On top of that, React uses a Declarative programming style and abstracts all of the DOM manipulation methods away from us. Creating DOM elements, adding Event Listeners and updating the DOM accordingly can be done in a simpler and much easier fashion in contrast to the standard JavaScript DOM API.

Learning Objectives

  • How to build a react component.
  • How to render a react component.
  • What is Babel? Why do we need it?
  • functional component vs class components
  • What is props
  • what is state, why do we need a state? and how to update the state.
  • react lifecycle
  • nested react components.
  • what is jsx?
  • react virtual DOM.
  • How React components handle user events.
  • conditional Rendering.
  • One way binding concept.
  • revise import, export and classes concepts (es6 module)

Watch the selected part (up to 04:45) of this next video by Mosh Hamedani in which he talks about the history of React and the concepts of Components and the VirtualDOM.

React, Components and the VirtualDOM in a nutshell by Mosh Hamedani