Skip to content

docs(typo): fix typo 'props' linted by textlint #1063

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.

Sign up for GitHub

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

Merged
merged 2 commits into from
Oct 8, 2024
Merged

docs(typo): fix typo 'props' linted by textlint #1063

Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
3eee3c7
docs(typo): fix typo 'props' linted by textlint
lumirlumir Sep 30, 2024
8420ba0
Merge branch 'main' into docs-typo-props-textlint
lumirlumir Oct 1, 2024
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
6 changes: 2 additions & 4 deletions src/content/learn/keeping-components-pure.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -219,14 +219,12 @@ React에선, **사이드 이펙트는 보통 [이벤트 핸들러](/learn/respon
* **자신의 일에 집중합니다.** 렌더링전에 존재했던 객체나 변수를 변경하지 않아야 합니다.
* **같은 입력, 같은 결과물.** 입력이 같을 경우, 컴포넌트는 항상 같은 JSX를 반환해야 합니다.
* 렌더링은 언제든지 발생할 수 있으므로 컴포넌트는 서로의 렌더링 순서에 의존하지 않아야 합니다.
* 컴포넌트가 렌더링을 위해 사용되는 입력을 변형해서는 안 됩니다. 여기에는 프로퍼티즈, 상태, 그리고 컨텍스트가 포함됩니다. 화면을 업데이트하려면 기존 객체를 변환하는 대신 [상태를 "설정"](/learn/state-a-components-memory)하십시오.
* 컴포넌트가 렌더링을 위해 사용되는 입력을 변형해서는 안 됩니다. 여기에는 Props, 상태, 그리고 컨텍스트가 포함됩니다. 화면을 업데이트하려면 기존 객체를 변환하는 대신 [상태를 "설정"](/learn/state-a-components-memory)하십시오.
* 반환하는 JSX에서 컴포넌트의 로직을 표현하기 위해 노력하십시오. "무언가를 변경"해야 할 경우 일반적으로 이벤트 핸들러에서 변경하고 싶을 것입니다. 마지막 수단으로 `useEffect`를 사용할 수 있습니다.
* 순수 함수를 작성하는 것은 약간의 연습이 필요하지만, React 패러다임의 힘을 풀어줍니다.

</Recap>



<Challenges>

#### 고장난 시계를 고쳐보세요 {/*fix-a-broken-clock*/}
Expand Down Expand Up @@ -477,7 +475,7 @@ h1 { margin: 5px; font-size: 18px; }

문제는 `Profile` 컴포넌트가 기존 변수인 `currentPerson`를 수정하고 `Header` 및 `Avatar` 컴포넌트가 이 변수를 읽는다는 점이다. 이것은 *세 가지 모두*를 순수하지 않게 만들고 예측하기 어렵게 만듭니다.

버그를 수정하려면 `currentPerson` 변수를 제거하세요. 대신 프로퍼티즈를 통해 `Profile`의 모든 정보를 `Header` 및 `Avatar`로 전달하세요. 두 컴포넌트에 `person` 프로퍼티를 추가해서 끝까지 전달해야 합니다.
버그를 수정하려면 `currentPerson` 변수를 제거하세요. 대신 Props를 통해 `Profile`의 모든 정보를 `Header` 및 `Avatar`로 전달하세요. 두 컴포넌트에 `person` 프로퍼티를 추가해서 끝까지 전달해야 합니다.

<Sandpack>

Expand Down
Loading