Merged
Conversation
|
Deploy preview for ko-reactjs-org ready! Built with commit 822543f |
taehwanno
requested changes
Apr 18, 2019
content/docs/state-and-lifecycle.md
Outdated
| ## Converting a Function to a Class {#converting-a-function-to-a-class} | ||
|
|
||
| You can convert a function component like `Clock` to a class in five steps: | ||
| ## 함수형에서 클래스로 변환하기 {#converting-a-function-to-a-class} |
content/docs/state-and-lifecycle.md
Outdated
| ## 함수형에서 클래스로 변환하기 {#converting-a-function-to-a-class} | ||
|
|
||
| 1. Create an [ES6 class](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Classes), with the same name, that extends `React.Component`. | ||
| 다섯 단계로 `Clock`과 같은 함수형 컴포넌트를 클래스로 변환할 수 있습니다. |
content/docs/state-and-lifecycle.md
Outdated
| 다섯 단계로 `Clock`과 같은 함수형 컴포넌트를 클래스로 변환할 수 있습니다. | ||
|
|
||
| 2. Add a single empty method to it called `render()`. | ||
| 1. `React.Component`를 확장하는 동일한 이름의 [ES6 class](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Classes)를 생성합니다. |
content/docs/state-and-lifecycle.md
Outdated
| ``` | ||
|
|
||
| 2) Add a [class constructor](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Classes#Constructor) that assigns the initial `this.state`: | ||
| 2) 초기 `this.state`를 지정하는 [클래스 constructor](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Classes#Constructor)를 추가합니다. |
Member
There was a problem hiding this comment.
클래스 constructor->class constructor클래스 컴포넌트는 허용되지만 class는 번역되면 안되는 용어입니다.- MDN 링크에 대해 자국어 번역본 링크로 변경 부탁드립니다.
content/docs/state-and-lifecycle.md
Outdated
| ## 생명주기 메서드를 클래스에 추가하기 {#adding-lifecycle-methods-to-a-class} | ||
|
|
||
| In applications with many components, it's very important to free up resources taken by the components when they are destroyed. | ||
| 많은 컴포넌트가 있는 응용프로그램에서 컴포넌트가 삭제될 때 해당 컴포넌트가 사용 중이던 리소스를 확보하는 것이 중요합니다. |
Member
There was a problem hiding this comment.
응용프로그램->애플리케이션(Translate Glossary)확보하는 것이 중요합니다.->정리하는 것이 중요합니다.free up의 번역에 대해 제안드려봐요.
Contributor
Author
There was a problem hiding this comment.
free up 을 확보하다 라는 의미로 번역하였는데 어떻게 생각하시나요!
content/docs/state-and-lifecycle.md
Outdated
| ``` | ||
|
|
||
| The merging is shallow, so `this.setState({comments})` leaves `this.state.posts` intact, but completely replaces `this.state.comments`. | ||
| T병합은 얕게 이루어지기 때문에 `this.setState({comments})`는 `this.state.posts`에 영향을 주진 않지만 `this.state.comments`는 완전히 대체됩니다. |
content/docs/state-and-lifecycle.md
Outdated
| T병합은 얕게 이루어지기 때문에 `this.setState({comments})`는 `this.state.posts`에 영향을 주진 않지만 `this.state.comments`는 완전히 대체됩니다. | ||
|
|
||
| ## The Data Flows Down {#the-data-flows-down} | ||
| ## 데이터 흐름은 아래로 {#the-data-flows-down} |
Member
There was a problem hiding this comment.
다른 h2 제목과 맞추기 위해 데이터는 아래로 흐릅니다.로 제안드려요.
content/docs/state-and-lifecycle.md
Outdated
| ## 데이터 흐름은 아래로 {#the-data-flows-down} | ||
|
|
||
| Neither parent nor child components can know if a certain component is stateful or stateless, and they shouldn't care whether it is defined as a function or a class. | ||
| 부모 컴포넌트나 자식 컴포넌트 모두 특정 컴포넌트가 유상태인지 또는 무상태인지 알 수 없고, 그들이 함수형이나 클래스로 정의되었는지에 대해서 관심을 가질 필요가 없습니다. |
content/docs/state-and-lifecycle.md
Outdated
| 일반적으로 이를 "하향식(top-down)" 또는 "단방향식" 데이터 흐름이라고 합니다. 모든 state는 항상 특정한 컴포넌트가 소유하고 있으며 그 state로부터 파생된 UI 또는 데이터는 오직 트리구조에서 자신의 "아래"에 있는 컴포넌트에만 영향을 미칩니다. | ||
|
|
||
| If you imagine a component tree as a waterfall of props, each component's state is like an additional water source that joins it at an arbitrary point but also flows down. | ||
| 트리구조가 prop들의 폭포라고 상상하면 각 컴포넌트의 state는 임의의 점에서 만나지만 동시에 아래로 흐르는 부가적인 수원이라고 할 수 있습니다. |
Member
There was a problem hiding this comment.
prop->props수원보다 좋은 표현이 아직까지 떠오르지 않는데 한자어라 그런지 와닿지 않는거 같아요.수원(water source)처럼 영어와 같이 병기하는게 어떨까요?
Contributor
Author
There was a problem hiding this comment.
사실 저도 수원이라는게 말이 전혀 와닿지 않는거 같네요! 병기해서 표기하도록 할께요 감사합니다!
content/docs/state-and-lifecycle.md
Outdated
| 트리구조가 prop들의 폭포라고 상상하면 각 컴포넌트의 state는 임의의 점에서 만나지만 동시에 아래로 흐르는 부가적인 수원이라고 할 수 있습니다. | ||
|
|
||
| To show that all components are truly isolated, we can create an `App` component that renders three `<Clock>`s: | ||
| 모든 컴포넌트가 완전히 독립적이라는 것을 보여주기 위해 `App`와 렌더링하는 세 개의 `<Clock>`을 만들었습니다. |
Contributor
Author
|
리뷰 감사합니다 빠르게 수정하도록 하겠습니다! |
Contributor
Author
|
리뷰해주신거 다 반영했습니다! |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Progress