Merge pull request #2 from reactjs/master

Updated

content/blog/2014-09-24-testing-flux-applications.md

@@ -17,7 +17,7 @@ The first steps toward working with Jest are as follows:
 
 1. Get the module dependencies for the application installed by running `npm install`.
 2. Create a directory `__tests__/` with a test file, in this case TodoStore-test.js
-3. Run `npm install jest-cli —save-dev`
+3. Run `npm install jest-cli --save-dev`
 4. Add the following to your package.json
 
 ```javascript

content/blog/2018-10-01-create-react-app-v2.md

@@ -25,7 +25,7 @@ Here's a short summary of what's new in this release:
 * 🃏 We updated to [Jest 23](https://jestjs.io/blog/2018/05/29/jest-23-blazing-fast-delightful-testing.html), which includes an [interactive mode](https://jestjs.io/blog/2018/05/29/jest-23-blazing-fast-delightful-testing#interactive-snapshot-mode) for reviewing snapshots.
 * 💄 We added [PostCSS](https://preset-env.cssdb.org/features#stage-3) so you can use new CSS features in old browsers.
 * 💎 You can use [Apollo](https://github.com/leoasis/graphql-tag.macro#usage), [Relay Modern](https://github.com/facebook/relay/pull/2171#issuecomment-411459604), [MDX](https://github.com/facebook/create-react-app/issues/5149#issuecomment-425396995), and other third-party [Babel Macros](https://babeljs.io/blog/2017/09/11/zero-config-with-babel-macros) transforms.
-* 🌠 You can now [import an SVG as a React component](https://github.com/facebook/create-react-app/blob/master/packages/react-scripts/template/README.md#adding-svgs), and use it in JSX.
+* 🌠 You can now [import an SVG as a React component](https://facebook.github.io/create-react-app/docs/adding-images-fonts-and-files#adding-svgs), and use it in JSX.
 * 🐈 You can try the experimental [Yarn Plug'n'Play mode](https://github.com/yarnpkg/rfcs/pull/101) that removes `node_modules`.
 * 🕸 You can now [plug your own proxy implementation](https://github.com/facebook/create-react-app/blob/master/packages/react-scripts/template/README.md#configuring-the-proxy-manually) in development to match your backend API.
 * 🚀 You can now use [packages written for latest Node versions](https://github.com/sindresorhus/ama/issues/446#issuecomment-281014491) without breaking the build.

content/blog/2019-02-06-react-v16.8.0.md

@@ -140,10 +140,10 @@ Assuming you already have ESLint installed, run:
 
 ```sh
 # npm
-npm install eslint-plugin-react-hooks@next --save-dev
+npm install eslint-plugin-react-hooks --save-dev
 
 # yarn
-yarn add eslint-plugin-react-hooks@next --dev
+yarn add eslint-plugin-react-hooks --dev
 ```
 
 Then add it to your ESLint configuration:

content/community/articles.md

@@ -10,7 +10,7 @@ permalink: community/articles.html
 - [9 things every React.js beginner should know](https://camjackson.net/post/9-things-every-reactjs-beginner-should-know) - Cam Jackson's guide for beginners.
 - [React "Aha" Moments](https://tylermcginnis.com/react-aha-moments/) - Tyler McGinnis' article on his collection of "Aha" moments with React.
 - [You're missing the point of React](https://medium.com/@dan_abramov/youre-missing-the-point-of-react-a20e34a51e1a) - Dan Abramov's article about the best parts of React.
-- [Timeline for Learning React](https://daveceddia.com/timeline-for-learning-react/) - Dave Ceddia's reccommended timeline for learning React and the React ecosystem.
+- [Timeline for Learning React](https://daveceddia.com/timeline-for-learning-react/) - Dave Ceddia's recommended timeline for learning React and the React ecosystem.
 - [Simple React Development in 2017](https://hackernoon.com/simple-react-development-in-2017-113bd563691f) - Joshua Comeau's guide to showcase how easy it can be to start modern React development.
 - [React FAQ](https://reactfaq.site/) - An external site with articles that try to answer frequently asked questions about React.
 - [Visual Guide to State in React](https://daveceddia.com/visual-guide-to-state-in-react/) - Dave Ceddia's visual guide to React state.

content/community/conferences.md

@@ -12,26 +12,21 @@ Do you know of a local React.js conference? Add it here! (Please keep the list c
 
 ## Upcoming Conferences {#upcoming-conferences}
 
-### Reactathon 2019 {#reactathon-2019}
-March 30-31, 2019 in San Francisco, USA
-
-[Website](https://www.reactathon.com/) - [Twitter](https://twitter.com/reactathon)
-
-### App.js Conf 2019 {#appjs-conf-2019}
-April 4-5, 2019 in Kraków, Poland
-
-[Website](https://appjs.co) - [Twitter](https://twitter.com/appjsconf)
-
-### React Amsterdam 2019 {#react-amsterdam-2019}
-April 12, 2019 in Amsterdam, The Netherlands
+### React Finland 2019 {#react-finland-2019}
+April 24-26 in Helsinki, Finland
 
-[Website](https://react.amsterdam) - [Twitter](https://twitter.com/reactamsterdam) - [Facebook](https://www.facebook.com/reactamsterdam)
+[Website](https://react-finland.fi/) - [Twitter](https://twitter.com/ReactFinland)
 
-### ReactJS Girls Conference 
+### ReactJS Girls Conference {#reactjs-girls-conference}
 May 3, 2019 in London, UK
 
 [Website](https://reactjsgirls.com/) - [Twitter](https://twitter.com/reactjsgirls)
 
+### <React.NotAConf /> 2019 {#reactnotaconf--2019}
+May 11 in Sofia, Bulgaria
+
+[Website](http://react-not-a-conf.com/) - [Twitter](https://twitter.com/reactnotaconf) - [Facebook](https://www.facebook.com/events/780891358936156)
+
 ### ReactEurope 2019 {#reacteurope-2019}
 May 23-24, 2019 in Paris, France
 
@@ -52,12 +47,12 @@ June 21, 2019 Chicago, Illinois USA
 
 [Website](https://reactloop.com) - [Twitter](https://twitter.com/ReactLoop)
 
-### Chain React 2019
+### Chain React 2019 {#chain-react-2019}
 July 11-12, 2019. Portland, OR, USA.
 
 [Website](https://infinite.red/ChainReactConf)
 
-### React Rally 2019
+### React Rally 2019 {#react-rally-2019}
 August 22-23, 2019. Salt Lake City, USA.
 
 [Website](https://www.reactrally.com/) - [Twitter](https://twitter.com/ReactRally) - [Instagram](https://www.instagram.com/reactrally/)
@@ -77,6 +72,11 @@ September 13th, 2019. New York, USA
 
 [Website](https://reactnewyork.com/) - [Twitter](https://twitter.com/reactnewyork)
 
+### React Boston 2019 {#react-boston-2019}
+September 21-22, 2019 in Boston, Massachusetts USA
+
+[Website](https://www.reactboston.com/) - [Twitter](https://twitter.com/reactboston)
+
 ### React India 2019 {#react-india-2019}
 September 26-28, 2019 in Goa, India
 
@@ -87,6 +87,16 @@ September 26-28, 2019 in Alicante, Spain
 
 [Website](http://reactalicante.es/) - [Twitter](https://twitter.com/reactalicante) - [Facebook](https://www.facebook.com/ReactAlicante)
 
+### React Advanced 2019 {#react-advanced-2019}
+October 25, 2019 in London, UK
+
+[Website](https://reactadvanced.com) - [Twitter](http://twitter.com/reactadvanced) - [Facebook](https://www.facebook.com/ReactAdvanced) - [Videos](https://youtube.com/c/ReactConferences)
+
+### React Day Berlin 2019 {#react-day-berlin-2019}
+December 6, 2019 in Berlin, Germany
+
+[Website](https://reactday.berlin) - [Twitter](https://twitter.com/reactdayberlin) - [Facebook](https://www.facebook.com/reactdayberlin/) - [Videos](https://www.youtube.com/reactdayberlin)
+
 ## Past Conferences {#past-conferences}
 
 ### React.js Conf 2015 {#reactjs-conf-2015}
@@ -114,7 +124,7 @@ February 22 & 23 in San Francisco, CA
 ### React Amsterdam 2016 {#react-amsterdam-2016}
 April 16 in Amsterdam, The Netherlands
 
-[Website](https://react.amsterdam/2016) - [Videos](https://youtu.be/sXDZBxbRRag?list=PLNBNS7NRGKMG3uLrm5fgY02hJ87Wzb4IU)
+[Website](https://react.amsterdam) - [Twitter](https://twitter.com/reactamsterdam) - [Facebook](https://www.facebook.com/reactamsterdam) - [Videos](https://youtube.com/c/ReactConferences)
 
 ### ReactEurope 2016 {#reacteurope-2016}
 June 2 & 3 in Paris, France
@@ -164,7 +174,7 @@ March 28th at the [QEII Centre, London](http://qeiicentre.london/)
 ### React Amsterdam 2017 {#react-amsterdam-2017}
 April 21st in Amsterdam, The Netherlands
 
-[Website](https://react.amsterdam) - [Twitter](https://twitter.com/reactamsterdam) - [Videos](https://www.youtube.com/watch?v=NQyL-Dm7Kig&list=PLNBNS7NRGKMHxfm0CcYNuINLdRw7r4a9M)
+[Website](https://react.amsterdam) - [Twitter](https://twitter.com/reactamsterdam) - [Videos](https://youtube.com/c/ReactConferences)
 
 ### ReactEurope 2017 {#reacteurope-2017}
 May 18th & 19th in Paris, France
@@ -360,3 +370,18 @@ November 30, Berlin, Germany
 January 31, 2019 in Tehran, Iran
 
 [Website](http://reactiran.com) - [Instagram](https://www.instagram.com/reactiran/)
+
+### Reactathon 2019 {#reactathon-2019}
+March 30-31, 2019 in San Francisco, USA
+
+[Website](https://www.reactathon.com/) - [Twitter](https://twitter.com/reactathon)
+
+### App.js Conf 2019 {#appjs-conf-2019}
+April 4-5, 2019 in Kraków, Poland
+
+[Website](https://appjs.co) - [Twitter](https://twitter.com/appjsconf)
+
+### React Amsterdam 2019 {#react-amsterdam-2019}
+April 12, 2019 in Amsterdam, The Netherlands
+
+[Website](https://react.amsterdam) - [Twitter](https://twitter.com/reactamsterdam) - [Facebook](https://www.facebook.com/reactamsterdam) - [Videos](https://youtube.com/c/ReactConferences)

content/community/nav.yml

@@ -1,4 +1,4 @@
-- title: Community Resources
+- title: Nguồn cộng đồng
   items:
     - id: support
       title: Support
@@ -18,7 +18,7 @@
       title: Videos
     - id: external-resources
       title: External Resources
-- title: Tools
+- title: Công cụ
   items:
     - id: debugging-tools
       title: Debugging

content/docs/add-react-to-a-website.md

@@ -149,7 +149,7 @@ return (
 
 These two code snippets are equivalent. While **JSX is [completely optional](/docs/react-without-jsx.html)**, many people find it helpful for writing UI code -- both with React and with other libraries.
 
-You can play with JSX using [this online converter](https://babeljs.io/repl#?babili=false&browsers=&build=&builtIns=false&spec=false&loose=false&code_lz=Q&debug=false&forceAllTransforms=false&shippedProposals=false&circleciRepo=&evaluate=false&fileSize=false&sourceType=module&lineWrap=true&presets=es2015%2Creact%2Cstage-2%2Cstage-3&prettier=true&targets=Node-6.12&version=6.26.0&envVersion=).
+You can play with JSX using [this online converter](https://babeljs.io/en/repl#?babili=false&browsers=&build=&builtIns=false&spec=false&loose=false&code_lz=DwIwrgLhD2B2AEcDCAbAlgYwNYF4DeAFAJTw4B88EAFmgM4B0tAphAMoQCGETBe86WJgBMAXJQBOYJvAC-RGWQBQ8FfAAyaQYuAB6cFDhkgA&debug=false&forceAllTransforms=false&shippedProposals=false&circleciRepo=&evaluate=false&fileSize=false&timeTravel=false&sourceType=module&lineWrap=true&presets=es2015%2Creact%2Cstage-2&prettier=false&targets=&version=7.4.3).
 
 ### Quickly Try JSX {#quickly-try-jsx}
 

content/docs/addons-shallow-compare.md

@@ -8,7 +8,7 @@ category: Reference
 
 > Note:
 >
-> `shallowCompare` is a legacy add-on. Use [`React.PureComponent`](/docs/react-api.html#reactpurecomponent) instead.
+> `shallowCompare` is a legacy add-on. Use [`React.memo`](/docs/react-api.html#reactmemo) or [`React.PureComponent`](/docs/react-api.html#reactpurecomponent) instead.
 
 **Importing**
 

content/docs/create-a-new-react-app.md

@@ -53,7 +53,7 @@ npm start
 
 Create React App doesn't handle backend logic or databases; it just creates a frontend build pipeline, so you can use it with any backend you want. Under the hood, it uses [Babel](https://babeljs.io/) and [webpack](https://webpack.js.org/), but you don't need to know anything about them.
 
-When you're ready to deploy to production, running `npm run build` will create an optimized build of your app in the `build` folder. You can learn more about Create React App [from its README](https://github.com/facebookincubator/create-react-app#create-react-app-) and the [User Guide](https://github.com/facebookincubator/create-react-app/blob/master/packages/react-scripts/template/README.md#table-of-contents).
+When you're ready to deploy to production, running `npm run build` will create an optimized build of your app in the `build` folder. You can learn more about Create React App [from its README](https://github.com/facebookincubator/create-react-app#create-react-app--) and the [User Guide](https://facebook.github.io/create-react-app/).
 
 ### Next.js {#nextjs}
 
@@ -69,7 +69,7 @@ Learn Gatsby from [its official guide](https://www.gatsbyjs.org/docs/) and a [ga
 
 ### More Flexible Toolchains {#more-flexible-toolchains}
 
-The following toolchains offer more flexiblity and choice. We recommend them to more experienced users:
+The following toolchains offer more flexibility and choice. We recommend them to more experienced users:
 
 - **[Neutrino](https://neutrinojs.org/)** combines the power of [webpack](https://webpack.js.org/) with the simplicity of presets, and includes a preset for [React apps](https://neutrinojs.org/packages/react/) and [React components](https://neutrinojs.org/packages/react-components/).
 

content/docs/faq-ajax.md

@@ -1,24 +1,24 @@
 ---
 id: faq-ajax
-title: AJAX and APIs
+title: AJAX và APIs
 permalink: docs/faq-ajax.html
 layout: docs
 category: FAQ
 ---
 
-### How can I make an AJAX call? {#how-can-i-make-an-ajax-call}
+### Làm như nào để gọi AJAX ? {#how-can-i-make-an-ajax-call}
 
-You can use any AJAX library you like with React. Some popular ones are [Axios](https://github.com/axios/axios), [jQuery AJAX](https://api.jquery.com/jQuery.ajax/), and the browser built-in [window.fetch](https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API).
+Bạn có thể sử dụng bất kỳ thư viện AJAX nào bạn thích với React. Một số thư viện phổ biến như [Axios](https://github.com/axios/axios), [jQuery AJAX](https://api.jquery.com/jQuery.ajax/), và trình duyệt tích hợp sẵn [window.fetch](https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API).
 
-### Where in the component lifecycle should I make an AJAX call? {#where-in-the-component-lifecycle-should-i-make-an-ajax-call}
+### Nên gọi AJAX ở đâu trong vòng đời component ? {#where-in-the-component-lifecycle-should-i-make-an-ajax-call}
 
-You should populate data with AJAX calls in the [`componentDidMount`](/docs/react-component.html#mounting) lifecycle method. This is so you can use `setState` to update your component when the data is retrieved.
+Bạn nên gọi AJAX ở componentDidMount của các phương thức vòng đời [`componentDidMount`](/docs/react-component.html#mounting). Điều này để bạn có thể sử dụng `setState` để cập nhật component khi có dữ liệu được lấy.
+<!-- ### Ví dụ: Using AJAX results to set local state {#example-using-ajax-results-to-set-local-state} -->
+### Ví dụ: Sử dụng dữ liệu của AJAX xét vào state   {#example-using-ajax-results-to-set-local-state}
 
-### Example: Using AJAX results to set local state {#example-using-ajax-results-to-set-local-state}
+Component dưới đây thể hiện cách thực hiện gọi AJAX trong `componentDidMount` để xét dữ liệu vào state. 
 
-The component below demonstrates how to make an AJAX call in `componentDidMount` to populate local component state. 
-
-The example API returns a JSON object like this:
+Ví dụ API trả về một object JSON như sau:
 
 ```
 {

content/docs/faq-build.md

@@ -1,32 +1,32 @@
 ---
 id: faq-build
-title: Babel, JSX, and Build Steps
+title: Babel, JSX, và từng bước xây dựng
 permalink: docs/faq-build.html
 layout: docs
 category: FAQ
 ---
 
-### Do I need to use JSX with React? {#do-i-need-to-use-jsx-with-react}
+### Tôi có cần phải sử dụng JSX với React không? {#do-i-need-to-use-jsx-with-react}
 
-No! Check out ["React Without JSX"](/docs/react-without-jsx.html) to learn more.
+Không! Hãy xem thử ["React không dùng JSX"](/docs/react-without-jsx.html) để hiểu thêm.
 
-### Do I need to use ES6 (+) with React? {#do-i-need-to-use-es6--with-react}
+### Tôi có cần phải sử dụng ES6 (+) với React? {#do-i-need-to-use-es6--with-react}
 
-No! Check out ["React Without ES6"](/docs/react-without-es6.html) to learn more.
+Không! Hãy xem thử ["React không dùng ES6"](/docs/react-without-es6.html) để hiểu thêm.
 
-### How can I write comments in JSX? {#how-can-i-write-comments-in-jsx}
+### Làm như nào để tôi viết comment trong JSX ? {#how-can-i-write-comments-in-jsx}
 
 ```jsx
 <div>
-  {/* Comment goes here */}
+  {/* Comment ở đây */}
   Hello, {name}!
 </div>
 ```
 
 ```jsx
 <div>
-  {/* It also works 
-  for multi-line comments. */}
+  {/* Nó cũng hoạt động 
+  cho nhiều dòng comments. */}
   Hello, {name}! 
 </div>
 ```

content/docs/faq-styling.md

@@ -1,14 +1,14 @@
 ---
 id: faq-styling
-title: Styling and CSS
+title: Styling và CSS
 permalink: docs/faq-styling.html
 layout: docs
 category: FAQ
 ---
 
-### How do I add CSS classes to components? {#how-do-i-add-css-classes-to-components}
+### Làm thế nào tôi chèn class CSS cho components? {#how-do-i-add-css-classes-to-components}
 
-Pass a string as the `className` prop:
+Truyền tên của class cho prop là `className`:
 
 ```jsx
 render() {
@@ -32,20 +32,20 @@ render() {
 >
 >If you often find yourself writing code like this, [classnames](https://www.npmjs.com/package/classnames#usage-with-reactjs) package can simplify it.
 
-### Can I use inline styles? {#can-i-use-inline-styles}
+### Tôi có dùng được inline styles? {#can-i-use-inline-styles}
 
-Yes, see the docs on styling [here](/docs/dom-elements.html#style).
+Có, xem tài liệu styling tại [đây](/docs/dom-elements.html#style).
 
-### Are inline styles bad? {#are-inline-styles-bad}
+### Viết inline styles xấu? {#are-inline-styles-bad}
 
-CSS classes are generally better for performance than inline styles.
+Các class CSS thường sẽ có hiệu xuất tốt hơn là inline styles.
 
-### What is CSS-in-JS? {#what-is-css-in-js}
+### CSS-in-JS là gì? {#what-is-css-in-js}
 
 "CSS-in-JS" refers to a pattern where CSS is composed using JavaScript instead of defined in external files. Read a comparison of CSS-in-JS libraries [here](https://github.com/MicheleBertoli/css-in-js).
 
 _Note that this functionality is not a part of React, but provided by third-party libraries._ React does not have an opinion about how styles are defined; if in doubt, a good starting point is to define your styles in a separate `*.css` file as usual and refer to them using [`className`](/docs/dom-elements.html#classname).
 
-### Can I do animations in React? {#can-i-do-animations-in-react}
+### Tôi có thể dùng animations trong React? {#can-i-do-animations-in-react}
 
-React can be used to power animations. See [React Transition Group](https://reactcommunity.org/react-transition-group/) and [React Motion](https://github.com/chenglou/react-motion), for example.
+React có thể sử dụng animations rất tốt. Xem ví dụ [React Transition Group](https://reactcommunity.org/react-transition-group/) và [React Motion](https://github.com/chenglou/react-motion).

content/docs/getting-started.md

@@ -99,7 +99,7 @@ Sometimes people find third-party books and video courses more helpful than the
 
 ### Advanced Concepts {#advanced-concepts}
 
-Once you're comfortable with the [main concepts](#main-concepts) and played with React a little bit, you might be interested in more advanced topics. This section will introduce you to the powerful, but less commonly used React features like [context](/docs/context.html) and [refs](/docs/refs-and-the-dom.html).
+Once you're comfortable with the [main concepts](/docs/hello-world.html) and played with React a little bit, you might be interested in more advanced topics. This section will introduce you to the powerful, but less commonly used React features like [context](/docs/context.html) and [refs](/docs/refs-and-the-dom.html).
 
 ### API Reference {#api-reference}
 
@@ -115,7 +115,7 @@ The [React blog](/blog/) is the official source for the updates from the React t
 
 You can also follow the [@reactjs account](https://twitter.com/reactjs) on Twitter, but you won't miss anything essential if you only read the blog.
 
-Not every React release deserves its own blog post, but you can find a detailed changelog for every release [in the `CHANGELOG.md` file in the React repository](https://github.com/facebook/react/blob/master/CHANGELOG.md), as well as on the [Releases](https://github.com/facebook/react) page.
+Not every React release deserves its own blog post, but you can find a detailed changelog for every release [in the `CHANGELOG.md` file in the React repository](https://github.com/facebook/react/blob/master/CHANGELOG.md), as well as on the [Releases](https://github.com/facebook/react/releases) page.
 
 ## Versioned Documentation {#versioned-documentation}