Skip to content

docs: traslate resumeAndPrerender pages #1540

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

Open
hansololiviakim wants to merge 2 commits into
base: main
Choose a base branch
from
+55 −56
Open

docs: traslate resumeAndPrerender pages #1540

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
bace16b
docs: traslate resumeAndPrerender page
hansololiviakim Jul 4, 2026
dd96fbd
docs: traslate resumeAndPrerenderToNodeStream page
hansololiviakim Jul 4, 2026
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
56 changes: 28 additions & 28 deletions src/content/reference/react-dom/static/resumeAndPrerender.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,10 +4,10 @@ title: resumeAndPrerender

<Intro>

`resumeAndPrerender` continues a prerendered React tree to a static HTML string using a [Web Stream](https://developer.mozilla.org/en-US/docs/Web/API/Streams_API).
`resumeAndPrerender`는 사전 렌더링된 React 트리를 [Web Stream](https://developer.mozilla.org/en-US/docs/Web/API/Streams_API)을 사용해 정적 HTML 문자열로 이어서 렌더링합니다.

```js
const { prelude,postpone } = await resumeAndPrerender(reactNode, postponedState, options?)
const {prelude, postponed} = await resumeAndPrerender(reactNode, postponedState, options?)
```

</Intro>
Expand All @@ -16,17 +16,17 @@ const { prelude,postpone } = await resumeAndPrerender(reactNode, postponedState,

<Note>

This API depends on [Web Streams.](https://developer.mozilla.org/en-US/docs/Web/API/Streams_API) For Node.js, use [`resumeAndPrerenderToNodeStream`](/reference/react-dom/static/resumeAndPrerenderToNodeStream) instead.
이 API는 [Web Streams](https://developer.mozilla.org/en-US/docs/Web/API/Streams_API)에 의존합니다. Node.js에서는 [`resumeAndPrerenderToNodeStream`](/reference/react-dom/static/resumeAndPrerenderToNodeStream)을 대신 사용하세요.

</Note>

---

## Reference {/*reference*/}
## 레퍼런스 {/*reference*/}

### `resumeAndPrerender(reactNode, postponedState, options?)` {/*resumeandprerender*/}

Call `resumeAndPrerender` to continue a prerendered React tree to a static HTML string.
`resumeAndPrerender`를 호출해 사전 렌더링된 React 트리를 정적 HTML 문자열로 이어서 렌더링합니다.

```js
import { resumeAndPrerender } from 'react-dom/static';
Expand All @@ -43,45 +43,45 @@ async function handler(request, response) {
}
```

On the client, call [`hydrateRoot`](/reference/react-dom/client/hydrateRoot) to make the server-generated HTML interactive.
클라이언트에서 [`hydrateRoot`](/reference/react-dom/client/hydrateRoot)를 호출해 서버에서 생성된 HTML을 상호작용할 수 있도록 만듭니다.

[See more examples below.](#usage)
[아래에서 더 많은 예시를 확인하세요.](#usage)

#### Parameters {/*parameters*/}
#### 매개변수 {/*parameters*/}

* `reactNode`: The React node you called `prerender` (or a previous `resumeAndPrerender`) with. For example, a JSX element like `<App />`. It is expected to represent the entire document, so the `App` component should render the `<html>` tag.
* `postponedState`: The opaque `postpone` object returned from a [prerender API](/reference/react-dom/static/index), loaded from wherever you stored it (e.g. redis, a file, or S3).
* `options`**(선택사항)**: An object with streaming options.
* `signal`**(선택사항)**: An [abort signal](https://developer.mozilla.org/en-US/docs/Web/API/AbortSignal) that lets you [abort server rendering](#aborting-server-rendering) and render the rest on the client.
* `onError`**(선택사항)**: A callback that fires whenever there is a server error, whether [recoverable](#recovering-from-errors-outside-the-shell) or [not.](#recovering-from-errors-inside-the-shell) By default, this only calls `console.error`. If you override it to [log crash reports,](#logging-crashes-on-the-server) make sure that you still call `console.error`.
* `reactNode`: `prerender` 또는 이전 `resumeAndPrerender`를 호출할 때 전달한 React 노드입니다. 예를 들어 `<App />`과 같은 JSX 엘리먼트입니다. 전체 문서를 나타낼 것으로 예상되므로 `App` 컴포넌트는 `<html>` 태그를 렌더링해야 합니다.
* `postponedState`: [prerender API](/reference/react-dom/static/index)에서 반환된 불투명한 `postpone` 객체로, 저장해 둔 위치(예: Redis, 파일, S3)에서 불러옵니다.
* `options`**(선택사항)**: 스트리밍 옵션을 지정할 수 있는 객체입니다.
* `signal`**(선택사항)**: [서버 렌더링을 중단](/reference/react-dom/server/renderToReadableStream#aborting-server-rendering)하고 나머지를 클라이언트에서 렌더링할 수 있게 하는 [중단 신호](https://developer.mozilla.org/en-US/docs/Web/API/AbortSignal)입니다.
* `onError`**(선택사항)**: 서버 오류가 발생할 때마다, [복구 가능](/reference/react-dom/server/renderToReadableStream#recovering-from-errors-outside-the-shell) 또는 [불가능](/reference/react-dom/server/renderToReadableStream#recovering-from-errors-inside-the-shell) 여부와 관계없이 호출되는 콜백입니다. 기본적으로 `console.error`만 호출합니다. [충돌 보고를 기록](/reference/react-dom/server/renderToReadableStream#logging-crashes-on-the-server)하도록 재정의하는 경우에도 반드시 `console.error`를 호출해야 합니다.

#### Returns {/*returns*/}
#### 반환값 {/*returns*/}

`prerender` returns a Promise:
- If rendering the is successful, the Promise will resolve to an object containing:
- `prelude`: a [Web Stream](https://developer.mozilla.org/en-US/docs/Web/API/Streams_API) of HTML. You can use this stream to send a response in chunks, or you can read the entire stream into a string.
- `postponed`: an JSON-serializeable, opaque object that can be passed to [`resume`](/reference/react-dom/server/resume) or [`resumeAndPrerender`](/reference/react-dom/static/resumeAndPrerender) if `prerender` is aborted.
- If rendering fails, the Promise will be rejected. [Use this to output a fallback shell.](/reference/react-dom/server/renderToReadableStream#recovering-from-errors-inside-the-shell)
`resumeAndPrerender`는 Promise를 반환합니다.
- 렌더링에 성공하면 Promise는 다음을 포함한 객체로 resolve됩니다.
- `prelude`: HTML을 담은 [Web Stream](https://developer.mozilla.org/en-US/docs/Web/API/Streams_API)입니다. 이 스트림을 사용해 응답을 청크 단위로 전송하거나, 전체 스트림을 문자열로 읽을 수 있습니다.
- `postponed`: JSON으로 직렬화 가능한 불투명 객체입니다. `resumeAndPrerender`가 중단된 경우 [`resume`](/reference/react-dom/server/resume) 또는 [`resumeAndPrerender`](/reference/react-dom/static/resumeAndPrerender)에 전달할 수 있습니다.
- 렌더링에 실패하면 Promise는 reject됩니다. [이 값을 사용해 fallback 셸을 출력하세요.](/reference/react-dom/server/renderToReadableStream#recovering-from-errors-inside-the-shell)

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

`nonce` is not an available option when prerendering. Nonces must be unique per request and if you use nonces to secure your application with [CSP](https://developer.mozilla.org/en-US/docs/Web/HTTP/Guides/CSP) it would be inappropriate and insecure to include the nonce value in the prerender itself.
사전 렌더링 시 `nonce` 옵션은 사용할 수 없습니다. Nonce는 요청마다 고유해야 하며 [CSP](https://developer.mozilla.org/en-US/docs/Web/HTTP/Guides/CSP)로 애플리케이션을 보호할 때 Nonce 값을 사전 렌더링 결과에 포함하는 것은 부적절하고 안전하지 않습니다.

<Note>

### When should I use `resumeAndPrerender`? {/*when-to-use-prerender*/}
### `resumeAndPrerender`는 언제 사용해야 하나요? {/*when-to-use-prerender*/}

The static `resumeAndPrerender` API is used for static server-side generation (SSG). Unlike `renderToString`, `resumeAndPrerender` waits for all data to load before resolving. This makes it suitable for generating static HTML for a full page, including data that needs to be fetched using Suspense. To stream content as it loads, use a streaming server-side render (SSR) API like [renderToReadableStream](/reference/react-dom/server/renderToReadableStream).
정적 `resumeAndPrerender` API는 정적 사이트 생성<sup>SSG, Static Site Generation</sup>에 사용됩니다. `renderToString`과 달리 `resumeAndPrerender`는 모든 데이터가 로드될 때까지 기다린 후에 resolve됩니다. 이는 Suspense를 사용해 가져와야 하는 데이터를 포함해 전체 페이지의 정적 HTML을 생성하는 데 적합합니다. 콘텐츠가 로드되는 동안 스트리밍하려면 [`renderToReadableStream`](/reference/react-dom/server/renderToReadableStream)과 같은 스트리밍 서버 사이드 렌더링(SSR) API를 사용하세요.

`resumeAndPrerender` can be aborted and later either continued with another `resumeAndPrerender` or resumed with `resume` to support partial pre-rendering.
부분 사전 렌더링을 지원하기 위해 `resumeAndPrerender`는 중단할 수 있으며, 이후 다른 `resumeAndPrerender`로 이어서 진행하거나 `resume`으로 재개할 수 있습니다.

</Note>

---

## Usage {/*usage*/}
## 사용법 {/*usage*/}

### Further reading {/*further-reading*/}
### 추가로 읽어보기 {/*further-reading*/}

`resumeAndPrerender` behaves similarly to [`prerender`](/reference/react-dom/static/prerender) but can be used to continue a previously started prerendering process that was aborted.
For more information about resuming a prerendered tree, see the [resume documentation](/reference/react-dom/server/resume#resuming-a-prerender).
`resumeAndPrerender`는 [`prerender`](/reference/react-dom/static/prerender)와 비슷하게 동작하지만, 이전에 시작했다가 중단된 사전 렌더링 과정을 이어서 진행하는 데 사용할 수 있습니다.
사전 렌더링된 트리 재개에 대한 자세한 내용은 [resume 문서](/reference/react-dom/server/resume#resuming-a-prerender)를 확인하세요.
55 changes: 27 additions & 28 deletions src/content/reference/react-dom/static/resumeAndPrerenderToNodeStream.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@ title: resumeAndPrerenderToNodeStream

<Intro>

`resumeAndPrerenderToNodeStream` continues a prerendered React tree to a static HTML string using a a [Node.js Stream.](https://nodejs.org/api/stream.html).
`resumeAndPrerenderToNodeStream`은 사전 렌더링된 React 트리를 [Node.js Stream](https://nodejs.org/api/stream.html)을 사용해 정적 HTML 문자열로 이어서 렌더링합니다.

```js
const {prelude, postponed} = await resumeAndPrerenderToNodeStream(reactNode, postponedState, options?)
Expand All @@ -16,17 +16,17 @@ const {prelude, postponed} = await resumeAndPrerenderToNodeStream(reactNode, pos

<Note>

This API is specific to Node.js. Environments with [Web Streams,](https://developer.mozilla.org/en-US/docs/Web/API/Streams_API) like Deno and modern edge runtimes, should use [`prerender`](/reference/react-dom/static/prerender) instead.
이 API는 Node.js 전용입니다. Deno나 최신 엣지 런타임처럼 [Web Streams](https://developer.mozilla.org/en-US/docs/Web/API/Streams_API)를 지원하는 환경에서는 [`prerender`](/reference/react-dom/static/prerender)를 사용해야 합니다.

</Note>

---

## Reference {/*reference*/}
## 레퍼런스 {/*reference*/}

### `resumeAndPrerenderToNodeStream(reactNode, postponedState, options?)` {/*resumeandprerendertolnodestream*/}

Call `resumeAndPrerenderToNodeStream` to continue a prerendered React tree to a static HTML string.
`resumeAndPrerenderToNodeStream`을 호출해 사전 렌더링된 React 트리를 정적 HTML 문자열로 이어서 렌더링합니다.

```js
import { resumeAndPrerenderToNodeStream } from 'react-dom/static';
Expand All @@ -39,46 +39,45 @@ async function handler(request, writable) {
}
```

On the client, call [`hydrateRoot`](/reference/react-dom/client/hydrateRoot) to make the server-generated HTML interactive.
클라이언트에서 [`hydrateRoot`](/reference/react-dom/client/hydrateRoot)를 호출해 서버에서 생성된 HTML을 상호작용할 수 있도록 만듭니다.

[See more examples below.](#usage)
[아래에서 더 많은 예시를 확인하세요.](#usage)

#### Parameters {/*parameters*/}
#### 매개변수 {/*parameters*/}

* `reactNode`: The React node you called `prerender` (or a previous `resumeAndPrerenderToNodeStream`) with. For example, a JSX element like `<App />`. It is expected to represent the entire document, so the `App` component should render the `<html>` tag.
* `postponedState`: The opaque `postpone` object returned from a [prerender API](/reference/react-dom/static/index), loaded from wherever you stored it (e.g. redis, a file, or S3).
* `options`**(선택사항)**: An object with streaming options.
* `signal`**(선택사항)**: An [abort signal](https://developer.mozilla.org/en-US/docs/Web/API/AbortSignal) that lets you [abort server rendering](#aborting-server-rendering) and render the rest on the client.
* `onError`**(선택사항)**: A callback that fires whenever there is a server error, whether [recoverable](#recovering-from-errors-outside-the-shell) or [not.](#recovering-from-errors-inside-the-shell) By default, this only calls `console.error`. If you override it to [log crash reports,](#logging-crashes-on-the-server) make sure that you still call `console.error`.
* `reactNode`: `prerender` 또는 이전 `resumeAndPrerenderToNodeStream`을 호출할 때 전달한 React 노드입니다. 예를 들어 `<App />`과 같은 JSX 엘리먼트입니다. 전체 문서를 나타낼 것으로 예상되므로 `App` 컴포넌트는 `<html>` 태그를 렌더링해야 합니다.
* `postponedState`: [prerender API](/reference/react-dom/static/index)에서 반환된 불투명한 `postpone` 객체로, 저장해 둔 위치(예: Redis, 파일, S3)에서 불러옵니다.
* `options`**(선택사항)**: 스트리밍 옵션을 지정할 수 있는 객체입니다.
* `signal`**(선택사항)**: [서버 렌더링을 중단](/reference/react-dom/server/renderToPipeableStream#aborting-server-rendering)하고 나머지를 클라이언트에서 렌더링할 수 있게 하는 [중단 신호](https://developer.mozilla.org/en-US/docs/Web/API/AbortSignal)입니다.
* `onError`**(선택사항)**: 서버 오류가 발생할 때마다, [복구 가능](/reference/react-dom/server/renderToPipeableStream#recovering-from-errors-outside-the-shell) 또는 [불가능](/reference/react-dom/server/renderToPipeableStream#recovering-from-errors-inside-the-shell) 여부와 관계없이 호출되는 콜백입니다. 기본적으로 `console.error`만 호출합니다. [충돌 보고를 기록](/reference/react-dom/server/renderToPipeableStream#logging-crashes-on-the-server)하도록 재정의하는 경우에도 반드시 `console.error`를 호출해야 합니다.

#### Returns {/*returns*/}
#### 반환값 {/*returns*/}

`resumeAndPrerenderToNodeStream` returns a Promise:
- If rendering the is successful, the Promise will resolve to an object containing:
- `prelude`: a [Web Stream](https://developer.mozilla.org/en-US/docs/Web/API/Streams_API) of HTML. You can use this stream to send a response in chunks, or you can read the entire stream into a string.
- `postponed`: an JSON-serializeable, opaque object that can be passed to [`resumeToNodeStream`](/reference/react-dom/server/resume) or [`resumeAndPrerenderToNodeStream`](/reference/react-dom/static/resumeAndPrerenderToNodeStream) if `resumeAndPrerenderToNodeStream` is aborted.
- If rendering fails, the Promise will be rejected. [Use this to output a fallback shell.](/reference/react-dom/server/renderToReadableStream#recovering-from-errors-inside-the-shell)
`resumeAndPrerenderToNodeStream`은 Promise를 반환합니다.
- 렌더링에 성공하면 Promise는 다음을 포함한 객체로 resolve됩니다.
- `prelude`: HTML을 담은 [Node.js Stream](https://nodejs.org/api/stream.html)입니다. 이 스트림을 사용해 응답을 청크 단위로 전송하거나, 전체 스트림을 문자열로 읽을 수 있습니다.
- `postponed`: JSON으로 직렬화 가능한 불투명 객체입니다. `resumeAndPrerenderToNodeStream`이 중단된 경우 [`resumeToPipeableStream`](/reference/react-dom/server/resumeToPipeableStream) 또는 [`resumeAndPrerenderToNodeStream`](/reference/react-dom/static/resumeAndPrerenderToNodeStream)에 전달할 수 있습니다.
- 렌더링에 실패하면 Promise는 reject됩니다. [이 값을 사용해 fallback 셸을 출력하세요.](/reference/react-dom/server/renderToPipeableStream#recovering-from-errors-inside-the-shell)

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

`nonce` is not an available option when prerendering. Nonces must be unique per request and if you use nonces to secure your application with [CSP](https://developer.mozilla.org/en-US/docs/Web/HTTP/Guides/CSP) it would be inappropriate and insecure to include the nonce value in the prerender itself.
사전 렌더링 시 `nonce` 옵션은 사용할 수 없습니다. Nonce는 요청마다 고유해야 하며 [CSP](https://developer.mozilla.org/en-US/docs/Web/HTTP/Guides/CSP)로 애플리케이션을 보호할 때 Nonce 값을 사전 렌더링 결과에 포함하는 것은 부적절하고 안전하지 않습니다.

<Note>

### When should I use `resumeAndPrerenderToNodeStream`? {/*when-to-use-prerender*/}
### `resumeAndPrerenderToNodeStream`은 언제 사용해야 하나요? {/*when-to-use-prerender*/}

The static `resumeAndPrerenderToNodeStream` API is used for static server-side generation (SSG). Unlike `renderToString`, `resumeAndPrerenderToNodeStream` waits for all data to load before resolving. This makes it suitable for generating static HTML for a full page, including data that needs to be fetched using Suspense. To stream content as it loads, use a streaming server-side render (SSR) API like [renderToReadableStream](/reference/react-dom/server/renderToReadableStream).
정적 `resumeAndPrerenderToNodeStream` API는 정적 서버 사이드 생성(SSG)에 사용합니다. `renderToString`과 달리 `resumeAndPrerenderToNodeStream`은 모든 데이터가 로드될 때까지 기다린 후에 resolve됩니다. 이는 Suspense를 사용해 가져와야 하는 데이터를 포함해 전체 페이지의 정적 HTML을 생성하는 데 적합합니다. 콘텐츠가 로드되는 동안 스트리밍하려면 [`renderToPipeableStream`](/reference/react-dom/server/renderToPipeableStream)과 같은 스트리밍 서버 사이드 렌더링(SSR) API를 사용하세요.

`resumeAndPrerenderToNodeStream` can be aborted and later either continued with another `resumeAndPrerenderToNodeStream` or resumed with `resume` to support partial pre-rendering.
부분 사전 렌더링을 지원하기 위해 `resumeAndPrerenderToNodeStream`은 중단할 수 있으며, 이후 다른 `resumeAndPrerenderToNodeStream`으로 이어서 진행하거나 `resumeToPipeableStream`으로 재개할 수 있습니다.

</Note>

---

## Usage {/*usage*/}
## 사용법 {/*usage*/}

### Further reading {/*further-reading*/}

`resumeAndPrerenderToNodeStream` behaves similarly to [`prerender`](/reference/react-dom/static/prerender) but can be used to continue a previously started prerendering process that was aborted.
For more information about resuming a prerendered tree, see the [resume documentation](/reference/react-dom/server/resume#resuming-a-prerender).
### 추가로 읽어보기 {/*further-reading*/}

`resumeAndPrerenderToNodeStream`은 [`prerenderToNodeStream`](/reference/react-dom/static/prerenderToNodeStream)과 비슷하게 동작하지만, 이전에 시작했다가 중단된 사전 렌더링 과정을 이어서 진행하는 데 사용할 수 있습니다.
사전 렌더링된 트리 재개에 대한 자세한 내용은 [resumeToPipeableStream 문서](/reference/react-dom/server/resumeToPipeableStream)를 확인하세요.