From 6b1fd7d984bf1e62d0fe7fac4f56d7d191b535e0 Mon Sep 17 00:00:00 2001 From: Dan Abramov Date: Fri, 2 Nov 2018 17:32:01 +0000 Subject: [PATCH] Custom Hooks => Building Your Own Hooks (#1364) --- content/docs/hooks-custom.md | 2 +- content/docs/hooks-intro.md | 2 +- content/docs/hooks-overview.md | 6 +++--- content/docs/hooks-rules.md | 4 ++-- content/docs/nav.yml | 2 +- 5 files changed, 8 insertions(+), 8 deletions(-) diff --git a/content/docs/hooks-custom.md b/content/docs/hooks-custom.md index e399e64a..72a2a6c3 100644 --- a/content/docs/hooks-custom.md +++ b/content/docs/hooks-custom.md @@ -1,6 +1,6 @@ --- id: hooks-custom -title: Writing Custom Hooks +title: Building Your Own Hooks permalink: docs/hooks-custom.html next: hooks-reference.html prev: hooks-rules.html diff --git a/content/docs/hooks-intro.md b/content/docs/hooks-intro.md index 0d66a44d..6fe4c04e 100644 --- a/content/docs/hooks-intro.md +++ b/content/docs/hooks-intro.md @@ -61,7 +61,7 @@ React doesn't offer a way to "attach" reusable behavior to a component (for exam With Hooks, you can extract stateful logic from a component so it can be tested independently and reused. **Hooks allow you to reuse stateful logic without changing your component hierarchy.** This makes it easy to share Hooks among many components or with the community. -We'll discuss this more in [Writing Custom Hooks](/docs/hooks-custom.html). +We'll discuss this more in [Building Your Own Hooks](/docs/hooks-custom.html). ### Complex components become hard to understand diff --git a/content/docs/hooks-overview.md b/content/docs/hooks-overview.md index b02fe942..72911888 100644 --- a/content/docs/hooks-overview.md +++ b/content/docs/hooks-overview.md @@ -64,7 +64,7 @@ The [array destructuring](https://developer.mozilla.org/en-US/docs/Web/JavaScrip Hooks are functions that let you “hook into” React state and lifecycle features from function components. Hooks don't work inside classes -- they let you use React without classes. (We [don't recommend](/docs/hooks-intro.html#gradual-adoption-strategy) rewriting your existing components overnight but you can start using Hooks in the new ones if you'd like.) -React provides a few built-in Hooks like `useState`. You can also create custom Hooks to reuse stateful behavior between different components. We'll look at the built-in Hooks first. +React provides a few built-in Hooks like `useState`. You can also create your own Hooks to reuse stateful behavior between different components. We'll look at the built-in Hooks first. >Detailed Explanation > @@ -174,7 +174,7 @@ We provide a [linter plugin](https://www.npmjs.com/package/eslint-plugin-react-h > >You can learn more about these rules on a dedicated page: [Rules of Hooks](/docs/hooks-rules.html). -## 💡 Custom Hooks +## 💡 Building Your Own Hooks Sometimes, we want to reuse some stateful logic between components. Traditionally, there were two popular solutions to this problem: [higher-order components](/docs/higher-order-components.html) and [render props](/docs/render-props.html). Custom Hooks let you do this, but without adding more components to your tree. @@ -239,7 +239,7 @@ You can write custom Hooks that cover a wide range of use cases like form handli >Detailed Explanation > ->You can learn more about custom Hooks on a dedicated page: [Writing Custom Hooks](/docs/hooks-custom.html). +>You can learn more about custom Hooks on a dedicated page: [Building Your Own Hooks](/docs/hooks-custom.html). ## 🔌 Other Hooks diff --git a/content/docs/hooks-rules.md b/content/docs/hooks-rules.md index 039a3f9a..731f619a 100644 --- a/content/docs/hooks-rules.md +++ b/content/docs/hooks-rules.md @@ -47,7 +47,7 @@ npm install eslint-plugin-react-hooks@next In the future, we intend to include this plugin by default into Create React App and similar toolkits. -**You can skip to the next page explaining how to write [custom Hooks](/docs/hooks-custom.html) now.** On this page, we'll continue by explaining the reasoning behind these rules. +**You can skip to the next page explaining how to write [your own Hooks](/docs/hooks-custom.html) now.** On this page, we'll continue by explaining the reasoning behind these rules. ## Explanation @@ -134,4 +134,4 @@ React wouldn't know what to return for the second `useState` Hook call. React ex ## Next Steps -Finally, we're ready to learn about [writing custom Hooks](/docs/hooks-custom.html)! Custom Hooks let you combine Hooks provided by React into your own abstractions, and reuse common stateful logic between different components. +Finally, we're ready to learn about [writing your own Hooks](/docs/hooks-custom.html)! Custom Hooks let you combine Hooks provided by React into your own abstractions, and reuse common stateful logic between different components. diff --git a/content/docs/nav.yml b/content/docs/nav.yml index ca66618b..e9fdcb94 100644 --- a/content/docs/nav.yml +++ b/content/docs/nav.yml @@ -118,7 +118,7 @@ - id: hooks-rules title: Rules of Hooks - id: hooks-custom - title: Writing Custom Hooks + title: Building Your Own Hooks - id: hooks-reference title: Hooks API Reference - id: hooks-faq