Skip to content

Commit

Permalink
[#19] docs: runtime-configurations 번역 (#85) [skip ci]
Browse files Browse the repository at this point in the history
[#19] docs: runtime-configurations.mdx 번역
  • Loading branch information
therealjamesjung authored Aug 5, 2024
1 parent 0992bde commit 4e188cd
Showing 1 changed file with 14 additions and 14 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -9,43 +9,43 @@ description: Add client and server runtime configuration to your Next.js app.

> **Warning:**
>
> - **This feature is deprecated.** We recommend using [environment variables](/docs/pages/building-your-application/configuring/environment-variables) instead, which also can support reading runtime values.
> - You can run code on server startup using the [`register` function](/docs/app/building-your-application/optimizing/instrumentation).
> - This feature does not work with [Automatic Static Optimization](/docs/pages/building-your-application/rendering/automatic-static-optimization), [Output File Tracing](/docs/pages/api-reference/next-config-js/output#automatically-copying-traced-files), or [React Server Components](/docs/app/building-your-application/rendering/server-components).
> - **이 기능은 사용 중단되었습니다.** 대신 [환경 변수](/docs/pages/building-your-application/configuring/environment-variables) 를 사용하는 것을 권장합니다. 이 방법은 런타임 값을 읽는 것도 지원할 수 있습니다.
> - 서버 시작 시 코드를 실행하려면[`register` 함수](/docs/app/building-your-application/optimizing/instrumentation)를 사용할 수 있습니다.
> - 이 기능은 [자동 정적 최적화](/docs/pages/building-your-application/rendering/automatic-static-optimization), [출력 파일 추적](/docs/pages/api-reference/next-config-js/output#automatically-copying-traced-files), or [React 서버 컴포넌트](/docs/app/building-your-application/rendering/server-components) 와 함께 작동하지 않습니다.
To add runtime configuration to your app, open `next.config.js` and add the `publicRuntimeConfig` and `serverRuntimeConfig` configs:
앱에 런타임 구성을 추가하려면 next.config.js를 열고 publicRuntimeConfigserverRuntimeConfig 구성을 추가하십시오:

```js filename="next.config.js"
module.exports = {
serverRuntimeConfig: {
// Will only be available on the server side
// 서버 측에서만 사용할 수 있습니다.
mySecret: 'secret',
secondSecret: process.env.SECOND_SECRET, // Pass through env variables
secondSecret: process.env.SECOND_SECRET, // 환경 변수를 통해 전달
},
publicRuntimeConfig: {
// Will be available on both server and client
// 서버와 클라이언트 모두에서 사용할 수 있습니다.
staticFolder: '/static',
},
}
```

Place any server-only runtime config under `serverRuntimeConfig`.
서버 전용 런타임 구성은 serverRuntimeConfig 아래에 배치하십시오.

Anything accessible to both client and server-side code should be under `publicRuntimeConfig`.
클라이언트 및 서버 측 코드에서 모두 접근할 수 있는 항목은 `publicRuntime₩Config` 아래에 배치하십시오.

> A page that relies on `publicRuntimeConfig` **must** use `getInitialProps` or `getServerSideProps` or your application must have a [Custom App](/docs/pages/building-your-application/routing/custom-app) with `getInitialProps` to opt-out of [Automatic Static Optimization](/docs/pages/building-your-application/rendering/automatic-static-optimization). Runtime configuration won't be available to any page (or component in a page) without being server-side rendered.
> `publicRuntimeConfig` 에 의존하는 페이지는 **반드시** `getInitialProps` 또는 `getServerSideProps` 를 사용하거나, [Custom App](/docs/pages/building-your-application/routing/custom-app) 과 함께 `getInitialProps` 를 사용하여 [자동 정적 최적화](/docs/pages/building-your-application/rendering/automatic-static-optimization) 를 선택 해제해야 합니다. 런타임 구성은 서버 측 렌더링이 없는 페이지(또는 페이지 내의 컴포넌트)에는 사용할 수 없습니다.
To get access to the runtime configs in your app use `next/config`, like so:
앱에서 런타임 구성에 액세스하려면 `next/config`를 사용하십시오:

```jsx
import getConfig from 'next/config'
import Image from 'next/image'

// Only holds serverRuntimeConfig and publicRuntimeConfig
// serverRuntimeConfig와 publicRuntimeConfig만 포함합니다.
const { serverRuntimeConfig, publicRuntimeConfig } = getConfig()
// Will only be available on the server-side
// 서버사이드 에서만 사용 가능합니다.
console.log(serverRuntimeConfig.mySecret)
// Will be available on both server-side and client-side
// 서버사이드 및 클라이언트사이드에서 모두 사용 가능합니다.
console.log(publicRuntimeConfig.staticFolder)

function MyImage() {
Expand Down

0 comments on commit 4e188cd

Please sign in to comment.