Skip to content

Commit a320548

Browse files
authored
Merge branch 'master' into hooks-state-id
2 parents caa9139 + 91ba071 commit a320548

File tree

183 files changed

+8560
-4292
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

183 files changed

+8560
-4292
lines changed

.eslintignore

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,4 +7,4 @@ content/*
77
public/*
88

99
# Ignore examples
10-
examples/*
10+
examples/*

CODE_OF_CONDUCT.md

Lines changed: 74 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,76 @@
11
# Code of Conduct
22

3-
Facebook has adopted a Code of Conduct that we expect project participants to adhere to.
4-
Please read the [full text](https://code.fb.com/codeofconduct/)
5-
so that you can understand what actions will and will not be tolerated.
3+
## Our Pledge
4+
5+
In the interest of fostering an open and welcoming environment, we as
6+
contributors and maintainers pledge to make participation in our project and
7+
our community a harassment-free experience for everyone, regardless of age, body
8+
size, disability, ethnicity, sex characteristics, gender identity and expression,
9+
level of experience, education, socio-economic status, nationality, personal
10+
appearance, race, religion, or sexual identity and orientation.
11+
12+
## Our Standards
13+
14+
Examples of behavior that contributes to creating a positive environment
15+
include:
16+
17+
* Using welcoming and inclusive language
18+
* Being respectful of differing viewpoints and experiences
19+
* Gracefully accepting constructive criticism
20+
* Focusing on what is best for the community
21+
* Showing empathy towards other community members
22+
23+
Examples of unacceptable behavior by participants include:
24+
25+
* The use of sexualized language or imagery and unwelcome sexual attention or
26+
advances
27+
* Trolling, insulting/derogatory comments, and personal or political attacks
28+
* Public or private harassment
29+
* Publishing others' private information, such as a physical or electronic
30+
address, without explicit permission
31+
* Other conduct which could reasonably be considered inappropriate in a
32+
professional setting
33+
34+
## Our Responsibilities
35+
36+
Project maintainers are responsible for clarifying the standards of acceptable
37+
behavior and are expected to take appropriate and fair corrective action in
38+
response to any instances of unacceptable behavior.
39+
40+
Project maintainers have the right and responsibility to remove, edit, or
41+
reject comments, commits, code, wiki edits, issues, and other contributions
42+
that are not aligned to this Code of Conduct, or to ban temporarily or
43+
permanently any contributor for other behaviors that they deem inappropriate,
44+
threatening, offensive, or harmful.
45+
46+
## Scope
47+
48+
This Code of Conduct applies within all project spaces, and it also applies when
49+
an individual is representing the project or its community in public spaces.
50+
Examples of representing a project or community include using an official
51+
project e-mail address, posting via an official social media account, or acting
52+
as an appointed representative at an online or offline event. Representation of
53+
a project may be further defined and clarified by project maintainers.
54+
55+
## Enforcement
56+
57+
Instances of abusive, harassing, or otherwise unacceptable behavior may be
58+
reported by contacting the project team at <[email protected]>. All
59+
complaints will be reviewed and investigated and will result in a response that
60+
is deemed necessary and appropriate to the circumstances. The project team is
61+
obligated to maintain confidentiality with regard to the reporter of an incident.
62+
Further details of specific enforcement policies may be posted separately.
63+
64+
Project maintainers who do not follow or enforce the Code of Conduct in good
65+
faith may face temporary or permanent repercussions as determined by other
66+
members of the project's leadership.
67+
68+
## Attribution
69+
70+
This Code of Conduct is adapted from the [Contributor Covenant][homepage], version 1.4,
71+
available at https://www.contributor-covenant.org/version/1/4/code-of-conduct.html
72+
73+
[homepage]: https://www.contributor-covenant.org
74+
75+
For answers to common questions about this code of conduct, see
76+
https://www.contributor-covenant.org/faq

README.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -49,7 +49,7 @@ The documentation is divided into several sections with a different tone and pur
4949

5050
### Push it
5151

52-
1. `git add -A && git commit -m "My message"` (replacing `My message` with a commit message, such as `Fixed header logo on Android`) to stage and commit your changes
52+
1. `git add -A && git commit -m "My message"` (replacing `My message` with a commit message, such as `Fix header logo on Android`) to stage and commit your changes
5353
1. `git push my-fork-name the-name-of-my-branch`
5454
1. Go to the [id.reactjs.org repo](https://github.com/reactjs/id.reactjs.org) and you should see recently pushed branches.
5555
1. Follow GitHub's instructions.

TRANSLATION.md

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -7,12 +7,12 @@ Berikut adalah panduan-panduan dasar dalam penerjemahan situs reactjs.org ke Bah
77
Untuk menjalankan situs id.reactjs.org secara lokal, ikuti langkah-langkah berikut:
88

99
1. Unduh dan instalasi [Git](https://git-scm.com/), [Node.js](https://nodejs.org/en/), dan [Yarn](https://yarnpkg.com/en/).
10-
2. Buatlah *fork* dari repositori id.reactjs.org di akun anda, kemudian *clone* repositori tersebut.
10+
2. Buatlah *fork* dari repositori id.reactjs.org di akun Anda, kemudian *clone* repositori tersebut.
1111
3. Jalankan `yarn` di terminal untuk menginstalasi dependensi yang dibutuhkan.
1212
4. Jalankan `yarn dev` untuk menjalankan *server* lokal.
13-
5. Buka alamat `localhost:8000` dalam peramban web anda.
13+
5. Buka alamat `localhost:8000` dalam peramban web Anda.
1414

15-
Konten dari situs id.reactjs.org terdapat dalam folder `content`, dan disimpan dalam format Markdown. Buka proyek id.reactjs.org dalam program penyunting teks anda, dan mulailah menyunting. Konten dalam situs lokal akan diperbarui secara otomatis.
15+
Konten dari situs id.reactjs.org terdapat dalam folder `content`, dan disimpan dalam format Markdown. Buka proyek id.reactjs.org dalam program penyunting teks Anda, dan mulailah menyunting. Konten dalam situs lokal akan diperbarui secara otomatis.
1616

1717
## Klaim Halaman Supaya Tidak Ada Pekerjaan Ganda
1818

@@ -28,6 +28,7 @@ Referensi panduan penulisan Bahasa Indonesia lainnya yang dapat digunakan adalah
2828

2929
* [Pedoman Umum Ejaan Bahasa Indonesia (PUEBI)](https://puebi.readthedocs.io/en/latest/)
3030
* [Kamus Besar Bahasa Indonesia (KBBI)](https://kbbi.kemdikbud.go.id/)
31+
* [RSNI3 8527:2018 - Glosarium Istilah Teknologi Informasi](https://github.com/jk8s/sig-docs-id/raw/master/resources/RSNI-glossarium.pdf)
3132

3233
### *Heading ID*
3334

content/authors.yml

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -73,6 +73,9 @@ sophiebits:
7373
steveluscher:
7474
name: Steven Luscher
7575
url: https://twitter.com/steveluscher
76+
tesseralis:
77+
name: Nat Alison
78+
url: https://twitter.com/tesseralis
7679
timer:
7780
name: Joe Haddad
7881
url: https://twitter.com/timer150

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

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,7 @@ The first steps toward working with Jest are as follows:
1717

1818
1. Get the module dependencies for the application installed by running `npm install`.
1919
2. Create a directory `__tests__/` with a test file, in this case TodoStore-test.js
20-
3. Run `npm install jest-cli save-dev`
20+
3. Run `npm install jest-cli --save-dev`
2121
4. Add the following to your package.json
2222

2323
```javascript

content/blog/2015-03-30-community-roundup-26.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -29,7 +29,7 @@ Colin also [blogged about his experience using React Native](http://blog.scottlo
2929

3030
Spencer Ahrens and I had the great pleasure to talk about React Native on [The Changelog](https://thechangelog.com/149/) podcast. It was really fun to chat for an hour, I hope that you'll enjoy listening to it. :)
3131

32-
<audio src="http://fdlyr.co/d/changelog/cdn.5by5.tv/audio/broadcasts/changelog/2015/changelog-149.mp3" controls="controls" style="width: 100%"></audio>
32+
<audio src="https://cdn.changelog.com/uploads/podcast/149/the-changelog-149.mp3" controls="controls" style="width: 100%"></audio>
3333

3434

3535
## Hacker News {#hacker-news}

content/blog/2015-08-11-relay-technical-preview.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,7 @@ While React simplified the process of developing complex user-interfaces, it lef
1313

1414
Declarative data-fetching means that Relay applications specify *what* data they need, not *how* to fetch that data. Just as React uses a description of the desired UI to manage view updates, Relay uses a data description in the form of GraphQL queries. Given these descriptions, Relay coalesces queries into batches for efficiency, manages error-prone asynchronous logic, caches data for performance, and automatically updates views as data changes.
1515

16-
Relay is also component-oriented, extending the notion of a React component to include a description of what data is necessary to render it. This colocation allows developers to reason locally about their application and eliminates bugs such as under- or over-fetching data.
16+
Relay is also component-oriented, extending the notion of a React component to include a description of what data is necessary to render it. This collocation allows developers to reason locally about their application and eliminates bugs such as under- or over-fetching data.
1717

1818
Relay is in use at Facebook in production apps, and we're using it more and more because *Relay lets developers focus on their products and move fast*. It's working for us and we'd like to share it with the community.
1919

content/blog/2015-09-02-new-react-developer-tools.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,7 @@ It contains a handful of new features, including:
2020

2121
## Installation {#installation}
2222

23-
Download the new devtools from the [Chrome Web Store](https://chrome.google.com/webstore/detail/react-developer-tools/fmkadmapgofadopljbjfkapdkoienihi) and on [Mozilla Add-ons](https://addons.mozilla.org/en-US/firefox/addon/react-devtools/) for Firefox. If you're developing using React, we highly recommend installing these devtools.
23+
Download the new devtools from the [Chrome Web Store](https://chrome.google.com/webstore/detail/react-developer-tools/fmkadmapgofadopljbjfkapdkoienihi) and on [Firefox Add-ons](https://addons.mozilla.org/en-US/firefox/addon/react-devtools/) for Firefox. If you're developing using React, we highly recommend installing these devtools.
2424

2525
If you already have the Chrome extension installed, it should autoupdate within the next week. You can also head to `chrome://extensions` and click "Update extensions now" if you'd like to get the new version today. If you installed the devtools beta, please remove it and switch back to the version from the store to make sure you always get the latest updates and bug fixes.
2626

content/blog/2017-07-26-error-handling-in-react-16.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -111,4 +111,4 @@ Error boundaries preserve the declarative nature of React, and behave as you wou
111111

112112
React 15 included a very limited support for error boundaries under a different method name: `unstable_handleError`. This method no longer works, and you will need to change it to `componentDidCatch` in your code starting from the first 16 beta release.
113113

114-
For this change, we’ve provided [a codemod](https://github.com/reactjs/react-codemod#error-boundaries) to automatically migrate your code.
114+
For this change, we’ve provided a [codemod](https://github.com/reactjs/react-codemod#error-boundaries) to automatically migrate your code.

content/blog/2018-03-27-update-on-async-rendering.md

Lines changed: 10 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -25,6 +25,15 @@ These lifecycle methods have often been misunderstood and subtly misused; furthe
2525

2626
We maintain over 50,000 React components at Facebook, and we don't plan to rewrite them all immediately. We understand that migrations take time. We will take the gradual migration path along with everyone in the React community.
2727

28+
If you don't have the time to migrate or test these components, we recommend running a ["codemod"](https://medium.com/@cpojer/effective-javascript-codemods-5a6686bb46fb) script that renames them automatically:
29+
30+
```bash
31+
cd your_project
32+
npx react-codemod rename-unsafe-lifecycles
33+
```
34+
35+
Learn more about this codemod on the [16.9.0 release post.](https://reactjs.org/blog/2019/08/08/react-v16.9.0.html#renaming-unsafe-lifecycle-methods)
36+
2837
---
2938

3039
## Migrating from Legacy Lifecycles {#migrating-from-legacy-lifecycles}
@@ -134,7 +143,7 @@ Here is an example of a component that uses the legacy `componentWillReceiveProp
134143

135144
Although the above code is not problematic in itself, the `componentWillReceiveProps` lifecycle is often mis-used in ways that _do_ present problems. Because of this, the method will be deprecated.
136145

137-
As of version 16.3, the recommended way to update `state` in response to `props` changes is with the new `static getDerivedStateFromProps` lifecycle. (That lifecycle is called when a component is created and each time it receives new props):
146+
As of version 16.3, the recommended way to update `state` in response to `props` changes is with the new `static getDerivedStateFromProps` lifecycle. It is called when a component is created and each time it re-renders due to changes to props or state:
138147
`embed:update-on-async-rendering/updating-state-from-props-after.js`
139148

140149
You may notice in the example above that `props.currentRow` is mirrored in state (as `state.lastRow`). This enables `getDerivedStateFromProps` to access the previous props value in the same way as is done in `componentWillReceiveProps`.

content/blog/2018-09-10-introducing-the-react-profiler.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -140,7 +140,7 @@ It also shows that each time it rendered, it was the most "expensive" component
140140

141141
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.
142142
You can return to the previous chart by clicking the "x" button in the right detail pane.
143-
You can aso double click on a particular bar to view more information about that commit.
143+
You can also double click on a particular bar to view more information about that commit.
144144

145145
![How to view all renders for a specific component](../images/blog/introducing-the-react-profiler/see-all-commits-for-a-fiber.gif)
146146

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

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -25,7 +25,7 @@ Here's a short summary of what's new in this release:
2525
* 🃏 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.
2626
* 💄 We added [PostCSS](https://preset-env.cssdb.org/features#stage-3) so you can use new CSS features in old browsers.
2727
* 💎 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.
28-
* 🌠 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.
28+
* 🌠 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.
2929
* 🐈 You can try the experimental [Yarn Plug'n'Play mode](https://github.com/yarnpkg/rfcs/pull/101) that removes `node_modules`.
3030
* 🕸 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.
3131
* 🚀 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/2018-11-27-react-16-roadmap.md

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,11 @@ author: [gaearon]
44
---
55

66
You might have heard about features like "Hooks", "Suspense", and "Concurrent Rendering" in the previous blog posts and talks. In this post, we'll look at how they fit together and the expected timeline for their availability in a stable release of React.
7+
8+
> An Update from August, 2019
9+
>
10+
> You can find an update to this roadmap in the [React 16.9 release blog post](/blog/2019/08/08/react-v16.9.0.html#an-update-to-the-roadmap).
11+
712

813
## tl;dr {#tldr}
914

@@ -170,7 +175,7 @@ function App() {
170175
// provide Suspense integrations with similar APIs.
171176
```
172177

173-
There is no official documentation for how to fetch data with Suspense yet, but you can find some early information in [this talk](https://youtu.be/ByBPyMBTzM0?t=1312) and [this small demo](https://github.com/facebook/react/tree/master/fixtures/unstable-async/suspense). We'll write documentation for React Cache (and how to write your own Suspense-compatible library) closer to this React release, but if you're curious, you can find its very early source code [here](https://github.com/facebook/react/blob/master/packages/react-cache/src/ReactCache.js).
178+
There is no official documentation for how to fetch data with Suspense yet, but you can find some early information in [this talk](https://youtu.be/ByBPyMBTzM0?t=1312) and [this small demo](https://github.com/facebook/react/blob/master/packages/react-devtools/CHANGELOG.md#suspense-toggle). We'll write documentation for React Cache (and how to write your own Suspense-compatible library) closer to this React release, but if you're curious, you can find its very early source code [here](https://github.com/facebook/react/blob/master/packages/react-cache/src/ReactCache.js).
174179

175180
The low-level Suspense mechanism (suspending rendering and showing a fallback) is expected to be stable even in React 16.6. We've used it for code splitting in production for months. However, the higher-level APIs for data fetching are very unstable. React Cache is rapidly changing, and will change at least a few more times. There are some low-level APIs that are [missing](https://github.com/reactjs/rfcs/pull/89) for a good higher-level API to be possible. We don't recommend using React Cache anywhere except very early experiments. Note that React Cache itself isn't strictly tied to React releases, but the current alphas lack basic features as cache invalidation, and you'll run into a wall very soon. We expect to have something usable with this React release.
176181

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

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -50,7 +50,7 @@ Even while Hooks were in alpha, the React community created many interesting [ex
5050

5151
## Testing Hooks {#testing-hooks}
5252

53-
We have added a new API called `ReactTestUtils.act()` in this release. It ensures that the behavior in your tests matches what happens in the browser more closely. We recommend to wrap any code rendering and triggering updates to your components into `act()` calls. Testing libraries can also wrap their APIs with it (for example, [`react-testing-library`](https://github.com/kentcdodds/react-testing-library)'s `render` and `fireEvent` utilities do this).
53+
We have added a new API called `ReactTestUtils.act()` in this release. It ensures that the behavior in your tests matches what happens in the browser more closely. We recommend to wrap any code rendering and triggering updates to your components into `act()` calls. Testing libraries can also wrap their APIs with it (for example, [`react-testing-library`](https://testing-library.com/react)'s `render` and `fireEvent` utilities do this).
5454

5555
For example, the counter example from [this page](/docs/hooks-effect.html) can be tested like this:
5656

@@ -95,7 +95,7 @@ The calls to `act()` will also flush the effects inside of them.
9595

9696
If you need to test a custom Hook, you can do so by creating a component in your test, and using your Hook from it. Then you can test the component you wrote.
9797

98-
To reduce the boilerplate, we recommend using [`react-testing-library`](https://git.io/react-testing-library) which is designed to encourage writing tests that use your components as the end users do.
98+
To reduce the boilerplate, we recommend using [`react-testing-library`](https://testing-library.com/react) which is designed to encourage writing tests that use your components as the end users do.
9999

100100
## Thanks {#thanks}
101101

@@ -140,10 +140,10 @@ Assuming you already have ESLint installed, run:
140140

141141
```sh
142142
# npm
143-
npm install eslint-plugin-react-hooks@next --save-dev
143+
npm install eslint-plugin-react-hooks --save-dev
144144

145145
# yarn
146-
yarn add eslint-plugin-react-hooks@next --dev
146+
yarn add eslint-plugin-react-hooks --dev
147147
```
148148

149149
Then add it to your ESLint configuration:

0 commit comments

Comments
 (0)