Skip to content

Commit

Permalink
Merge branch 'main' into main
Browse files Browse the repository at this point in the history
  • Loading branch information
tranvanhuyhoang committed Sep 18, 2021
2 parents c7e372c + 1b22ad2 commit e875df9
Show file tree
Hide file tree
Showing 33 changed files with 715 additions and 707 deletions.
2 changes: 1 addition & 1 deletion content/blog/2018-10-23-react-v-16-6.md
Expand Up @@ -119,7 +119,7 @@ Refer to the documentation for [detailed installation instructions](/docs/instal
## Changelog {#changelog}

### React {#react}

* Add `React.memo()` as an alternative to `PureComponent` for functions. ([@acdlite](https://github.com/acdlite) in [#13748](https://github.com/facebook/react/pull/13748))
* Add `React.lazy()` for code splitting components. ([@acdlite](https://github.com/acdlite) in [#13885](https://github.com/facebook/react/pull/13885))
* `React.StrictMode` now warns about legacy context API. ([@bvaughn](https://github.com/bvaughn) in [#13760](https://github.com/facebook/react/pull/13760))
Expand Down
4 changes: 2 additions & 2 deletions content/community/conferences.md
@@ -1,14 +1,14 @@
---
id: conferences
title: Conferences
title: Các hội nghị
layout: community
sectionid: community
permalink: community/conferences.html
redirect_from:
- "docs/conferences.html"
---

Do you know of a local React.js conference? Add it here! (Please keep the list chronological)
Bạn có biết về hội nghị React.js ở địa phương hay khu vực của bạn không? Hãy thêm nó vào đây! (Và vui lòng giữ nguyên danh sách theo thứ tự thời gian).

## Upcoming Conferences {#upcoming-conferences}

Expand Down
4 changes: 2 additions & 2 deletions content/community/examples.md
@@ -1,6 +1,6 @@
---
id: examples
title: Example Projects
title: Các dự án mẫu
layout: community
sectionid: community
permalink: community/examples.html
Expand All @@ -10,7 +10,7 @@ Có rất nhiều dự án mẫu được tạo bởi cộng đồng React. Chú

Nếu bạn thêm một dự án, hãy cam kết cập nhật nó với các phiên bản React mới nhất.

## Ví dụ nhỏ {#small-examples}
## Các dự án mẫu cỡ nhỏ {#small-examples}

* **[Calculator](https://github.com/ahfarmer/calculator)** Triển khai máy tính iOS xây dựng bằng React
* **[Emoji Search](https://github.com/ahfarmer/emoji-search)** Ứng dụng React tìm kiếm biểu tượng cảm xúc
Expand Down
44 changes: 22 additions & 22 deletions content/community/meetups.md
Expand Up @@ -15,15 +15,15 @@ Bạn đã có React.js meetup tại quốc gia của bạn chưa? Thêm nó và
* [Buenos Aires](https://www.meetup.com/es/React-en-Buenos-Aires)
* [Rosario](https://www.meetup.com/es/reactrosario)

## Australia {#australia}
## Úc {#australia}
* [Brisbane](https://www.meetup.com/reactbris/)
* [Melbourne](https://www.meetup.com/React-Melbourne/)
* [Sydney](https://www.meetup.com/React-Sydney/)

## Austria {#austria}
## Áo {#austria}
* [Vienna](https://www.meetup.com/Vienna-ReactJS-Meetup/)

## Belgium {#belgium}
## Bỉ {#belgium}
* [Belgium](https://www.meetup.com/ReactJS-Belgium/)

## Brazil {#brazil}
Expand Down Expand Up @@ -53,28 +53,28 @@ Bạn đã có React.js meetup tại quốc gia của bạn chưa? Thêm nó và
## Chile {#chile}
* [Santiago](https://www.meetup.com/es-ES/react-santiago/)

## China {#china}
## Trung Quốc {#china}
* [Beijing](https://www.meetup.com/Beijing-ReactJS-Meetup/)

## Colombia {#colombia}
* [Bogotá](https://www.meetup.com/meetup-group-iHIeHykY/)
* [Medellin](https://www.meetup.com/React-Medellin/)
* [Cali](https://www.meetup.com/reactcali/)

## Denmark {#denmark}
## Đan Mạch {#denmark}
* [Aalborg](https://www.meetup.com/Aalborg-React-React-Native-Meetup/)
* [Aarhus](https://www.meetup.com/Aarhus-ReactJS-Meetup/)

## England (UK) {#england-uk}
## Anh (Vương Quốc Anh) {#england-uk}
* [Manchester](https://www.meetup.com/Manchester-React-User-Group/)
* [React.JS Girls London](https://www.meetup.com/ReactJS-Girls-London/)

## France {#france}
## Pháp {#france}
* [Nantes](https://www.meetup.com/React-Nantes/)
* [Lille](https://www.meetup.com/ReactBeerLille/)
* [Paris](https://www.meetup.com/ReactJS-Paris/)

## Germany {#germany}
## Đức {#germany}
* [Cologne](https://www.meetup.com/React-Cologne/)
* [Düsseldorf](https://www.meetup.com/de-DE/ReactJS-Meetup-Dusseldorf/)
* [Hamburg](https://www.meetup.com/Hamburg-React-js-Meetup/)
Expand All @@ -83,14 +83,14 @@ Bạn đã có React.js meetup tại quốc gia của bạn chưa? Thêm nó và
* [Munich](https://www.meetup.com/ReactJS-Meetup-Munich/)
* [React Berlin](https://www.meetup.com/React-Open-Source/)

## Greece {#greece}
## Hy Lạp {#greece}
* [Athens](https://www.meetup.com/React-To-React-Athens-MeetUp/)
* [Thessaloniki](https://www.meetup.com/Thessaloniki-ReactJS-Meetup/)

## Hungary {#hungary}
* [Budapest](https://www.meetup.com/React-Budapest/)

## India {#india}
## Ấn Độ {#india}
* [Bangalore](https://www.meetup.com/ReactJS-Bangalore/)
* [Bangalore](https://www.meetup.com/React-Native-Bangalore-Meetup)
* [Chandigarh](https://www.meetup.com/Chandigarh-React-Developers/)
Expand All @@ -108,20 +108,20 @@ Bạn đã có React.js meetup tại quốc gia của bạn chưa? Thêm nó và
## Israel {#israel}
* [Tel Aviv](https://www.meetup.com/ReactJS-Israel/)

## Italy {#italy}
## Ý {#italy}
* [Milan](https://www.meetup.com/React-JS-Milano/)

## Malaysia {#malaysia}
* [Kuala Lumpur](https://www.kl-react.com/)
* [Penang](https://www.facebook.com/groups/reactpenang/)

## Netherlands {#netherlands}
## Hà Lan {#netherlands}
* [Amsterdam](https://www.meetup.com/React-Amsterdam/)

## New Zealand {#new-zealand}
* [Wellington](https://www.meetup.com/React-Wellington/)

## Norway {#norway}
## Na Uy {#norway}
* [Norway](https://reactjs-norway.webflow.io/)
* [Oslo](https://www.meetup.com/ReactJS-Oslo-Meetup/)

Expand All @@ -139,35 +139,35 @@ Bạn đã có React.js meetup tại quốc gia của bạn chưa? Thêm nó và
* [Manila](https://www.meetup.com/reactjs-developers-manila/)
* [Manila - ReactJS PH](https://www.meetup.com/ReactJS-Philippines/)

## Poland {#poland}
## Ba Lan {#poland}
* [Warsaw](https://www.meetup.com/React-js-Warsaw/)

## Portugal {#portugal}
## Bồ Đào Nha {#portugal}
* [Lisbon](https://www.meetup.com/JavaScript-Lisbon/)

## Scotland (UK) {#scotland-uk}
## Scotland (Vương Quốc Anh) {#scotland-uk}
* [Edinburgh](https://www.meetup.com/React-Scotland/)

## Singapore {#singapore}
* [Singapore - React Knowledgeable](https://reactknowledgeable.org/)

## Spain {#spain}
## Tây Ban Nha {#spain}
* [Barcelona](https://www.meetup.com/ReactJS-Barcelona/)
* [Canarias](https://www.meetup.com/React-Canarias/)

## Sweden {#sweden}
## Thụy Điển {#sweden}
* [Goteborg](https://www.meetup.com/ReactJS-Goteborg/)

## Switzerland {#switzerland}
## Thụy Sỹ {#switzerland}
* [Zurich](https://www.meetup.com/Zurich-ReactJS-Meetup/)

## Turkey {#turkey}
## Thổ Nhĩ Kỳ {#turkey}
* [Istanbul](https://kommunity.com/reactjs-istanbul)

## Ukraine {#ukraine}
## Ukraina {#ukraine}
* [Kyiv](https://www.meetup.com/Kyiv-ReactJS-Meetup)

## US {#us}
## Mỹ {#us}
* [Ann Arbor, MI - ReactJS](https://www.meetup.com/AnnArbor-jsx/)
* [Atlanta, GA - ReactJS](https://www.meetup.com/React-ATL/)
* [Austin, TX - ReactJS](https://www.meetup.com/ReactJS-Austin-Meetup/)
Expand Down
12 changes: 6 additions & 6 deletions content/community/nav.yml
@@ -1,19 +1,19 @@
- title: Nguồn cộng đồng
items:
- id: support
title: Support
title: Hỗ trợ
- id: team
title: Team
- id: courses
title: Courses
title: Các khóa học
- id: examples
title: Examples
title: Các dự án mẫu
- id: meetups
title: Meetups
title: Các cuộc gặp gỡ
- id: conferences
title: Conferences
title: Các hội nghị
- id: articles
title: Articles
title: Bài viết
- id: podcasts
title: Podcasts
- id: videos
Expand Down
28 changes: 14 additions & 14 deletions content/community/support.md
Expand Up @@ -8,28 +8,28 @@ redirect_from:
- "support.html"
---

React has a community of millions of developers.
React có một cộng đồng hàng triệu lập trình viên.

On this page we've listed some React-related communities that you can be a part of; see the other pages in this section for additional online and in-person learning materials.
Trên trang này chúng tôi đã liệt kê ra một số cộng đồng liên quan đến React mà bạn có thể tham gia; xem các trang khác trong phần này để biết thêm tài liệu học online và trực tiếp.

Before participating in React's communities, [please read our Code of Conduct](https://github.com/facebook/react/blob/main/CODE_OF_CONDUCT.md). We have adopted the [Contributor Covenant](https://www.contributor-covenant.org/) and we expect that all community members adhere to the guidelines within.
Trước khi tham gia vào cộng đồng React, [vui lòng đọc Quy tắc ứng xử của chúng tôi](https://github.com/facebook/react/blob/main/CODE_OF_CONDUCT.md). Chúng tôi đã áp dụng [Giao ước cộng tác viên](https://www.contributor-covenant.org/) và chúng tôi hi vọng các thành viên trong cộng đồng sẽ tuân thủ các qui tắc.

## Stack Overflow {#stack-overflow}

Stack Overflow is a popular forum to ask code-level questions or if you're stuck with a specific error. Read through the [existing questions](https://stackoverflow.com/questions/tagged/reactjs) tagged with **reactjs** or [ask your own](https://stackoverflow.com/questions/ask?tags=reactjs)!
Stack Overflow là một diễn đàn nổi tiếng để đặt các câu hỏi về code hoặc nếu bạn gặp một lỗi cụ thể. Đọc qua [câu hỏi hiện có](https://stackoverflow.com/questions/tagged/reactjs) được gắn thẻ **reactjs** hoặc [câu hỏi của riêng bạn](https://stackoverflow.com/questions/ask?tags=reactjs)!

## Popular Discussion Forums {#popular-discussion-forums}
## Diễn đàn thảo luận phổ biến {#popular-discussion-forums}

There are many online forums which are a great place for discussion about best practices and application architecture as well as the future of React. If you have an answerable code-level question, Stack Overflow is usually a better fit.
Có rất nhiều diễn đàn online là nơi tuyệt vời để thảo luận về phương pháp hay nhất và kiến trúc ứng dụng cũng như tương lai của React. Nếu bạn có một câu hỏi về code có thể trả lời được, Stack Overflow là một nơi phù hợp.

Each community consists of many thousands of React users.
Mỗi cộng đồng bao gồm hàng nghìn người dùng React.

* [DEV's React community](https://dev.to/t/react)
* [Hashnode's React community](https://hashnode.com/n/reactjs)
* [Reactiflux online chat](https://discord.gg/reactiflux)
* [Reddit's React community](https://www.reddit.com/r/reactjs/)
* [Spectrum's React community](https://spectrum.chat/react)
* [Cộng đồng React của DEV](https://dev.to/t/react)
* [Cộng đồng React của Hashnode](https://hashnode.com/n/reactjs)
* [Trò chuyện online với Reactiflux](https://discord.gg/reactiflux)
* [Cộng đồng React của Reddit](https://www.reddit.com/r/reactjs/)
* [Cộng đồng React của Spectrum](https://spectrum.chat/react)

## News {#news}
## Tin tức {#news}

For the latest news about React, [follow **@reactjs** on Twitter](https://twitter.com/reactjs) and the [official React blog](/blog/) on this website.
Để biết thêm tin tức mới nhất về React, [theo dõi **@reactjs** trên Twitter](https://twitter.com/reactjs) [blog chính thức của React](/blog/) trên trang này.
2 changes: 1 addition & 1 deletion content/docs/add-react-to-a-website.md
@@ -1,6 +1,6 @@
---
id: add-react-to-a-website
title: Add React to a Website
title: Thêm React vào một Website
permalink: docs/add-react-to-a-website.html
redirect_from:
- "docs/add-react-to-an-existing-app.html"
Expand Down
20 changes: 10 additions & 10 deletions content/docs/addons-pure-render-mixin.md
Expand Up @@ -6,22 +6,22 @@ layout: docs
category: Add-Ons
---

> Note:
> Lưu ý:
>
> `PureRenderMixin` is a legacy add-on. Use [`React.PureComponent`](/docs/react-api.html#reactpurecomponent) instead.
> `PureRenderMixin` được kế thừa từ add-on. Sử dụng [`React.PureComponent`](/docs/react-api.html#reactpurecomponent) thay thế.
**Importing**

```javascript
import PureRenderMixin from 'react-addons-pure-render-mixin'; // ES6
var PureRenderMixin = require('react-addons-pure-render-mixin'); // ES5 with npm
var PureRenderMixin = require('react-addons-pure-render-mixin'); // ES5 với npm
```

## Overview {#overview}
## Tổng quát {#overview}

If your React component's render function renders the same result given the same props and state, you can use this mixin for a performance boost in some cases.
Nếu function render của React component của bạn hiển thị cùng một kết quả với cùng prop và state, bạn có thể sử dụng mixin để tăng hiệu suất trong một số trường hợp.

Example:
Ví dụ:

```js
const createReactClass = require('create-react-class');
Expand All @@ -35,10 +35,10 @@ createReactClass({
});
```

Under the hood, the mixin implements [shouldComponentUpdate](/docs/component-specs.html#updating-shouldcomponentupdate), in which it compares the current props and state with the next ones and returns `false` if the equalities pass.
Xem xét một cách kỹ lưỡng, mixin thực hiện [shouldComponentUpdate](/docs/component-specs.html#updating-shouldcomponentupdate), trong đó nó so sánh prop và state hiện tại với những cái tiếp theo và trả về `false` nếu chúng bằng nhau.

> Note:
> Lưu ý:
>
> This only shallowly compares the objects. If these contain complex data structures, it may produce false-negatives for deeper differences. Only mix into components which have simple props and state, or use `forceUpdate()` when you know deep data structures have changed. Or, consider using [immutable objects](https://facebook.github.io/immutable-js/) to facilitate fast comparisons of nested data.
> Đây chỉ là so sánh nông với các object. Nếu object chứa cấu trúc dữ liệu phức tạp, nó có thể tạo ra các trường hợp sai đối với sự khác nhau sâu trong nhiều cấp của object. Chỉ được dùng đối với component có prop và state đơn giản, hoặc dùng `forceUpdate()` khi bạn biết cấu trúc dữ liệu sâu bên trong đã thay đổi. Có thể cân nhắc sử dụng [immutable objects](https://facebook.github.io/immutable-js/) để dễ dàng so sánh các dữ liệu lồng nhau.
>
> Furthermore, `shouldComponentUpdate` skips updates for the whole component subtree. Make sure all the children components are also "pure".
> Hơn nữa, `shouldComponentUpdate` bỏ qua cập nhật toàn bộ các component con. Hãy đảm bảo rằng tất cả các component con cũng là "pure".
25 changes: 14 additions & 11 deletions content/docs/addons-shallow-compare.md
Expand Up @@ -6,24 +6,26 @@ layout: docs
category: Reference
---

> Note:
> Lưu ý:
>
> `shallowCompare` is a legacy add-on. Use [`React.memo`](/docs/react-api.html#reactmemo) or [`React.PureComponent`](/docs/react-api.html#reactpurecomponent) instead.
> `shallowCompare` được kế thừa từ add-on. Sử dụng [`React.memo`](/docs/react-api.html#reactmemo) hoặc [`React.PureComponent`](/docs/react-api.html#reactpurecomponent) thay thế.
**Importing**

```javascript
import shallowCompare from 'react-addons-shallow-compare'; // ES6
var shallowCompare = require('react-addons-shallow-compare'); // ES5 with npm
var shallowCompare = require('react-addons-shallow-compare'); // ES5 với npm
```

## Overview {#overview}
## Tổng quát {#overview}

Before [`React.PureComponent`](/docs/react-api.html#reactpurecomponent) was introduced, `shallowCompare` was commonly used to achieve the same functionality as [`PureRenderMixin`](pure-render-mixin.html) while using ES6 classes with React.

If your React component's render function is "pure" (in other words, it renders the same result given the same props and state), you can use this helper function for a performance boost in some cases.
Trước khi [`React.PureComponent`](/docs/react-api.html#reactpurecomponent) được giới thiệu, `shallowCompare` thường được sử dụng có chức năng tương tự như [`PureRenderMixin`](pure-render-mixin.html) trong khi sử dụng các lớp ES6 với React.

Example:
Nếu render function của React component là "thuần" (nói một cách khác, nó trả về cùng một kết quả với cùng props và state), bạn có thể dùng helper function để tăng cường hiệu suất trong một số trường hợp.


Ví dụ:

```js
export class SampleComponent extends React.Component {
Expand All @@ -37,8 +39,9 @@ export class SampleComponent extends React.Component {
}
```

`shallowCompare` performs a shallow equality check on the current `props` and `nextProps` objects as well as the current `state` and `nextState` objects.
It does this by iterating on the keys of the objects being compared and returning true when the values of a key in each object are not strictly equal.
`shallowCompare` thực hiện kiểm tra shallow equality ở các đối tượng `props``nextProps` hiện tại cũng như các đối tượng `state``nextState` hiện tại. Nó thực hiện điều này bằng cách thực hiện lặp đi lặp lại trên các khóa của đối tượng được so sánh và trả về true khi các giá trị của khóa ở mỗi đối tượng không hoàn toàn bằng nhau.

`shallowCompare` trả về `true` nếu phép so sánh shallow cho props hoặc state thất bại và component sẽ được cập nhật.

`shallowCompare` trả về `false` nếu phép so sánh shallow cho props hoặc state thành công và component không cần cập nhật.

`shallowCompare` returns `true` if the shallow comparison for props or state fails and therefore the component should update.
`shallowCompare` returns `false` if the shallow comparison for props and state both pass and therefore the component does not need to update.
2 changes: 1 addition & 1 deletion content/docs/faq-functions.md
Expand Up @@ -282,7 +282,7 @@ class Searchbox extends React.Component {
<input
type="text"
onChange={this.handleChange}
placeholder="Search..."
placeholder="Tìm kiếm..."
defaultValue={this.props.value}
/>
);
Expand Down

0 comments on commit e875df9

Please sign in to comment.