How This Book Is Structured

What's the point of React?

Lesson 0 - Object Elements

Lesson 1 - Element Factory

Lesson 2 - JSX

Lesson 3 - Nested Elements

Lesson 4 - Components

Lesson 5 - Props

Lesson 6 - Prop Types

Lesson 7 - Nested Components

Lesson 8 - Class Components

Lesson 9 - Lifecycle Methods

Lesson 10 - Example App

Lesson 11 - More Lifecycle Methods

Lesson 12 - Refactoring Components

Lesson 14 - Refs

Lesson 15 - Simple Integration

Lesson 16 - Advanced Integration

Lesson 18 - ES215

Virtual DOM Primer

Changelog

A gentle introduction to React, using the JavaScript you already know

React from Zero

 we learned about in the last chapter, allow us to use another feature of React: 

These are methods of a component class with special names that are called on specific events. We can think of them as event handlers.

In this lesson we will learn about the two most important lifecycle methods:

The first method that is used very often in React apps is 

. If we define it in our component class, React will call it right after the first time our 

 method was called. The name means that the component was mounted into the DOM.

The most important use-cases for this method are:

var AsyncHelloWorld = createReactClass({
  getInitialState: function() {
    return { data: null };
  },

# Lesson 9 - Lifecycle Methods

The **class components** we learned about in the last chapter, allow us to use another feature of React: **lifecycle methods**

These are methods of a component class with special names that are called on specific events. We can think of them as event handlers.

In this lesson we will learn about the two most important lifecycle methods:

-   `componentDidMount()` and
-   `componentWillUnmount()`

.

## The `componentDidMount()` Method

The first method that is used very often in React apps is `componentDidMount()`. If we define it in our component class, React will call it right after the first time our `render()` method was called. The name means that the component was mounted into the DOM.

The most important use-cases for this method are:

-   fetching asynchronous data
-   setting up event listeners

Here's an example:

```javascript
var AsyncHelloWorld = createReactClass({
  getInitialState: function() {
    return { data: null };
  },