diff --git a/src/content/reference/react-dom/static/index.md b/src/content/reference/react-dom/static/index.md index 17cda5476..66c952794 100644 --- a/src/content/reference/react-dom/static/index.md +++ b/src/content/reference/react-dom/static/index.md @@ -4,27 +4,26 @@ title: Static React DOM APIs -The `react-dom/static` APIs let you generate static HTML for React components. They have limited functionality compared to the streaming APIs. A [framework](/learn/creating-a-react-app#full-stack-frameworks) may call them for you. Most of your components don't need to import or use them. +`react-dom/static` API를 사용하면 React 컴포넌트의 정적 HTML을 생성할 수 있습니다. 이 API는 스트리밍 API와 비교해 기능이 제한적입니다. [프레임워크](/learn/creating-a-react-app#full-stack-frameworks)가 대신 호출할 수도 있습니다. 대부분의 컴포넌트는 이를 import하거나 사용할 필요가 없습니다. --- -## Static APIs for Web Streams {/*static-apis-for-web-streams*/} +## Web 스트림용 정적 API {/*static-apis-for-web-streams*/} 다음 메서드들은 브라우저, Deno, 및 일부 최신 엣지 런타임을 포함하는 [Web Streams](https://developer.mozilla.org/en-US/docs/Web/API/Streams_API) 환경에서만 사용할 수 있습니다. -* [`prerender`](/reference/react-dom/static/prerender) renders a React tree to static HTML with a [Readable Web Stream.](https://developer.mozilla.org/en-US/docs/Web/API/ReadableStream) -* [`resumeAndPrerender`](/reference/react-dom/static/resumeAndPrerender) continues a prerendered React tree to static HTML with a [Readable Web Stream](https://developer.mozilla.org/en-US/docs/Web/API/ReadableStream). +* [`prerender`](/reference/react-dom/static/prerender)는 React 트리를 [Readable Web Stream](https://developer.mozilla.org/en-US/docs/Web/API/ReadableStream)을 사용해 정적 HTML로 렌더링합니다. +* [`resumeAndPrerender`](/reference/react-dom/static/resumeAndPrerender)는 사전 렌더링된 React 트리를 [Readable Web Stream](https://developer.mozilla.org/en-US/docs/Web/API/ReadableStream)을 사용해 정적 HTML로 이어서 렌더링합니다. -Node.js also includes these methods for compatibility, but they are not recommended due to worse performance. Use the [dedicated Node.js APIs](#static-apis-for-nodejs-streams) instead. +Node.js에도 호환성을 위해 이 메서드들이 포함되어 있지만, 성능이 더 낮아 권장되지 않습니다. 대신 [전용 Node.js API](#static-apis-for-nodejs-streams)를 사용하세요. --- -## Static APIs for Node.js Streams {/*static-apis-for-nodejs-streams*/} +## Node.js 스트림용 정적 API {/*static-apis-for-nodejs-streams*/} 다음 메서드들은 [Node.js Streams](https://nodejs.org/api/stream.html) 환경에서만 사용할 수 있습니다. -* [`prerenderToNodeStream`](/reference/react-dom/static/prerenderToNodeStream) renders a React tree to static HTML with a [Node.js Stream.](https://nodejs.org/api/stream.html) -* [`resumeAndPrerenderToNodeStream`](/reference/react-dom/static/resumeAndPrerenderToNodeStream) continues a prerendered React tree to static HTML with a [Node.js Stream.](https://nodejs.org/api/stream.html) - +* [`prerenderToNodeStream`](/reference/react-dom/static/prerenderToNodeStream)은 React 트리를 [Node.js Stream](https://nodejs.org/api/stream.html)을 사용해 정적 HTML로 렌더링합니다. +* [`resumeAndPrerenderToNodeStream`](/reference/react-dom/static/resumeAndPrerenderToNodeStream)은 사전 렌더링된 React 트리를 [Node.js Stream](https://nodejs.org/api/stream.html)을 사용해 정적 HTML로 이어서 렌더링합니다. diff --git a/src/content/reference/react-dom/static/prerender.md b/src/content/reference/react-dom/static/prerender.md index a52568887..2c1ec8828 100644 --- a/src/content/reference/react-dom/static/prerender.md +++ b/src/content/reference/react-dom/static/prerender.md @@ -61,11 +61,11 @@ async function handler(request, response) { #### 반환값 {/*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`: a JSON-serializeable, opaque object that can be passed to [`resume`](/reference/react-dom/server/resume) if `prerender` did not finish. Otherwise `null` indicating that the `prelude` contains all the content and no resume is necessary. -- 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) +`prerender`는 Promise를 반환합니다. +- 렌더링에 성공하면 Promise는 다음을 포함한 객체로 resolve됩니다. + - `prelude`: HTML을 담은 [Web Stream](https://developer.mozilla.org/en-US/docs/Web/API/Streams_API)입니다. 이 스트림을 사용해 응답을 청크 단위로 전송하거나, 전체 스트림을 문자열로 읽을 수 있습니다. + - `postponed`: JSON으로 직렬화 가능한 불투명 객체입니다. `prerender`가 완료되지 않은 경우 [`resume`](/reference/react-dom/server/resume)에 전달할 수 있습니다. 완료된 경우에는 `null`이며, 이는 `prelude`에 모든 콘텐츠가 포함되어 재개가 필요 없음을 의미합니다. +- 렌더링에 실패하면 Promise는 reject됩니다. [이 값을 사용해 fallback 셸을 출력하세요.](/reference/react-dom/server/renderToReadableStream#recovering-from-errors-inside-the-shell) #### 주의 사항 {/*caveats*/} @@ -77,7 +77,7 @@ async function handler(request, response) { 정적 `prerender` API는 정적 사이트 생성SSG, Static Site Generation에 사용됩니다. `renderToString`과 달리 `prerender`는 해결되기 전에 모든 데이터가 로드될 때까지 대기합니다. 이는 Suspense를 사용하여 가져와야 하는 데이터를 포함하여 전체 페이지에 대한 정적 HTML을 생성하는 데 적합합니다. 콘텐츠가 로드되면서 스트리밍하려면 [`renderToReadableStream`](/reference/react-dom/server/renderToReadableStream)과 같은 스트리밍 서버 사이드 렌더링(SSR) API를 사용하세요. -`prerender` can be aborted and later either continued with `resumeAndPrerender` or resumed with `resume` to support partial pre-rendering. +부분 사전 렌더링을 지원하기 위해 `prerender`는 중단할 수 있으며, 이후 `resumeAndPrerender`로 이어서 진행하거나 `resume`으로 재개할 수 있습니다. @@ -313,7 +313,7 @@ async function renderToString() { 불완전한 자식을 가진 모든 Suspense 경계는 폴백 상태로 prelude에 포함됩니다. -This can be used for partial prerendering together with [`resume`](/reference/react-dom/server/resume) or [`resumeAndPrerender`](/reference/react-dom/static/resumeAndPrerender). +이 방식은 [`resume`](/reference/react-dom/server/resume) 또는 [`resumeAndPrerender`](/reference/react-dom/static/resumeAndPrerender)와 함께 부분 사전 렌더링에 사용할 수 있습니다. ## 문제 해결 {/*troubleshooting*/} diff --git a/src/content/reference/react-dom/static/prerenderToNodeStream.md b/src/content/reference/react-dom/static/prerenderToNodeStream.md index d0f578958..0b08e082d 100644 --- a/src/content/reference/react-dom/static/prerenderToNodeStream.md +++ b/src/content/reference/react-dom/static/prerenderToNodeStream.md @@ -62,11 +62,11 @@ app.use('/', async (request, response) => { #### 반환값 {/*returns*/} -`prerenderToNodeStream` returns a Promise: -- If rendering the is successful, the Promise will resolve to an object containing: - - `prelude`: a [Node.js Stream.](https://nodejs.org/api/stream.html) of HTML. You can use this stream to send a response in chunks, or you can read the entire stream into a string. - - `postponed`: a JSON-serializeable, opaque object that can be passed to [`resumeToPipeableStream`](/reference/react-dom/server/resumeToPipeableStream) if `prerenderToNodeStream` did not finish. Otherwise `null` indicating that the `prelude` contains all the content and no resume is necessary. -- If rendering fails, the Promise will be rejected. [Use this to output a fallback shell.](/reference/react-dom/server/renderToPipeableStream#recovering-from-errors-inside-the-shell) +`prerenderToNodeStream`은 Promise를 반환합니다. +- 렌더링에 성공하면 Promise는 다음을 포함한 객체로 resolve됩니다. + - `prelude`: HTML을 담은 [Node.js Stream](https://nodejs.org/api/stream.html)입니다. 이 스트림을 사용해 응답을 청크 단위로 전송하거나, 전체 스트림을 문자열로 읽을 수 있습니다. + - `postponed`: JSON으로 직렬화 가능한 불투명 객체입니다. `prerenderToNodeStream`이 완료되지 않은 경우 [`resumeToPipeableStream`](/reference/react-dom/server/resumeToPipeableStream)에 전달할 수 있습니다. 완료된 경우에는 `null`이며, 이는 `prelude`에 모든 콘텐츠가 포함되어 재개가 필요 없음을 의미합니다. +- 렌더링에 실패하면 Promise는 reject됩니다. [이 값을 사용해 fallback 셸을 출력하세요.](/reference/react-dom/server/renderToPipeableStream#recovering-from-errors-inside-the-shell) #### 주의 사항 {/*caveats*/} @@ -78,7 +78,7 @@ app.use('/', async (request, response) => { 정적 `prerenderToNodeStream` API는 정적 서버 사이드 생성(SSG)에 사용합니다. `renderToString`과 달리, `prerenderToNodeStream`은 모든 데이터가 로드될 때까지 기다린 후에 성공합니다. 이는 Suspense를 사용해 가져와야 하는 데이터를 포함해, 전체 페이지의 정적 HTML을 생성하는 데 적합합니다. 콘텐츠가 로드되는 동안 스트리밍하려면, [`renderToReadableStream`](/reference/react-dom/server/renderToReadableStream)과 같은 스트리밍 서버 사이드 렌더링(SSR) API를 사용하세요. -`prerenderToNodeStream` can be aborted and resumed later with `resumeToPipeableStream` to support partial pre-rendering. +부분 사전 렌더링을 지원하기 위해 `prerenderToNodeStream`은 중단할 수 있으며, 이후 `resumeToPipeableStream`으로 재개할 수 있습니다. @@ -314,7 +314,7 @@ async function renderToString() { 불완전한 자식을 가진 모든 Suspense 경계는 풀백 상태로 Prelude에 포함됩니다. -This can be used for partial prerendering together with [`resumeToPipeableStream`](/reference/react-dom/server/resumeToPipeableStream) or [`resumeAndPrerenderToNodeStream`](/reference/react-dom/static/resumeAndPrerenderToNodeStream). +이 방식은 [`resumeToPipeableStream`](/reference/react-dom/server/resumeToPipeableStream) 또는 [`resumeAndPrerenderToNodeStream`](/reference/react-dom/static/resumeAndPrerenderToNodeStream)과 함께 부분 사전 렌더링에 사용할 수 있습니다. ## 문제 해결 {/*troubleshooting*/}