diff --git a/src/content/learn/referencing-values-with-refs.md b/src/content/learn/referencing-values-with-refs.md index 38198aecb..0a0df3921 100644 --- a/src/content/learn/referencing-values-with-refs.md +++ b/src/content/learn/referencing-values-with-refs.md @@ -232,7 +232,7 @@ export default function Counter() { -이것이 render 중에 `ref.current`를 출력하면 신뢰할 수 없는 코드가 나오는 이유입니다. 이 부분이 필요하면 state를 대신 사용해야 합니다.. +이것이 렌더링 중에 `ref.current`를 출력하면 신뢰할 수 없는 코드가 나오는 이유입니다. 이 부분이 필요하면 state를 대신 사용해야 합니다. @@ -271,7 +271,7 @@ React는 `useRef`가 실제로 충분히 일반적이기 때문에 built-in 버 - **refs를 escape hatch로 간주합니다.** Refs는 외부 시스템이나 브라우저 API로 작업할 때 유용합니다. 애플리케이션 로직과 데이터 흐름의 상당 부분이 refs에 의존한다면 접근 방식을 재고해 보는 것이 좋습니다. - **렌더링 중에 `ref.current`를 읽거나 쓰지 마세요.** 렌더링 중에 일부 정보가 필요한 경우 [state](/learn/state-a-components-memory)를 대신 사용하세요. `ref.current`가 언제 변하는지 React는 모르기 때문에 렌더링할 때 읽어도 컴포넌트의 동작을 예측하기 어렵습니다. (`if (!ref.current) ref.current = new Thing()` 과 같은 코드는 첫 번째 렌더 중에 ref를 한 번만 설정하는 경우가 예외입니다.) -React state의 제한은 refs에 적용되지 않습니다. 예를 들어 state는 [모든 render에 대한 snapshot](/learn/state-as-a-snapshot) 및 [동기적으로 업데이트되지 않는 것](/learn/queueing-a-series-of-state-updates)과 같이 작동합니다. 그러나 ref의 current 값을 변조하면 다음과 같이 즉시 변경됩니다. +React state의 제한은 refs에 적용되지 않습니다. 예를 들어 state는 [모든 렌더링에 대한 snapshot](/learn/state-as-a-snapshot) 및 [동기적으로 업데이트되지 않는 것](/learn/queueing-a-series-of-state-updates)과 같이 작동합니다. 그러나 ref의 current 값을 변조하면 다음과 같이 즉시 변경됩니다. ```js ref.current = 5; diff --git a/src/content/learn/synchronizing-with-effects.md b/src/content/learn/synchronizing-with-effects.md index 96f5a27de..2469782a4 100644 --- a/src/content/learn/synchronizing-with-effects.md +++ b/src/content/learn/synchronizing-with-effects.md @@ -908,7 +908,7 @@ export default function ChatRoom({ roomId }) { React는 이 Effect를 실행하며, `'general'` 채팅방에 연결합니다. -#### 같은 의존성 사이에서의 재랜더링 {/*re-render-with-same-dependencies*/} +#### 같은 의존성 사이에서의 재렌더링 {/*re-render-with-same-dependencies*/} ``가 다시 렌더링된다고 가정해봅시다. JSX 결과물은 동일합니다. diff --git a/src/content/learn/thinking-in-react.md b/src/content/learn/thinking-in-react.md index 9d88c02f7..4502a8474 100644 --- a/src/content/learn/thinking-in-react.md +++ b/src/content/learn/thinking-in-react.md @@ -441,7 +441,7 @@ You provided a \`value\` prop to a form field without an \`onChange\` handler. T -위에 있는 샌드박스를 보면, `ProductTable`와 `SearchBar`가 `filterText`와 `inStockOnly` props를 table, input과 체크 박스를 렌더하기 위해서 읽고 있습니다. 예를 들면, `SearchBar` input의 value를 아래와 같이 채우고 있습니다. +위에 있는 샌드박스를 보면, `ProductTable`와 `SearchBar`가 `filterText`와 `inStockOnly` props를 table, input과 체크 박스를 렌더링하기 위해서 읽고 있습니다. 예를 들면, `SearchBar` input의 value를 아래와 같이 채우고 있습니다. ```js {1,6} function SearchBar({ filterText, inStockOnly }) { diff --git a/src/content/reference/react-dom/client/hydrateRoot.md b/src/content/reference/react-dom/client/hydrateRoot.md index 4b6bf6015..b6e11beef 100644 --- a/src/content/reference/react-dom/client/hydrateRoot.md +++ b/src/content/reference/react-dom/client/hydrateRoot.md @@ -1178,7 +1178,7 @@ function Throw({error}) { -경고: root.render(...)에 두 번째 인자를 전달했지만, 이 함수는 하나의 인자만 허용합니다. +경고: `root.render(...)`에 두 번째 인자를 전달했지만, 이 함수는 하나의 인자만 허용합니다. diff --git a/src/content/reference/react-dom/components/form.md b/src/content/reference/react-dom/components/form.md index 595860d11..d4ea5d085 100644 --- a/src/content/reference/react-dom/components/form.md +++ b/src/content/reference/react-dom/components/form.md @@ -31,7 +31,7 @@ React의 익스텐션인 `
`은 현재 React Canary(카나리)와 실험적 ### `` {/*form*/} -정보 제출을 위한 대화형 컨트롤을 생성하기 위해, [내장된 브라우저 `` 컴포넌트](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/form)를 렌더하세요. +정보 제출을 위한 대화형 컨트롤을 생성하기 위해, [내장된 브라우저 `` 컴포넌트](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/form)를 렌더링하세요. ```js @@ -94,7 +94,7 @@ export default function Search() { ### Server Action에서 폼 제출 처리하기 {/*handle-form-submission-with-a-server-action*/} -입력과 제출 버튼과 함께 ``을 렌더하세요. 폼이 제출될 때 해당 함수를 실행하기 위해 Server Action([`'use server'`](/reference/rsc/use-server)가 표시된 함수)를 폼의 `action`의 프로퍼티로 전달하세요. +입력과 제출 버튼과 함께 ``을 렌더링하세요. 폼이 제출될 때 해당 함수를 실행하기 위해 Server Action([`'use server'`](/reference/rsc/use-server)가 표시된 함수)를 폼의 `action`의 프로퍼티로 전달하세요. ``에 Server Action을 전달하면 자바스크립트가 활성화되기 전이나 코드가 로드되기 전에 사용자가 폼을 제출할 수 있습니다. 이는 연결 상태나 기계가 느리거나 자바스크립트가 비활성화된 사용자에게 유용하고, `action` 프로퍼티에 URL이 전달될 때와 폼이 동작하는 방식은 비슷합니다. diff --git a/src/content/reference/react-dom/components/index.md b/src/content/reference/react-dom/components/index.md index ff42c796e..f35a51abc 100644 --- a/src/content/reference/react-dom/components/index.md +++ b/src/content/reference/react-dom/components/index.md @@ -42,7 +42,7 @@ React는 브라우저에 내장된 모든 [HTML](https://developer.mozilla.org/e * [`