diff --git a/content/docs/components-and-props.md b/content/docs/components-and-props.md index bf809706d..0fd66045b 100644 --- a/content/docs/components-and-props.md +++ b/content/docs/components-and-props.md @@ -16,7 +16,7 @@ prev: rendering-elements.html next: state-and-lifecycle.html --- -Components let you split the UI into independent, reusable pieces, and think about each piece in isolation. +Components let you split the UI into independent, reusable pieces, and think about each piece in isolation. This page provides an introduction to the idea of components. You can find a [detailed component API reference here](/docs/react-component.html). Conceptually, components are like JavaScript functions. They accept arbitrary inputs (called "props") and return React elements describing what should appear on the screen. diff --git a/content/docs/reference-react-component.md b/content/docs/reference-react-component.md index 883e6261c..efbe29455 100644 --- a/content/docs/reference-react-component.md +++ b/content/docs/reference-react-component.md @@ -15,7 +15,7 @@ redirect_from: - "tips/use-react-with-other-libraries.html" --- -[Components](/docs/components-and-props.html) let you split the UI into independent, reusable pieces, and think about each piece in isolation. React provides a `React.Component` base class to let you define encapsulated components that may contain [local state and handle lifecycle events](/docs/state-and-lifecycle.html). +This page contains a detailed API reference for the React component class definition. It assumes you're familiar with fundamental React concepts, such as [Components and Props](/docs/components-and-props.html), as well as [State and Lifecycle](/docs/state-and-lifecycle.html). If you're not, read them first. ## Overview diff --git a/content/docs/state-and-lifecycle.md b/content/docs/state-and-lifecycle.md index ff09a8031..9ad98b643 100644 --- a/content/docs/state-and-lifecycle.md +++ b/content/docs/state-and-lifecycle.md @@ -7,11 +7,9 @@ prev: components-and-props.html next: handling-events.html --- -Consider the ticking clock example from [one of the previous sections](/docs/rendering-elements.html#updating-the-rendered-element). +This page introduces the concept of state and lifecycle in a React component. You can find a [detailed component API reference here](/docs/react-component.html). -So far we have only learned one way to update the UI. - -We call `ReactDOM.render()` to change the rendered output: +Consider the ticking clock example from [one of the previous sections](/docs/rendering-elements.html#updating-the-rendered-element). In [Rendering Elements](/docs/rendering-elements.html#rendering-an-element-into-the-dom), we have only learned one way to update the UI. We call `ReactDOM.render()` to change the rendered output: ```js{8-11} function tick() {