Skip to content

Commit

Permalink
docs(textlint): update caveats
Browse files Browse the repository at this point in the history
  • Loading branch information
lumirlumir committed Oct 30, 2024
1 parent 57c61f8 commit c271c67
Show file tree
Hide file tree
Showing 34 changed files with 63 additions and 52 deletions.
6 changes: 3 additions & 3 deletions src/content/reference/react-dom/client/createRoot.md
Original file line number Diff line number Diff line change
Expand Up @@ -53,7 +53,7 @@ root.render(<App />);
`createRoot`는 [`render`](#root-render)와 [`unmount`](#root-unmount) 두 가지 메서드가 있는 객체를 반환합니다.
#### 주의사항 {/*caveats*/}
#### 주의 사항 {/*caveats*/}
* 앱이 서버에서 렌더링 되는 경우 `createRoot()`는 사용할 수 없습니다. 대신 [`hydrateRoot()`](/reference/react-dom/client/hydrateRoot)를 사용하세요.
* 앱에 `createRoot` 호출이 단 하나만 있을 가능성이 높습니다. 프레임워크를 사용하는 경우 프레임워크가 이 호출을 대신 수행할 수도 있습니다.
* 컴포넌트의 자식이 아닌 DOM 트리의 다른 부분(예: 모달 또는 툴팁)에 JSX 조각을 렌더링하려는 경우, `createRoot` 대신 [`createPortal`](/reference/react-dom/createPortal)을 사용하세요.
Expand Down Expand Up @@ -81,7 +81,7 @@ React는 `root`에 `<App />`을 표시하고 그 안에 있는 DOM을 관리합
`root.render``undefined`를 반환합니다.
#### 주의사항 {/*root-render-caveats*/}
#### 주의 사항 {/*root-render-caveats*/}
* `root.render`를 처음 호출하면 React는 React 컴포넌트를 렌더링하기 전에 React 루트 내부의 모든 기존 HTML 콘텐츠를 지웁니다.
Expand Down Expand Up @@ -115,7 +115,7 @@ root.unmount();
`root.unmount` returns `undefined`.
#### 주의사항 {/*root-unmount-caveats*/}
#### 주의 사항 {/*root-unmount-caveats*/}
* `root.unmount`를 호출하면 트리의 모든 컴포넌트가 마운트 해제되고 루트 DOM 노드에서 React가 "분리"됩니다.
Expand Down
6 changes: 3 additions & 3 deletions src/content/reference/react-dom/client/hydrateRoot.md
Original file line number Diff line number Diff line change
Expand Up @@ -53,7 +53,7 @@ React는 `domNode` 내부의 HTML에 붙어, 내부 DOM을 직접 관리할 것
`hydrateRoot`는 2가지 메소드가 포함된 객체를 반환합니다 : [`render`](#root-render) 그리고 [`unmount`.](#root-unmount)
#### Caveats {/*caveats*/}
#### 주의 사항 {/*caveats*/}
* `hydrateRoot()`는 서버에서 렌더링된 내용과 후에 렌더링된 내용이 동일할 것을 기대합니다. 따라서 동일하지 않은 부분들은 직접 버그로 취급해주거나 고쳐줘야 합니다.
* 개발 모드에선, React가 hydration 중에 동일하지 않은 부분에 대해 경고해줍니다. 속성이 동일하지 않을 경우에 해당 속성이 올바르게 적용될 것이라고 보장할 수 없습니다. 모든 마크업을 보장하지 않는 것은 성능면에서 중요하기 때문입니다. 마크업이 동일하지 않는 경우는 드물기 때문에 모든 마크업을 검증하는 비용은 굉장히 비쌉니다.
Expand Down Expand Up @@ -82,7 +82,7 @@ React는 hydrate된 `root`부터 내부를 `<App />`으로 갱신합니다.
`root.render``undefined`를 반환합니다.
#### Caveats {/*root-render-caveats*/}
#### 주의 사항 {/*root-render-caveats*/}
* hydrate가 끝나기 전에 `root.render`를 호출하면 React는 서버에서 렌더링된 HTML을 모두 없애고 클라이언트에서 렌더링된 컴포넌트들로 완전히 교체합니다.
Expand Down Expand Up @@ -111,7 +111,7 @@ root.unmount();
`root.unmount` returns `undefined`.
#### Caveats {/*root-unmount-caveats*/}
#### 주의 사항 {/*root-unmount-caveats*/}
* `root.unmount`를 호출하면 root부터 그 안의 모든 컴포넌트가 마운트 해제되고 root DOM node에서 React를 떼어냅니다.
Expand Down
4 changes: 2 additions & 2 deletions src/content/reference/react-dom/components/common.md
Original file line number Diff line number Diff line change
Expand Up @@ -236,7 +236,7 @@ capture-phase-events)
* [`onWaiting`](https://developer.mozilla.org/en-US/docs/Web/API/HTMLMediaElement/waiting_event): [`이벤트` 핸들러](#event-handler) 함수입니다. 일시적인 데이터 부족으로 인해 재생이 중지된 경우 발생합니다.
* `onWaitingCapture`: `onWaiting`[캡처 단계](/learn/responding-to-events#capture-phase-events)에서 발생하는 버전입니다.

#### 주의사항 {/*common-caveats*/}
#### 주의 사항 {/*common-caveats*/}

- `children``dangerouslySetInnerHTML`을 동시에 전달할 수 없습니다.
- 일부 이벤트(예시: `onAbort`, `onLoad`)는 브라우저에서 버블링이 발생하지 않지만, React에서는 버블링이 발생합니다.
Expand Down Expand Up @@ -334,7 +334,7 @@ React 이벤트 객체는 표준 [`Event`](https://developer.mozilla.org/ko/docs
* `persist()`: React DOM에서는 사용되지 않습니다. React Native에서는 이벤트가 발생한 후 이벤트의 프로퍼티를 읽으려면 해당 함수를 호출해야 합니다.
* `isPersistent()`: React DOM에서는 사용되지 않습니다. React Native에서는 `persist`가 호출되었는지 여부를 반환합니다.

#### 주의사항 {/*react-event-object-caveats*/}
#### 주의 사항 {/*react-event-object-caveats*/}

* `currentTarget`, `eventPhase`, `target`, `type`의 값은 React 코드가 예상하는 값을 반영합니다. 내부적으로는 React는 이벤트 핸들러를 루트에 첨부하지만, React 이벤트 객체에는 반영되지 않습니다. 예를 들어 `e.currentTarget`은 기본`e.nativeEvent.currentTarget`과 동일하지 않을 수 있습니다. 폴리필 된 이벤트의 경우 `e.type` (React 이벤트 타입)이 `e.nativeEvent.type` (기본 타입)과 다를 수 있습니다.

Expand Down
2 changes: 1 addition & 1 deletion src/content/reference/react-dom/components/form.md
Original file line number Diff line number Diff line change
Expand Up @@ -49,7 +49,7 @@ React의 익스텐션인 `<form>`은 현재 React Canary(카나리)와 실험적
[`action`](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/form#action): URL 혹은 함수.
URL이 `action`을 통해 전달되면, 폼은 HTML 폼 컴포넌트처럼 행동합니다. 함수가 action을 통해 전달되면, 해당 함수는 폼 제출처럼 동작합니다. `action`을 통한 함수는 비동기로 동작할 수 있으며, 폼을 통해 제출된 [formData](https://developer.mozilla.org/ko/docs/Web/API/FormData)를 포함한 단일 인수로 호출됩니다. `action`의 프로퍼티는 `formAction`의 속성인 `<button>`, `<input type="submit">`, 혹은 `<input type="image">`로 재정의될 수 있습니다.

#### 주의 {/*caveats*/}
#### 주의 사항 {/*caveats*/}

* 함수가 `action`이나 `formAction`에 전달되면, HTTP 메서드는 `method` 프로퍼티의 값과 관계없이 POST로 처리됩니다.

Expand Down
2 changes: 1 addition & 1 deletion src/content/reference/react-dom/components/input.md
Original file line number Diff line number Diff line change
Expand Up @@ -94,7 +94,7 @@ You can [make an input controlled](#controlling-an-input-with-a-state-variable)
* [`type`](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#type): 문자열 타입. [input types](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#input_types) 중의 하나
* [`width`](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#width): 문자열 타입. `type="image"` input의 이미지 너비를 지정합니다.

#### 경고 {/*caveats*/}
#### 주의 사항 {/*caveats*/}

- 체크박스에는 `value` (또는 `defaultValue`)가 아닌 `checked` (또는 `defaultChecked`)가 필요합니다.
- 텍스트 input 영역은 문자열 `value` prop을 받을 경우 [제어되는 것으로 취급](#controlling-an-input-with-a-state-variable)됩니다.
Expand Down
2 changes: 1 addition & 1 deletion src/content/reference/react-dom/components/option.md
Original file line number Diff line number Diff line change
Expand Up @@ -44,7 +44,7 @@ title: "<option>"
* [`label`](https://developer.mozilla.org/ko/docs/Web/HTML/Element/option#label): 문자열 타입. 옵션의 의미를 지정합니다. 지정하지 않으면 옵션 내부의 텍스트가 사용됩니다.
* [`value`](https://developer.mozilla.org/ko/docs/Web/HTML/Element/option#value): 이 옵션을 선택한 경우 [폼에서 상위 `<select>` 를 제출할 때](/reference/react-dom/components/select#reading-the-select-box-value-when-submitting-a-form) 사용할 값입니다.

#### 유의 사항 {/*caveats*/}
#### 주의 사항 {/*caveats*/}

* React는 `<option>`에서 `selected` 속성을 지원하지 않습니다. 대신, 이 옵션의 `value`를 제어되지 않은 select box의 경우 상위 [`<select defaultValue>`](/reference/react-dom/components/select#providing-an-initially-selected-option) 에 전달하거나, 제어되는 select box의 경우 [`<select value>`](/reference/react-dom/components/select#controlling-a-select-box-with-a-state-variable) 에 전달하세요.

Expand Down
2 changes: 1 addition & 1 deletion src/content/reference/react-dom/components/script.md
Original file line number Diff line number Diff line change
Expand Up @@ -72,7 +72,7 @@ React는 `<script>` 컴포넌트를 문서의 `<head>`로 이동시키고, 중

이 동작을 사용하려면 `src``async={true}` 속성을 제공하세요. React는 `src`가 동일한 경우에만 중복된 스크립트를 제거합니다. 스크립트를 안전하게 이동하려면 `async` 속성이 반드시 `true`여야 합니다.

이 특별한 처리에는 두 가지 주의사항이 있습니다.
이 특별한 처리에는 두 가지 주의 사항이 있습니다.

* React는 스크립트를 렌더링한 후에 속성 변경을 무시합니다. (개발 환경에서는 이러한 경우에 경고가 발생합니다.)
* React는 컴포넌트를 마운트 해제한 후에도 DOM에 스크립트를 남길 수 있습니다. (스크립트는 DOM에 삽입될 때 한 번만 실행되므로 이것은 영향을 미치지 않습니다.)
Expand Down
2 changes: 1 addition & 1 deletion src/content/reference/react-dom/components/textarea.md
Original file line number Diff line number Diff line change
Expand Up @@ -67,7 +67,7 @@ title: "<textarea>"
* [`rows`](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/textarea#attr-rows): 숫자 타입. 평균 문자 높이의 기본 높이를 지정하세요. 기본값은 `2`입니다.
* [`wrap`](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/textarea#attr-wrap): `'hard'`, `'soft'`, `'off'` 중 하나. 폼 제출 시 텍스트를 감싸는 방식을 지정합니다.

#### 경고 {/*caveats*/}
#### 주의 사항 {/*caveats*/}

- `<textarea>something</textarea>`와 같이 자식을 전달하는 것은 허용되지 않습니다. [초기 콘텐츠로 `defaultValue`를 사용하세요.](#providing-an-initial-value-for-a-text-area)
- 텍스트 영역은 문자열 `value` prop을 받을 경우 [제어되는 것으로 취급](#controlling-a-text-area-with-a-state-variable)됩니다.
Expand Down
2 changes: 1 addition & 1 deletion src/content/reference/react-dom/findDOMNode.md
Original file line number Diff line number Diff line change
Expand Up @@ -45,7 +45,7 @@ const domNode = findDOMNode(componentInstance);

`findDOMNode`는 주어진 `componentInstance`에서 가장 처음 등장하는 브라우저 DOM 노드를 반환합니다. 컴포넌트가 `null`이나 `false`를 렌더링할 경우 `findDOMNode``null`을 반환합니다. 컴포넌트가 문자열을 렌더링하면 `findDOMNode`는 그 값을 포함한 텍스트 DOM 노드를 반환합니다.

#### 주의사항 {/*caveats*/}
#### 주의 사항 {/*caveats*/}

* 컴포넌트가 배열이나 다수의 자식을 가진 [Fragment](/reference/react/Fragment)를 반환할 수 있습니다. 이런 경우 `findDOMNode`는 해당하는 DOM 노드 중 비어있지 않은 첫 번째 자식을 반환합니다.

Expand Down
2 changes: 1 addition & 1 deletion src/content/reference/react-dom/flushSync.md
Original file line number Diff line number Diff line change
Expand Up @@ -48,7 +48,7 @@ flushSync(() => {

`flushSync``undefined`를 반환합니다.

#### 주의사항 {/*caveats*/}
#### 주의 사항 {/*caveats*/}

* `flushSync`를 사용하면 애플리케이션의 성능이 크게 저하될 수 있습니다. 가급적 사용하지 마세요.
* `flushSync`는 보류 중인 Suspense 바운더리의 `fallback` state를 표시하도록 강제할 수 있습니다.
Expand Down
2 changes: 1 addition & 1 deletion src/content/reference/react-dom/prefetchDNS.md
Original file line number Diff line number Diff line change
Expand Up @@ -51,7 +51,7 @@ prefetchDNS는 브라우저에게 주어진 서버의 IP 주소를 조회해야

`prefetchDNS`는 아무 값도 반환하지 않습니다.

#### 주의사항 {/*caveats*/}
#### 주의 사항 {/*caveats*/}

* 동일한 서버에 대해 여러 번의 `prefetchDNS` 호출은 한 번의 호출과 동일한 효과를 갖습니다.
* 브라우저에서는 `prefetchDNS`를 컴포넌트 렌더링할 때, Effect 내부, 이벤트 핸들러 등 모든 상황에서 호출할 수 있습니다.
Expand Down
2 changes: 1 addition & 1 deletion src/content/reference/react-dom/preload.md
Original file line number Diff line number Diff line change
Expand Up @@ -67,7 +67,7 @@ function AppRoot() {

`preload`는 아무것도 반환하지 않습니다.

#### 주의사항 {/*caveats*/}
#### 주의 사항 {/*caveats*/}

* `preload`에 대한 여러 번의 동등한 호출은 한 번의 호출과 동일한 효과를 갖습니다. `preload`에 대한 호출은 다음 규칙에 따라 동등한 것으로 간주합니다:
* 다음의 경우를 제외하고 두 호출의 `href`가 같으면 두 호출은 동일합니다:
Expand Down
2 changes: 1 addition & 1 deletion src/content/reference/react-dom/preloadModule.md
Original file line number Diff line number Diff line change
Expand Up @@ -64,7 +64,7 @@ function AppRoot() {

`preloadModule`는 아무것도 반환하지 않습니다.

#### 주의사항 {/*caveats*/}
#### 주의 사항 {/*caveats*/}

* 동일한 `href``preloadModule`을 여러 번 호출하는 것은 한 번 호출하는 것과 동일한 효과가 있습니다.
* 브라우저에서는 컴포넌트를 렌더링하는 중이거나, Effect, 이벤트 핸들러 등 어떤 상황에서도 `preloadModule`을 호출할 수 있습니다.
Expand Down
2 changes: 1 addition & 1 deletion src/content/reference/react-dom/server/renderToString.md
Original file line number Diff line number Diff line change
Expand Up @@ -48,7 +48,7 @@ const html = renderToString(<App />);
HTML 문자열.
#### 주의사항 {/*caveats*/}
#### 주의 사항 {/*caveats*/}
* `renderToString`는 Suspense 지원에 한계가 있습니다. 컴포넌트가 중단된다면 `renderToString`는 즉시 해당 폴백을 HTML로 보냅니다.
Expand Down
Loading

0 comments on commit c271c67

Please sign in to comment.