Skip to content

Sync with reactjs.org @ 8f9ef00d #266

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Closed
wants to merge 13 commits into from
Closed
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Original file line number Diff line number Diff line change
Expand Up @@ -192,7 +192,7 @@ If you are using [eslint-plugin-react](https://github.com/yannickcr/eslint-plugi

### TypeScript {#typescript}

TypeScript supports the new JSX transform in [v4.1 beta](https://devblogs.microsoft.com/typescript/announcing-typescript-4-1-beta/#jsx-factories).
TypeScript supports the new JSX transform in [v4.1](https://devblogs.microsoft.com/typescript/announcing-typescript-4-1/#jsx-factories) and up.

### Flow {#flow}

Expand Down
10 changes: 5 additions & 5 deletions content/community/conferences.md
Original file line number Diff line number Diff line change
Expand Up @@ -12,11 +12,6 @@ Do you know of a local React.js conference? Add it here! (Please keep the list c

## Upcoming Conferences {#upcoming-conferences}

### React Summit 2020 {#react-summit-2020}
October 15-16, 2020, 7am PST / 10am EST / 4pm CEST - remote event

[Website](https://reactsummit.com) - [Twitter](https://twitter.com/reactsummit) - [Facebook](https://www.facebook.com/reactamsterdam) - [Videos](https://youtube.com/c/ReactConferences)

### React Conf Brasil 2020 {#react-conf-brasil-2020}
November 21, 2020 - remote event

Expand Down Expand Up @@ -475,3 +470,8 @@ May 14-15, 2020 in Paris, France
September 3-4, 2020 - remote event

[Website](https://www.react-native.eu/) - [Twitter](https://twitter.com/react_native_eu) - [Facebook](https://www.facebook.com/reactnativeeu/) - [YouTube](https://www.youtube.com/watch?v=m0GfmlGFh3E&list=PLZ3MwD-soTTHy9_88QPLF8DEJkvoB5Tl-) - [Instagram](https://www.instagram.com/reactnative_eu/)

### React Summit 2020 {#react-summit-2020}
October 15-16, 2020, 7am PST / 10am EST / 4pm CEST - remote event

[Website](https://reactsummit.com) - [Twitter](https://twitter.com/reactsummit) - [Facebook](https://www.facebook.com/reactamsterdam) - [Videos](https://youtube.com/c/ReactConferences)
3 changes: 3 additions & 0 deletions content/community/meetups.md
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,9 @@ permalink: community/meetups.html

Do you have a local React.js meetup? Add it here! (Please keep the list alphabetical)

## Albania {#albania}
* [Tirana](https://www.meetup.com/React-User-Group-Albania/)

## Argentina {#argentina}
* [Rosario](https://www.meetup.com/es/reactrosario)

Expand Down
4 changes: 2 additions & 2 deletions content/docs/addons-perf.md
Original file line number Diff line number Diff line change
Expand Up @@ -27,8 +27,8 @@ In addition to giving you an overview of your app's overall performance, `Perf`
See these articles for an introduction to React performance tooling:

- ["How to Benchmark React Components"](https://medium.com/code-life/how-to-benchmark-react-components-the-quick-and-dirty-guide-f595baf1014c)
- ["Performance Engineering with React"](https://benchling.engineering/performance-engineering-with-react/)
- ["A Deep Dive into React Perf Debugging"](https://benchling.engineering/deep-dive-react-perf-debugging/)
- ["Performance Engineering with React"](https://benchling.engineering/performance-engineering-with-react-e03013e53285)
- ["A Deep Dive into React Perf Debugging"](https://benchling.engineering/a-deep-dive-into-react-perf-debugging-fd2063f5a667)

### Development vs. Production Builds {#development-vs-production-builds}

Expand Down
2 changes: 1 addition & 1 deletion content/docs/higher-order-components.md
Original file line number Diff line number Diff line change
Expand Up @@ -320,7 +320,7 @@ Higher-order components come with a few caveats that aren't immediately obvious

### Don't Use HOCs Inside the render Method {#dont-use-hocs-inside-the-render-method}

React's diffing algorithm (called reconciliation) uses component identity to determine whether it should update the existing subtree or throw it away and mount a new one. If the component returned from `render` is identical (`===`) to the component from the previous render, React recursively updates the subtree by diffing it with the new one. If they're not equal, the previous subtree is unmounted completely.
React's diffing algorithm (called [Reconciliation](/docs/reconciliation.html)) uses component identity to determine whether it should update the existing subtree or throw it away and mount a new one. If the component returned from `render` is identical (`===`) to the component from the previous render, React recursively updates the subtree by diffing it with the new one. If they're not equal, the previous subtree is unmounted completely.

Normally, you shouldn't need to think about this. But it matters for HOCs because it means you can't apply a HOC to a component within the render method of a component:

Expand Down
2 changes: 1 addition & 1 deletion content/docs/legacy-event-pooling.md
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@ permalink: docs/legacy-event-pooling.html
>
>[Read more](/blog/2020/08/10/react-v17-rc.html#no-event-pooling) about this change in React 17.

The [`SyntheticEvent`](/docs/events.html) objects are pooled. This means that the `SyntheticEvent` object will be reused and all properties will be nullified after the event event handler has been called. For example, this won't work:
The [`SyntheticEvent`](/docs/events.html) objects are pooled. This means that the `SyntheticEvent` object will be reused and all properties will be nullified after the event handler has been called. For example, this won't work:

```javascript
function handleChange(e) {
Expand Down
4 changes: 4 additions & 0 deletions content/docs/reference-javascript-environment-requirements.md
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,11 @@ category: Reference
permalink: docs/javascript-environment-requirements.html
---

<<<<<<< HEAD
React 16 버전은 컬렉션 자료형인 [Map](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map)과 [Set](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Set)을 사용합니다. 이 기능을 자체적으로 지원하지 않거나(예. IE 11 미만) 지원은 하지만 잘 호환되지 않는(예. IE 11) 오래된 브라우저나 기기에서도 React를 사용해야 한다면 애플리케이션에 [core-js](https://github.com/zloirock/core-js)나 [babel-polyfill](https://babeljs.io/docs/usage/polyfill/) 같은 전역 폴리필(polyfill)을 포함하는 것도 고려해보세요.
=======
React 16 depends on the collection types [Map](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map) and [Set](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Set). If you support older browsers and devices which may not yet provide these natively (e.g. IE < 11) or which have non-compliant implementations (e.g. IE 11), consider including a global polyfill in your bundled application, such as [core-js](https://github.com/zloirock/core-js).
>>>>>>> 8f9ef00db1b36ee3e5a0e6072eb601257a6f8ccb

다음은 오래된 브라우저 지원을 위해 core-js 폴리필을 적용한 환경에서 React 16 버전을 사용하는 예시입니다.

Expand Down
10 changes: 10 additions & 0 deletions content/docs/reference-react-component.md
Original file line number Diff line number Diff line change
Expand Up @@ -406,7 +406,17 @@ class ErrorBoundary extends React.Component {
}
```

<<<<<<< HEAD
> 주의
=======
Production and development builds of React slightly differ in the way `componentDidCatch()` handles errors.

On development, the errors will bubble up to `window`, this means that any `window.onerror` or `window.addEventListener('error', callback)` will intercept the errors that have been caught by `componentDidCatch()`.

On production, instead, the errors will not bubble up, which means any ancestor error handler will only receive errors not explicitly caught by `componentDidCatch()`.

> Note
>>>>>>> 8f9ef00db1b36ee3e5a0e6072eb601257a6f8ccb
>
> 오류 이벤트 내에서는 `setState()`의 호출을 통하여 `componentDidCatch()`로 구현된 대체 UI를 렌더링할 수 있습니다. 하지만 이런 방식은 나중 릴리즈에서는 사용할 수 없게 을 것입니다.
> 대체 UI 렌더링 제어를 하려면 `static getDerivedStateFromError()`를 대신 사용하세요.
Expand Down
4 changes: 4 additions & 0 deletions content/docs/typechecking-with-proptypes.md
Original file line number Diff line number Diff line change
Expand Up @@ -98,7 +98,11 @@ MyComponent.propTypes = {
// 경고가 보이도록 할 수 있습니다.
requiredFunc: PropTypes.func.isRequired,

<<<<<<< HEAD
// 모든 데이터 타입이 가능한 값
=======
// A required value of any data type
>>>>>>> 8f9ef00db1b36ee3e5a0e6072eb601257a6f8ccb
requiredAny: PropTypes.any.isRequired,

// 사용자 정의 유효성 검사기를 지정할 수도 있습니다.
Expand Down
4 changes: 4 additions & 0 deletions content/docs/uncontrolled-components.md
Original file line number Diff line number Diff line change
Expand Up @@ -45,7 +45,11 @@ class NameForm extends React.Component {

### 기본 값 {#default-values}

<<<<<<< HEAD
React 렌더링 생명주기에서 폼 엘리먼트의 `value` 어트리뷰트는 DOM의 value를 대체합니다. 비제어 컴포넌트를 사용하면 React 초깃값을 지정하지만, 그 이후의 업데이트는 제어하지 않는 것이 좋습니다. 이러한 경우에 `value` 어트리뷰트 대신 `defaultValue`를 지정할 수 있습니다.
=======
In the React rendering lifecycle, the `value` attribute on form elements will override the value in the DOM. With an uncontrolled component, you often want React to specify the initial value, but leave subsequent updates uncontrolled. To handle this case, you can specify a `defaultValue` attribute instead of `value`. Changing the value of `defaultValue` attribute after a component has mounted will not cause any update of the value in the DOM.
>>>>>>> 8f9ef00db1b36ee3e5a0e6072eb601257a6f8ccb

```javascript{7}
render() {
Expand Down
4 changes: 2 additions & 2 deletions src/html.js
Original file line number Diff line number Diff line change
Expand Up @@ -65,8 +65,8 @@ export default class HTML extends React.Component<Props> {
storageId: 'reactjs_banner_2020survey',
normalHeight: 50,
smallHeight: 75,
campaignStartDate: '2020-10-05Z', // the Z is for UTC
campaignEndDate: '2020-10-19Z', // the Z is for UTC
campaignStartDate: '2020-10-05T00:00:00Z', // the Z is for UTC
campaignEndDate: '2020-10-19T00:00:00Z', // the Z is for UTC
snoozeForDays: 7,
};

Expand Down