merging all conflicts

reactjs-translation-bot · reactjs-translation-bot · commit 3283cae397cb · 2021-05-24T15:00:18.000Z
diff --git a/README.md b/README.md
@@ -53,7 +53,7 @@ The documentation is divided into several sections with a different tone and pur
 1. `git push my-fork-name the-name-of-my-branch`
 1. Go to the [reactjs.org repo](https://github.com/reactjs/reactjs.org) and you should see recently pushed branches.
 1. Follow GitHub's instructions.
-1. If possible, include screenshots of visual changes. A Netlify build will also be automatically created once you make your PR so other people can see your change.
+1. If possible, include screenshots of visual changes. A [Netlify](https://www.netlify.com/) build will also be automatically created once you make your PR so other people can see your change.
 
 ## Translation
 
diff --git a/content/blog/2017-09-08-dom-attributes-in-react-16.md b/content/blog/2017-09-08-dom-attributes-in-react-16.md
@@ -32,7 +32,7 @@ React has always provided a JavaScript-centric API to the DOM. Since React compo
 <div tabIndex={-1} />
 ```
 
-This has not changed. However, the way we enforced it in the past forced us to maintain a allowlist of all valid React DOM attributes in the bundle:
+This has not changed. However, the way we enforced it in the past forced us to maintain an allowlist of all valid React DOM attributes in the bundle:
 
 ```js
 // ...
diff --git a/content/community/conferences.md b/content/community/conferences.md
@@ -12,32 +12,37 @@ Do you know of a local React.js conference? Add it here! (Please keep the list c
 
 ## Upcoming Conferences {#upcoming-conferences}
 
-### React fwdays’21 {#react-fwdays-2021}
-March 27, 2021 - remote event
+### render(ATL) 2021 {#render-atlanta-2021} 
+September 13-15, 2021. Atlanta, GA, USA
 
-[Website](https://fwdays.com/en/event/react-fwdays-2021) - [Twitter](https://twitter.com/fwdays) - [Facebook](https://www.facebook.com/events/1133828147054286) - [LinkedIn](https://www.linkedin.com/events/reactfwdays-21onlineconference6758046347334582273) - [Meetup](https://www.meetup.com/ru-RU/Fwdays/events/275764431/)
+[Website](https://renderatl.com) - [Twitter](https://twitter.com/renderATL) - [Instagram](https://www.instagram.com/renderatl/) - [Facebook](https://www.facebook.com/renderatl/) - [LinkedIn](https://www.linkedin.com/company/renderatl)
 
-### React Summit - Remote Edition 2021 {#react-summit-remote-2021}
-April 14-16, 2021, 7am PST / 10am EST / 4pm CEST - remote event
+### React Advanced 2021 {#react-advanced-2021}
+October 22-23, 2021. In-person in London, UK + remote (hybrid event)
 
-[Website](https://remote.reactsummit.com) - [Twitter](https://twitter.com/reactsummit) - [Facebook](https://www.facebook.com/reactamsterdam) - [Videos](https://youtube.com/c/ReactConferences)
+[Website](https://reactadvanced.com) - [Twitter](http://twitter.com/reactadvanced) - [Facebook](https://www.facebook.com/ReactAdvanced) - [Videos](https://youtube.com/c/ReactConferences)
+
+### React India 2021 {#react-india-2021}
+November 12-13, 2021 in Mumbai, India
+
+[Website](https://www.reactindia.io) - [Twitter](https://twitter.com/react_india) - [Facebook](https://www.facebook.com/ReactJSIndia/) - [LinkedIn](https://www.linkedin.com/showcase/14545585) - [YouTube](https://www.youtube.com/channel/UCaFbHCBkPvVv1bWs_jwYt3w/videos)
+
+## Past Conferences {#past-conferences}
 
 ### React Case Study Festival 2021 {#react-case-study-festival-2021}
 April 27-28, 2021 - remote event
 
 [Website](https://link.geekle.us/react/offsite) - [LinkedIn](https://www.linkedin.com/events/reactcasestudyfestival6721300943411015680/) - [Facebook](https://www.facebook.com/events/255715435820203) 
 
-### render(ATL) 2021 {#render-atlanta-2021} 
-September 13-15, 2021. Atlanta, GA, USA
-
-[Website](https://renderatl.com) - [Twitter](https://twitter.com/renderATL) - [Instagram](https://www.instagram.com/renderatl/) - [Facebook](https://www.facebook.com/renderatl/) - [LinkedIn](https://www.linkedin.com/company/renderatl)
+### React Summit - Remote Edition 2021 {#react-summit-remote-2021}
+April 14-16, 2021, 7am PST / 10am EST / 4pm CEST - remote event
 
-### React India 2021 {#react-india-2021}
-November 12-13, 2021 in Mumbai, India
+[Website](https://remote.reactsummit.com) - [Twitter](https://twitter.com/reactsummit) - [Facebook](https://www.facebook.com/reactamsterdam) - [Videos](https://youtube.com/c/ReactConferences)
 
-[Website](https://www.reactindia.io) - [Twitter](https://twitter.com/react_india) - [Facebook](https://www.facebook.com/ReactJSIndia/) - [LinkedIn](https://www.linkedin.com/showcase/14545585) - [YouTube](https://www.youtube.com/channel/UCaFbHCBkPvVv1bWs_jwYt3w/videos)
+### React fwdays’21 {#react-fwdays-2021}
+March 27, 2021 - remote event
 
-## Past Conferences {#past-conferences}
+[Website](https://fwdays.com/en/event/react-fwdays-2021) - [Twitter](https://twitter.com/fwdays) - [Facebook](https://www.facebook.com/events/1133828147054286) - [LinkedIn](https://www.linkedin.com/events/reactfwdays-21onlineconference6758046347334582273) - [Meetup](https://www.meetup.com/ru-RU/Fwdays/events/275764431/)
 
 ### React Next 2020 {#react-next-2020}
 December 1-2, 2020 - remote event
diff --git a/content/community/courses.md b/content/community/courses.md
@@ -28,7 +28,7 @@ permalink: community/courses.html
 
 - [Egghead.io](https://egghead.io/browse/frameworks/react) - Short instructional videos on React and many other topics.
 
-- [Frontend Masters](https://frontendmasters.com/courses/) - Video courses on React and other frontend frameworks.
+- [Frontend Masters](https://frontendmasters.com/learn/react/) - Video courses on React.
 
 - [Fullstack React](https://www.fullstackreact.com/) - The up-to-date, in-depth, complete guide to React and friends.
 
diff --git a/content/community/videos.md b/content/community/videos.md
@@ -13,12 +13,12 @@ Videos dedicated to the discussion of React and the React ecosystem.
 ### React Conf 2019 {#react-conf-2019}
 
 A playlist of videos from React Conf 2019.
-<iframe title="React Conf 2019" width="650" height="366" src="https://www.youtube-nocookie.com/embed/videoseries?list=PLPxbbTqCLbGHPxZpw4xj_Wwg8-fdNxJRh" frameborder="0" allowfullscreen></iframe>
+<iframe title="React Conf 2019" width="650" height="366" src="https://www.youtube-nocookie.com/embed/playlist?list=PLPxbbTqCLbGHPxZpw4xj_Wwg8-fdNxJRh" frameborder="0" allowfullscreen></iframe>
 
 ### React Conf 2018 {#react-conf-2018}
 
 A playlist of videos from React Conf 2018.
-<iframe title="React Conf 2018" width="650" height="366" src="https://www.youtube-nocookie.com/embed/videoseries?list=PLPxbbTqCLbGE5AihOSExAa4wUM-P42EIJ" frameborder="0" allowfullscreen></iframe>
+<iframe title="React Conf 2018" width="650" height="366" src="https://www.youtube-nocookie.com/embed/playlist?list=PLPxbbTqCLbGE5AihOSExAa4wUM-P42EIJ" frameborder="0" allowfullscreen></iframe>
 
 ### React.js Conf 2017 {#reactjs-conf-2017}
 
diff --git a/content/docs/addons-test-utils.md b/content/docs/addons-test-utils.md
@@ -20,8 +20,10 @@ var ReactTestUtils = require('react-dom/test-utils'); // ES5 with npm
 > Note:
 >
 > We recommend using [React Testing Library](https://testing-library.com/react) which is designed to enable and encourage writing tests that use your components as the end users do.
->
-> Alternatively, Airbnb has released a testing utility called [Enzyme](https://airbnb.io/enzyme/), which makes it easy to assert, manipulate, and traverse your React Components' output.
+> 
+> For React versions <= 16, the [Enzyme](https://airbnb.io/enzyme/) library makes it easy to assert, manipulate, and traverse your React Components' output.
+
+
 
  - [`act()`](#act)
  - [`mockComponent()`](#mockcomponent)
diff --git a/content/docs/code-splitting.md b/content/docs/code-splitting.md
@@ -42,7 +42,11 @@ console.log(add(16, 26)); // 42
 
 Nếu bạn đang sử dụng [Create React App](https://create-react-app.dev/), [Next.js](https://nextjs.org/), [Gatsby](https://www.gatsbyjs.org/), hay một công cụ tương tự, bạn sẽ được thiết lập sẵn webpack để đóng gói ứng dụng của mình.
 
+<<<<<<< HEAD
 Nếu không, bạn sẽ cần phải tự thiết lập. Ví dụ, tham khảo [Cách cài đặt](https://webpack.js.org/guides/installation/) và [Làm thê nào để bắt đầu sử dụng](https://webpack.js.org/guides/getting-started/) hướng dẫn ở tài liệu Webpack.
+=======
+If you aren't, you'll need to set up bundling yourself. For example, see the [Installation](https://webpack.js.org/guides/installation/) and [Getting Started](https://webpack.js.org/guides/getting-started/) guides on the Webpack docs.
+>>>>>>> e60bca04f3da690256ce019bd8907c2b368589ee
 
 ## Phân chia Code {#code-splitting}
 
diff --git a/content/docs/concurrent-mode-adoption.md b/content/docs/concurrent-mode-adoption.md
@@ -21,6 +21,10 @@ next: concurrent-mode-reference.html
 >
 >This documentation is aimed at early adopters and people who are curious. **If you're new to React, don't worry about these features** -- you don't need to learn them right now.
 
+>Caution:
+>
+>All references below to "blocking mode" and `createBlockingRoot` are outdated and should be ignored.
+
 </div>
 
 - [Installation](#installation)
diff --git a/content/docs/concurrent-mode-reference.md b/content/docs/concurrent-mode-reference.md
@@ -28,7 +28,6 @@ This page is an API reference for the React [Concurrent Mode](/docs/concurrent-m
 
 - [Enabling Concurrent Mode](#concurrent-mode)
     - [`createRoot`](#createroot)
-    - [`createBlockingRoot`](#createblockingroot)
 - [Suspense](#suspense)
     - [`Suspense`](#suspensecomponent)
     - [`SuspenseList`](#suspenselist)
@@ -47,18 +46,6 @@ Replaces `ReactDOM.render(<App />, rootNode)` and enables Concurrent Mode.
 
 For more information on Concurrent Mode, check out the [Concurrent Mode documentation.](/docs/concurrent-mode-intro.html)
 
-### `createBlockingRoot` {#createblockingroot}
-
-```js
-ReactDOM.createBlockingRoot(rootNode).render(<App />)
-```
-
-Replaces `ReactDOM.render(<App />, rootNode)` and enables [Blocking Mode](/docs/concurrent-mode-adoption.html#migration-step-blocking-mode).
-
-Opting into Concurrent Mode introduces semantic changes to how React works. This means that you can't use Concurrent Mode in just a few components. Because of this, some apps may not be able to migrate directly to Concurrent Mode. 
-
-Blocking Mode only contains a small subset of Concurrent Mode features and is intended as an intermediary migration step for apps that are unable to migrate directly.
-
 ## Suspense API {#suspense}
 
 ### `Suspense` {#suspensecomponent}
diff --git a/content/docs/hooks-reference.md b/content/docs/hooks-reference.md
@@ -76,6 +76,7 @@ If your update function returns the exact same value as the current state, the s
 > Unlike the `setState` method found in class components, `useState` does not automatically merge update objects. You can replicate this behavior by combining the function updater form with object spread syntax:
 >
 > ```js
+> const [state, setState] = useState({});
 > setState(prevState => {
 >   // Object.assign would also work
 >   return {...prevState, ...updatedValues};
diff --git a/content/docs/reference-react-component.md b/content/docs/reference-react-component.md
@@ -299,7 +299,7 @@ Note that this method is fired on *every* render, regardless of the cause. This
 getSnapshotBeforeUpdate(prevProps, prevState)
 ```
 
-`getSnapshotBeforeUpdate()` is invoked right before the most recently rendered output is committed to e.g. the DOM. It enables your component to capture some information from the DOM (e.g. scroll position) before it is potentially changed. Any value returned by this lifecycle will be passed as a parameter to `componentDidUpdate()`.
+`getSnapshotBeforeUpdate()` is invoked right before the most recently rendered output is committed to e.g. the DOM. It enables your component to capture some information from the DOM (e.g. scroll position) before it is potentially changed. Any value returned by this lifecycle method will be passed as a parameter to `componentDidUpdate()`.
 
 This use case is not common, but it may occur in UIs like a chat thread that need to handle scroll position in a special way.
 
diff --git a/content/docs/testing-recipes.md b/content/docs/testing-recipes.md
@@ -395,7 +395,11 @@ it("changes value when clicked", () => {
     render(<Toggle onChange={onChange} />, container);
   });
 
+<<<<<<< HEAD
   // lấy toàn bộ các element, và trigger một vài sự kiện click
+=======
+  // get a hold of the button element, and trigger some clicks on it
+>>>>>>> e60bca04f3da690256ce019bd8907c2b368589ee
   const button = document.querySelector("[data-testid=toggle]");
   expect(button.innerHTML).toBe("Turn on");
 
diff --git a/content/images/tutorial/devtools.png b/content/images/tutorial/devtools.png
diff --git a/content/tutorial/tutorial.md b/content/tutorial/tutorial.md
@@ -524,7 +524,11 @@ Chú ý rằng trong hàm `handleClick`, chúng ta sử dụng `.slice()` để
 
 ### Tại sao tính bất biến là quan trọng {#why-immutability-is-important}
 
+<<<<<<< HEAD
 Trong phần code ví dụ trước, ta đã sử dụng hàm `.slice()` để tạo ra bản sao của mảng `squares` thay vì sửa trực tiếp nó. Giờ ta sẽ thảo luận về tính bất biến và vì sao tính bất biến lại quan trọng.
+=======
+In the previous code example, we suggested that you use the `.slice()` method to create a copy of the `squares` array to copy instead of modifying the existing array. We'll now discuss immutability and why immutability is important to learn.
+>>>>>>> e60bca04f3da690256ce019bd8907c2b368589ee
 
 Thông thường, ta có 2 hướng tiếp cận đối với việc thay đổi dữ liệu. Hướng tiếp cận đầu tiên đó là *thay đổi (mutate)* trực tiếp giá trị của dữ liệu. Hướng tiếp cận thứ hai đó là thay dữ liệu hiện có bằng một bản sao của nó và sửa đổi trên bản sao đó.
 
diff --git a/yarn.lock b/yarn.lock
@@ -9780,9 +9780,9 @@ lodash.uniq@4.5.0, lodash.uniq@^4.5.0:
   integrity sha1-0CJTc662Uq3BvILklFM5qEJ1R3M=
 
 lodash@^4.11.1, lodash@^4.15.0, lodash@^4.17.10, lodash@^4.17.11, lodash@^4.17.14, lodash@^4.17.15, lodash@^4.17.19, lodash@^4.17.20, lodash@^4.17.4, lodash@^4.17.5, lodash@^4.2.0, lodash@^4.3.0:
-  version "4.17.20"
-  resolved "https://registry.yarnpkg.com/lodash/-/lodash-4.17.20.tgz#b44a9b6297bcb698f1c51a3545a2b3b368d59c52"
-  integrity sha512-PlhdFcillOINfeV7Ni6oF1TAEayyZBoZ8bcshTHqOYJYlrqzRK5hagpagky5o4HfCzzd1TRkXPMFq6cKk9rGmA==
+  version "4.17.21"
+  resolved "https://registry.yarnpkg.com/lodash/-/lodash-4.17.21.tgz#679591c564c3bffaae8454cf0b3df370c3d6911c"
+  integrity sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==
 
 log-update@^3.0.0:
   version "3.4.0"

Original file line number	Diff line number	Diff line change
`@@ -21,6 +21,10 @@ next: concurrent-mode-reference.html`
`21`	`21`	`>`
`22`	`22`	`>This documentation is aimed at early adopters and people who are curious. If you're new to React, don't worry about these features -- you don't need to learn them right now.`
`23`	`23`
	`24`	`+>Caution:`
	`25`	`+>`
	`26`	+>All references below to "blocking mode" and `createBlockingRoot` are outdated and should be ignored.
	`27`	`+`
`24`	`28`	`</div>`
`25`	`29`
`26`	`30`	`- [Installation](#installation)`
Original file line number	Diff line number	Diff line change
`@@ -76,6 +76,7 @@ If your update function returns the exact same value as the current state, the s`
`76`	`76`	> Unlike the `setState` method found in class components, `useState` does not automatically merge update objects. You can replicate this behavior by combining the function updater form with object spread syntax:
`77`	`77`	`>`
`78`	`78`	> ```js
	`79`	`+> const [state, setState] = useState({});`
`79`	`80`	`> setState(prevState => {`
`80`	`81`	`> // Object.assign would also work`
`81`	`82`	`> return {...prevState, ...updatedValues};`