From 90fa54985fd1165bfa5d56b86c27253c96957b9c Mon Sep 17 00:00:00 2001 From: Ediiik Date: Sat, 20 Jan 2018 23:29:21 +0100 Subject: [PATCH 001/170] Fix typo --- content/docs/static-type-checking.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/content/docs/static-type-checking.md b/content/docs/static-type-checking.md index 3436c4c43b..910dab5acc 100644 --- a/content/docs/static-type-checking.md +++ b/content/docs/static-type-checking.md @@ -2,7 +2,7 @@ id: static-type-checking title: Static Type Checking permalink: docs/static-type-checking.html -prev: typechecking-with-prototypes.html +prev: typechecking-with-proptypes.html next: refs-and-the-dom.html --- From 984abd2539119819608590ef68042ee404b56276 Mon Sep 17 00:00:00 2001 From: Edouard Alvard Date: Mon, 9 Jul 2018 16:34:33 +0200 Subject: [PATCH 002/170] Fix typo --- content/tutorial/tutorial.md | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/content/tutorial/tutorial.md b/content/tutorial/tutorial.md index 9a05232482..f09dda71c7 100644 --- a/content/tutorial/tutorial.md +++ b/content/tutorial/tutorial.md @@ -215,7 +215,7 @@ Congratulations! You've just "passed a prop" from a parent Board component to a ### Making an Interactive Component -Let's fill the Square component with an "X" when we click it. +Let's fill the Square component with an "X" when we click it. First, change the button tag that is returned from the Square component's `render()` function to this: ```javascript{4} @@ -605,7 +605,7 @@ We have changed `this.props` to `props` both times it appears. We now need to fix an obvious defect in our tic-tac-toe game: the "O"s cannot be marked on the board. -We'll set the the first move to be "X" by default. We can set this default by modifying the initial state in our Board constructor: +We'll set the first move to be "X" by default. We can set this default by modifying the initial state in our Board constructor: ```javascript{6} class Board extends React.Component { @@ -1003,7 +1003,7 @@ In JavaScript, arrays have a [`map()` method](https://developer.mozilla.org/en-U ```js const numbers = [1, 2, 3]; const doubled = numbers.map(x => x * 2); // [2, 4, 6] -``` +``` Using the `map` method, we can map our history of moves to React elements representing buttons on the screen, and display a list of buttons to "jump" to past moves. From a8e5cc424f7d798b101584fa55bdb406ff213856 Mon Sep 17 00:00:00 2001 From: Leigh Halliday Date: Thu, 25 Oct 2018 12:59:31 -0400 Subject: [PATCH 003/170] Fixing a small grammer mistake on the code-splitting page --- content/docs/code-splitting.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/content/docs/code-splitting.md b/content/docs/code-splitting.md index 132fa99a45..091ea3dd8e 100644 --- a/content/docs/code-splitting.md +++ b/content/docs/code-splitting.md @@ -117,7 +117,7 @@ parse the dynamic import syntax but is not transforming it. For that you will ne > > `React.lazy` and Suspense is not yet available for server-side rendering. If you want to do code-splitting in a server rendered app, we still recommend [React Loadable](https://github.com/thejameskyle/react-loadable). It has a nice [guide for bundle splitting with server-side rendering](https://github.com/thejameskyle/react-loadable#------------server-side-rendering). -The `React.lazy` function lets you render an dynamic import as a regular component. +The `React.lazy` function lets you render a dynamic import as a regular component. **Before:** From a531a0f89d7d8f227db17cf4c68276f8a16ef5be Mon Sep 17 00:00:00 2001 From: Tushar Khatiwada Date: Fri, 26 Oct 2018 15:31:58 +0545 Subject: [PATCH 004/170] Small typo fix --- content/docs/hooks-faq.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/content/docs/hooks-faq.md b/content/docs/hooks-faq.md index c57e200c0f..cfd11da018 100644 --- a/content/docs/hooks-faq.md +++ b/content/docs/hooks-faq.md @@ -109,7 +109,7 @@ There are a few more heuristics, and they might change over time as we fine-tune ### How do lifecycle methods correspond to Hooks? -* `constructor`: Function components don't need a constructor. You can initialize the state in the [`useState`](/docs/hooks-reference.html#usestate) call. If computing it is expensive, you can pass a function to `useState`. +* `constructor`: Function components don't need a constructor. You can initialize the state in the [`useState`](/docs/hooks-reference.html#usestate) call. If computing is expensive, you can pass a function to `useState`. * `getDerivedStateFromProps`: Schedule an update [while rendering](#how-do-i-implement-getderivedstatefromprops) instead. From 451a96c311f145aea332d17585e5ec2425332474 Mon Sep 17 00:00:00 2001 From: Misha Moroshko Date: Fri, 26 Oct 2018 16:18:29 -0700 Subject: [PATCH 005/170] Tip => Note "Tip" usually contains an action for you to perform. "Note" is more appropriate here since it's just an FYI. --- content/docs/hooks-faq.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/content/docs/hooks-faq.md b/content/docs/hooks-faq.md index ca01054c13..89c0da7127 100644 --- a/content/docs/hooks-faq.md +++ b/content/docs/hooks-faq.md @@ -396,7 +396,7 @@ In large component trees, an alternative we recommend is to pass down a `dispatc const TodosDispatch = React.createContext(null); function TodosApp() { - // Tip: `dispatch` won't change between re-renders + // Note: `dispatch` won't change between re-renders const [todos, dispatch] = useReducer(todosReducer); return ( From 7fd8a8dfd8b5ef639fac7f30cd4a014ae5e9dd43 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?H=C3=A9liton=20Nordt?= Date: Sun, 28 Oct 2018 16:40:21 -0300 Subject: [PATCH 006/170] Fix typo in Hooks FAQ --- content/docs/hooks-faq.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/content/docs/hooks-faq.md b/content/docs/hooks-faq.md index ca01054c13..395a33baf4 100644 --- a/content/docs/hooks-faq.md +++ b/content/docs/hooks-faq.md @@ -407,7 +407,7 @@ function TodosApp() { } ``` -Any child in the tree inside `TodosApp` can read use the `dispatch` function to pass actions up to `TodosApp`: +Any child in the tree inside `TodosApp` can use the `dispatch` function to pass actions up to `TodosApp`: ```js{2,3} function DeepChild(props) { From 9e9647c8a196b598477fa45357cd6a9ece6e482c Mon Sep 17 00:00:00 2001 From: Narin Luangrath Date: Fri, 11 Jan 2019 11:03:04 -0800 Subject: [PATCH 007/170] Fix typo in profiler-readme `aso` -> `also` --- content/blog/2018-09-10-introducing-the-react-profiler.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/content/blog/2018-09-10-introducing-the-react-profiler.md b/content/blog/2018-09-10-introducing-the-react-profiler.md index d73131fcb0..47211d3703 100644 --- a/content/blog/2018-09-10-introducing-the-react-profiler.md +++ b/content/blog/2018-09-10-introducing-the-react-profiler.md @@ -140,7 +140,7 @@ It also shows that each time it rendered, it was the most "expensive" component To view this chart, either double-click on a component _or_ select a component and click on the blue bar chart icon in the right detail pane. You can return to the previous chart by clicking the "x" button in the right detail pane. -You can aso double click on a particular bar to view more information about that commit. +You can also double click on a particular bar to view more information about that commit. ![How to view all renders for a specific component](../images/blog/introducing-the-react-profiler/see-all-commits-for-a-fiber.gif) From b3d150358829e057fb6045aac73c238f883283b9 Mon Sep 17 00:00:00 2001 From: natusaspire Date: Sun, 13 Jan 2019 00:30:23 +0200 Subject: [PATCH 008/170] fix typo in blog post --- content/blog/2018-06-07-you-probably-dont-need-derived-state.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/content/blog/2018-06-07-you-probably-dont-need-derived-state.md b/content/blog/2018-06-07-you-probably-dont-need-derived-state.md index 6e71ef8384..9d3337c86e 100644 --- a/content/blog/2018-06-07-you-probably-dont-need-derived-state.md +++ b/content/blog/2018-06-07-you-probably-dont-need-derived-state.md @@ -213,7 +213,7 @@ To recap, when designing a component, it is important to decide whether its data Instead of trying to **"mirror" a prop value in state**, make the component **controlled**, and consolidate the two diverging values in the state of some parent component. For example, rather than a child accepting a "committed" `props.value` and tracking a "draft" `state.value`, have the parent manage both `state.draftValue` and `state.committedValue` and control the child's value directly. This makes the data flow more explicit and predictable. For **uncontrolled** components, if you're trying to reset state when a particular prop (usually an ID) changes, you have a few options: -* **Recomendation: To reset _all internal state_, use the `key` attribute.** +* **Recommendation: To reset _all internal state_, use the `key` attribute.** * Alternative 1: To reset _only certain state fields_, watch for changes in a special property (e.g. `props.userID`). * Alternative 2: You can also consider fall back to an imperative instance method using refs. From d8a83092174f4d7a4b6e4cf68fdd7bae54a0cb73 Mon Sep 17 00:00:00 2001 From: Prashant Andani Date: Wed, 16 Jan 2019 21:18:03 +0530 Subject: [PATCH 009/170] Typo fix --- content/blog/2013-06-27-community-roundup-3.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/content/blog/2013-06-27-community-roundup-3.md b/content/blog/2013-06-27-community-roundup-3.md index 69041ea09c..2d297f20f3 100644 --- a/content/blog/2013-06-27-community-roundup-3.md +++ b/content/blog/2013-06-27-community-roundup-3.md @@ -49,7 +49,7 @@ The highlight of this week is that an interaction-heavy app has been ported to R [Joel Burget](http://joelburget.com/) wrote a blog post talking about the way we would write React-like components in Backbone and Handlebars. -> The problem here is that we're trying to maniplate a tree, but there's a textual layer we have to go through. Our views are represented as a tree - the subviews are children of CommentCollectionView - and they end up as part of a tree in the DOM. But there's a Handlebars layer in the middle (which deals in flat strings), so the hierarchy must be destructed and rebuilt when we render. +> The problem here is that we're trying to manipulate a tree, but there's a textual layer we have to go through. Our views are represented as a tree - the subviews are children of CommentCollectionView - and they end up as part of a tree in the DOM. But there's a Handlebars layer in the middle (which deals in flat strings), so the hierarchy must be destructed and rebuilt when we render. > > What does it take to render a collection view? In the Backbone/Handlebars view of the world you have to render the template (with stubs), render each subview which replaces a stub, and keep a reference to each subview (or anything within the view that could change in the future). > From dfaa41deabada361a0f93c7f58a50931a8a33fd5 Mon Sep 17 00:00:00 2001 From: evolveris Date: Sat, 19 Jan 2019 11:43:17 +0000 Subject: [PATCH 010/170] Fix typo --- content/docs/strict-mode.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/content/docs/strict-mode.md b/content/docs/strict-mode.md index 09b3b9e5db..889490b5e7 100644 --- a/content/docs/strict-mode.md +++ b/content/docs/strict-mode.md @@ -57,7 +57,7 @@ React used to support `findDOMNode` to search the tree for a DOM node given a cl `findDOMNode` can also be used on class components but this was breaking abstraction levels by allowing a parent to demand that certain children was rendered. It creates a refactoring hazard where you can't change the implementation details of a component because a parent might be reaching into its DOM node. `findDOMNode` only returns the first child, but with the use of Fragments, it is possible for a component to render multiple DOM nodes. `findDOMNode` is a one time read API. It only gave you an answer when you asked for it. If a child component renders a different node, there is no way to handle this change. Therefore `findDOMNode` only worked if components always return a single DOM node that never changes. -You can instead make this explicit by pass a ref to your custom component and pass that along to the DOM using [ref forwarding](/docs/forwarding-refs.html#forwarding-refs-to-dom-components). +You can instead make this explicit by passing a ref to your custom component and pass that along to the DOM using [ref forwarding](/docs/forwarding-refs.html#forwarding-refs-to-dom-components). You can also add a wrapper DOM node in your component and attach a ref directly to it. From 573da866666f33d43b8617e5fd94d56de4eb0fd1 Mon Sep 17 00:00:00 2001 From: Prashant Andani Date: Wed, 6 Feb 2019 22:46:24 +0530 Subject: [PATCH 011/170] Add https for javascript.info --- content/docs/getting-started.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/content/docs/getting-started.md b/content/docs/getting-started.md index 8ad77b1ac0..86e15c8437 100644 --- a/content/docs/getting-started.md +++ b/content/docs/getting-started.md @@ -79,7 +79,7 @@ We recommend going through [this JavaScript overview](https://developer.mozilla. >Tip > ->Whenever you get confused by something in JavaScript, [MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript) and [javascript.info](http://javascript.info/) are great websites to check. There are also [community support forums](/community/support.html) where you can ask for help. +>Whenever you get confused by something in JavaScript, [MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript) and [javascript.info](https://javascript.info/) are great websites to check. There are also [community support forums](/community/support.html) where you can ask for help. ### Practical Tutorial From 7e4ac52af4dc93b1d1b46cb39ead62b450e94b98 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Micha=C5=82=20Go=C5=82e=CC=A8biowski-Owczarek?= Date: Thu, 7 Feb 2019 14:41:33 +0100 Subject: [PATCH 012/170] HTTPS-ify most insecure URLs in content/docs (& one in Acknowledgments) This is a followup to #1157 --- content/docs/accessibility.md | 38 +++++++++---------- content/docs/add-react-to-a-website.md | 4 +- content/docs/addons-perf.md | 4 +- content/docs/addons-shallow-renderer.md | 2 +- content/docs/addons-test-utils.md | 4 +- content/docs/addons-update.md | 4 +- content/docs/code-splitting.md | 2 +- content/docs/codebase-overview.md | 4 +- content/docs/create-a-new-react-app.md | 6 +-- content/docs/design-principles.md | 6 +-- content/docs/faq-functions.md | 2 +- content/docs/faq-state.md | 2 +- content/docs/getting-started.md | 4 +- content/docs/handling-events.md | 2 +- content/docs/higher-order-components.md | 6 +-- content/docs/how-to-contribute.md | 4 +- .../docs/integrating-with-other-libraries.md | 22 +++++------ content/docs/introducing-jsx.md | 6 +-- content/docs/reconciliation.md | 2 +- content/docs/reference-dom-elements.md | 2 +- content/docs/reference-glossary.md | 2 +- content/docs/reference-test-renderer.md | 4 +- content/docs/state-and-lifecycle.md | 14 +++---- content/docs/static-type-checking.md | 2 +- content/docs/thinking-in-react.md | 6 +-- content/docs/uncontrolled-components.md | 2 +- src/pages/acknowledgements.html.js | 8 ++-- 27 files changed, 82 insertions(+), 82 deletions(-) diff --git a/content/docs/accessibility.md b/content/docs/accessibility.md index d387921cac..451ea2cc85 100644 --- a/content/docs/accessibility.md +++ b/content/docs/accessibility.md @@ -19,8 +19,8 @@ The [Web Content Accessibility Guidelines](https://www.w3.org/WAI/intro/wcag) pr The following WCAG checklists provide an overview: - [WCAG checklist from Wuhcag](https://www.wuhcag.com/wcag-checklist/) -- [WCAG checklist from WebAIM](http://webaim.org/standards/wcag/checklist) -- [Checklist from The A11Y Project](http://a11yproject.com/checklist.html) +- [WCAG checklist from WebAIM](https://webaim.org/standards/wcag/checklist) +- [Checklist from The A11Y Project](https://a11yproject.com/checklist.html) ### WAI-ARIA @@ -114,7 +114,7 @@ Every HTML form control, such as `` and ` ``` -In React, a `