diff --git a/docs/ko/reference/default-theme-badge.md b/docs/ko/reference/default-theme-badge.md index 0c3acb08..20bdcef9 100644 --- a/docs/ko/reference/default-theme-badge.md +++ b/docs/ko/reference/default-theme-badge.md @@ -1,15 +1,15 @@ # 배지 {#badge} -배지는 헤더에 상태를 추가할 수 있게 해줍니다. 예를 들어, 섹션의 유형이나 지원되는 버전을 명시하는 것이 유용할 수 있습니다. +배지는 헤더에 상태를 추가할 수 있게 해줍니다. 예를 들어, 섹션의 타입을 지정하거나 지원되는 버전을 표시하는 데 유용할 수 있습니다. ## 사용법 {#usage} -글로벌하게 사용 가능한 `Badge` 컴포넌트를 사용할 수 있습니다. +`Badge` 컴포넌트는 전역으로 사용 가능합니다. ```html ### 제목 ### 제목 -### 제목 +### 제목 ### 제목 ``` @@ -17,22 +17,22 @@ ### 제목 ### 제목 -### 제목 +### 제목 ### 제목 -## 사용자 정의 자식 요소 {#custom-children} +## 커스텀 하위 노드 {#custom-children} -``는 `children`을 받아들이며, 이는 배지 안에 표시됩니다. +``는 `children`을 받아서 배지 내부에 표시합니다. ```html -### 제목 사용자 정의 요소 +### 제목 커스텀 노드 ``` -### 제목 사용자 정의 요소 +### 제목 커스텀 노드 -## 타입 색상 사용자 정의 {#customize-type-color} +## 타입 색상 커스터마이징 {#customize-type-color} -css 변수를 오버라이딩함으로써 배지의 스타일을 사용자 정의할 수 있습니다. 다음은 기본값입니다: +배지의 스타일은 CSS 변수를 재정의하여 커스터마이징 할 수 있습니다. 다음은 기본값입니다: ```css :root { @@ -56,14 +56,14 @@ css 변수를 오버라이딩함으로써 배지의 스타일을 사용자 정 ## `` -`` 컴포넌트는 다음의 prop들을 받습니다: +`` 컴포넌트는 다음과 같은 프로퍼티를 사용합니다: ```ts interface Props { - // ``이 전달되면, 이 값은 무시됩니다. + // ``이 전달되면, 이 값은 무시됨. text?: string - // 기본값은 `tip`입니다. + // 기본값: `tip`. type?: 'info' | 'tip' | 'warning' | 'danger' } ``` diff --git a/docs/ko/reference/default-theme-edit-link.md b/docs/ko/reference/default-theme-edit-link.md index 254eeb80..4494b937 100644 --- a/docs/ko/reference/default-theme-edit-link.md +++ b/docs/ko/reference/default-theme-edit-link.md @@ -1,8 +1,8 @@ # 편집 링크 {#edit-link} -## 사이트 레벨 설정 {#site-level-config} +## 사이트 단계에서 설정하기 {#site-level-config} -편집 링크를 사용하면 GitHub이나 GitLab과 같은 Git 관리 서비스에서 페이지를 편집하는 링크를 표시할 수 있습니다. 활성화하려면, `themeConfig.editLink` 옵션을 설정에 추가하세요. +편집 링크는 GitHub, GitLab과 같은 Git 관리 서비스에서 페이지를 편집할 수 있는 링크를 표시할 수 있게 해줍니다. 이를 활성화하려면 `themeConfig.editLink` 옵션을 구성에 추가하세요. ```js export default { @@ -16,7 +16,7 @@ export default { `pattern` 옵션은 링크의 URL 구조를 정의하며, `:path`는 페이지 경로로 대체됩니다. -또한 [`PageData`](./runtime-api#usedata)를 인수로 받아 URL 문자열을 반환하는 순수 함수를 넣을 수도 있습니다. +또한, [`PageData`](./runtime-api#usedata)를 인자로 받아 URL 문자열을 반환하는 순수 함수를 사용할 수도 있습니다. ```js export default { @@ -34,9 +34,9 @@ export default { } ``` -이 함수는 부작용이 없어야 하며, 범위 외의 것에 접근할 수 없으며, 브라우저에서 직렬화되어 실행됩니다. +이 함수는 브라우저에서 직렬화되어 실행되므로, 부작용을 가지지 않고 해당 스코프 외부의 어떤 것도 참조하지 않도록 해야 합니다. -기본적으로, 이 옵션은 문서 페이지 하단에 "Edit this page"라는 링크 텍스트를 추가합니다. `text` 옵션을 정의하여 이 텍스트를 사용자 정의할 수 있습니다. +기본적으로 이 설정은 문서 페이지 하단에 "Edit this page"이라는 텍스트 링크를 추가합니다. 이 텍스트는 `text` 옵션을 정의하여 커스터마이징 할 수 있습니다. ```js export default { @@ -49,9 +49,9 @@ export default { } ``` -## 프론트매터 설정 {#frontmatter-config} +## 전문에서 설정하기 {#frontmatter-config} -프론트매터의 `editLink` 옵션을 사용하여 페이지별로 이 기능을 비활성화할 수 있습니다: +페이지별로 이 기능을 비활성화하려면, 전문에서 `editLink` 옵션을 사용하세요: ```yaml --- diff --git a/docs/ko/reference/default-theme-footer.md b/docs/ko/reference/default-theme-footer.md index 5ca34795..de808252 100644 --- a/docs/ko/reference/default-theme-footer.md +++ b/docs/ko/reference/default-theme-footer.md @@ -1,13 +1,13 @@ # 푸터 {#footer} -VitePress는 `themeConfig.footer`가 존재할 때 페이지 하단에 전역 푸터를 표시합니다. +`themeConfig.footer`가 존재하면 VitePress는 페이지 하단에 전역 푸터를 표시합니다. ```ts export default { themeConfig: { footer: { - message: 'Released under the MIT License.', - copyright: 'Copyright © 2019-present Niceplugin' + message: 'MIT 라이선스에 따라 릴리즈되었습니다.', + copyright: '저작권 © 2019-현재 홍길동' } } } @@ -23,28 +23,28 @@ export interface Footer { } ``` -위의 구성은 HTML 문자열도 지원합니다. 예를 들어, 푸터 텍스트에 몇 가지 링크를 구성하고 싶다면, 다음과 같이 구성을 조정할 수 있습니다: +위의 구성은 HTML 문자열도 지원합니다. 예를 들어, 푸터 텍스트에 링크를 포함하고 싶다면, 다음과 같이 구성을 수정하면 됩니다: ```ts export default { themeConfig: { footer: { message: 'MIT 라이선스에 따라 릴리즈되었습니다.', - copyright: '저작권 © 2019-현재 Evan You' + copyright: '저작권 © 2019-현재 홍길동' } } } ``` ::: warning -`message`와 `저작권`에는 `

` 요소 안에 렌더링되기 때문에 인라인 요소만 사용할 수 있습니다. 블록 요소를 추가하고 싶다면, 대신 [`layout-bottom`](../guide/extending-default-theme#layout-slots) 슬롯을 사용하는 것을 고려하세요. +`message`와 `copyright`는 `

` 엘리먼트 내부에 렌더링되므로 인라인 엘리먼트만 사용할 수 있습니다. 블록 엘리먼트를 추가하려면 [`layout-bottom`](../guide/extending-default-theme#layout-slots) 슬롯을 사용하는 것이 좋습니다. ::: -푸터는 [사이드바](./default-theme-sidebar)가 보이는 경우에는 표시되지 않습니다. +[사이드바](./default-theme-sidebar)가 표시되는 경우 푸터는 표시되지 않습니다. -## 프론트매터 구성 {#frontmatter-config} +## 전문에서 설정하기 {#frontmatter-config} -이 기능은 프론트매터의 `footer` 옵션을 사용하여 페이지별로 비활성화될 수 있습니다: +이 기능은 전문의 `footer` 옵션을 사용하여 페이지별로 비활성화 할 수 있습니다. ```yaml --- diff --git a/docs/ko/reference/default-theme-home-page.md b/docs/ko/reference/default-theme-home-page.md index d60604d5..51550279 100644 --- a/docs/ko/reference/default-theme-home-page.md +++ b/docs/ko/reference/default-theme-home-page.md @@ -1,6 +1,6 @@ -# 홈페이지 {#home-page} +# 홈 페이지 {#home-page} -VitePress 기본 테마는 홈페이지 레이아웃을 제공하며, 이 사이트의 [홈페이지](../)에서도 사용된 것을 볼 수 있습니다. [frontmatter](./frontmatter-config)에 `layout: home`을 지정함으로써 여러분의 페이지에도 이를 사용할 수 있습니다. +VitePress 기본 테마는 홈 페이지 레이아웃을 제공합니다. 이것은 이 사이트의 [홈 페이지](../)에도 사용되었습니다. `layout: home`을 [전문](./frontmatter-config)에 지정하여 어느 페이지에서도 이를 사용할 수 있습니다. ```yaml --- @@ -8,11 +8,11 @@ layout: home --- ``` -하지만, 이 옵션만으로는 큰 효과를 보지 못합니다. `hero` 및 `features`와 같은 추가적인 옵션을 설정함으로써 홈페이지에 여러 가지 다른 사전 템플릿 "섹션"을 추가할 수 있습니다. +하지만 이 옵션만으로는 많은 것을 할 수 없습니다. 다행히도 `hero` 및 `features`와 같은 추가 옵션을 설정하여 홈 페이지에 다양한 사전 템플릿 "섹션"들을 추가할 수 있습니다. ## Hero 섹션 {#hero-section} -Hero 섹션은 홈페이지 맨 위에 옵니다. 여기에서 Hero 섹션을 구성하는 방법입니다. +Hero 섹션은 홈 페이지의 상단에 위치합니다. Hero 섹션을 구성하는 방법은 다음과 같습니다. ```yaml --- @@ -20,38 +20,38 @@ layout: home hero: name: VitePress - text: Vite & Vue로 구동되는 정적 사이트 생성기. - tagline: Lorem ipsum... + text: Vite & Vue 기반 정적 사이트 생성기 + tagline: 단 몇 분 만에 마크다운을 우아한 문서로 변환 image: src: /logo.png alt: VitePress actions: - theme: brand - text: 시작하기 + text: VitePress란 무엇인가? link: /guide/what-is-vitepress - theme: alt - text: GitHub에서 보기 + text: GitHub link: https://github.com/vuejs/vitepress --- ``` ```ts interface Hero { - // `text` 위에 표시되는 문자열입니다. 브랜드 색상이 - // 함께 제공되며 제품 이름과 같이 짧을 것으로 예상됩니다. + // `text` 위에 브랜드 색상으로 표시되는 문자열. + // 제품명 등 간략한 내용을 추천. name?: string - // hero 섹션의 주요 텍스트입니다. - // 이는 `h1` 태그로 정의됩니다. + // hero 섹션의 본문. + // `h1` 태그로 정의됨. text: string - // `text` 아래에 표시되는 태그라인입니다. + // `text` 아래에 표시되는 슬로건 문자열. tagline?: string - // 이미지는 텍스트 및 태그라인 영역 옆에 표시됩니다. + // `text` 및 `tagline` 옆에 표시되는 이미지. image?: ThemeableImage - // 홈 hero 섹션에 표시할 작업 버튼들입니다. + // hero 섹션에 표시할 버튼 리스트. actions?: HeroAction[] } @@ -61,26 +61,26 @@ type ThemeableImage = | { light: string; dark: string; alt?: string } interface HeroAction { - // 버튼의 색상 테마입니다. 기본값은 `brand`입니다. + // 버튼의 색상 테마. 기본값: `brand` theme?: 'brand' | 'alt' - // 버튼의 레이블입니다. + // 버튼의 레이블. text: string - // 버튼의 목적지 링크입니다. + // 버튼의 목적지 링크. link: string - // 링크 타겟 속성입니다. + // 링크의 target 어트리뷰트. target?: string - // 링크 rel 속성입니다. + // 링크의 rel 어트리뷰트. rel?: string } ``` -### 이름 색상 사용자 정의 {#customizing-the-name-color} +### `name` 색상 커스터마이징 {#customizing-the-name-color} -VitePress는 `name`에 대해 브랜드 색상 (`--vp-c-brand-1`)을 사용합니다. 하지만, `--vp-home-hero-name-color` 변수를 오버라이딩함으로써 이 색상을 사용자 정의할 수 있습니다. +VitePress는 `name`에 브랜드 색상(`--vp-c-brand-1`)을 사용합니다. 하지만 `--vp-home-hero-name-color` 변수를 재정의하여 이 색상을 커스텀 할 수 있습니다. ```css :root { @@ -88,7 +88,7 @@ VitePress는 `name`에 대해 브랜드 색상 (`--vp-c-brand-1`)을 사용합 } ``` -또한 `--vp-home-hero-name-background`와 결합하여 `name`에 그라데이션 색상을 부여할 수도 있습니다. +또한 `--vp-home-hero-name-background` 변수를 정의해 추가적으로 `name`을 그라데이션 색상으로 커스터마이징도 가능합니다. ```css :root { @@ -97,11 +97,11 @@ VitePress는 `name`에 대해 브랜드 색상 (`--vp-c-brand-1`)을 사용합 } ``` -## 기능 섹션 {#features-section} +## Features 섹션 {#features-section} -기능 섹션에서는 Hero 섹션 바로 다음에 보여주고 싶은 기능의 수를 제한 없이 나열할 수 있습니다. 구성하려면 frontmatter에 `features` 옵션을 전달합니다. +Features 섹션에서는 Hero 섹션 바로 아래에 표시할 각 feature를 원하는 만큼 나열할 수 있습니다. 이를 구성하려면 `features` 옵션을 전문에 전달하면 됩니다. -각 기능에 대해 이모지나 이미지 형태의 아이콘을 제공할 수 있습니다. 구성된 아이콘가 이미지(svg, png, jpeg...)인 경우, 적절한 너비와 높이를 가진 아이콘을 제공해야 합니다; 필요한 경우 어두운 테마 및 밝은 테마의 변형뿐만 아니라 설명, 본질적인 크기도 제공할 수 있습니다. +각 feature에 아이콘을 제공할 수 있으며, 이는 이모지 또는 이미지의 형태일 수 있습니다. 아이콘으로 이미지(svg, png, jpeg 등)를 사용하려면 적절한 너비와 높이를 제공해야 하며, 필요에 따라 설명, 이미지의 고유 크기, 다크 테마와 라이트 테마에 대한 변형 아이콘도 제공할 수 있습니다. ```yaml --- @@ -109,49 +109,49 @@ layout: home features: - icon: 🛠️ - title: 항상 간단하고 최소한의 + title: Simple and minimal, always details: Lorem ipsum... - icon: src: /cool-feature-icon.svg - title: 또 다른 멋진 기능 + title: Another cool feature details: Lorem ipsum... - icon: dark: /dark-feature-icon.svg light: /light-feature-icon.svg - title: 또 다른 멋진 기능 + title: Another cool feature details: Lorem ipsum... --- ``` ```ts interface Feature { - // 각 기능 상자에 아이콘을 표시합니다. + // 각 feature 박스에 표시할 아이콘. icon?: FeatureIcon - // 기능의 제목입니다. + // feature의 제목. title: string - // 기능의 세부 정보입니다. + // feature의 세부 정보. details: string - // 기능 구성 요소에서 클릭 시 링크합니다. - // 링크는 내부 또는 외부 모두 가능합니다. + // feature 컴포넌트 클릭 시 링크. + // 링크는 내부 또는 외부 모두 가능. // // 예: `guide/reference/default-theme-home-page` 또는 `https://example.com` link?: string - // 기능 구성 요소 내에서 표시될 링크 텍스트입니다. - // `link` 옵션과 함께 사용하는 것이 좋습니다. + // feature 컴포넌트 내 표시될 링크 텍스트. + // `link` 옵션과 함께 사용하는 것을 추천. // - // 예: `더 알아보기`, `페이지 방문`, 등 + // 예: `더 알아보기`, `페이지 방문` 등 linkText?: string - // `link` 옵션을 위한 링크 rel 속성입니다. + // `link` 옵션을 위한 링크 rel 어트리뷰트. // // 예: `external` rel?: string - // `link` 옵션을 위한 링크 target 속성입니다. + // `link` 옵션을 위한 링크 target 어트리뷰트. target?: string } @@ -169,7 +169,7 @@ type FeatureIcon = ## 마크다운 컨텐츠 {#markdown-content} -`---` frontmatter 구분자 아래에 마크다운을 더함으로써 사이트의 홈페이지에 추가 컨텐츠를 추가할 수 있습니다. +홈 페이지 레이아웃에 추가 컨텐츠를 작성하려면 전문 구분선 `---` 아래에 마크다운을 추가하면 됩니다. ````md --- @@ -177,12 +177,12 @@ layout: home hero: name: VitePress - text: Vite & Vue로 구동되는 정적 사이트 생성기. + text: Vite & Vue 기반 정적 사이트 생성기 --- ## 시작하기 -`npx`를 사용하여 바로 VitePress를 사용할 수 있습니다! +`npx`를 사용하여 VitePress를 바로 시작할 수 있습니다! ```sh npm init @@ -191,5 +191,5 @@ npx vitepress init ```` ::: info -VitePress는 항상 `layout: home` 페이지의 추가 컨텐츠에 자동 스타일을 적용하지는 않았습니다. 이전 동작으로 되돌리려면, frontmatter에 `markdownStyles: false`를 추가할 수 있습니다. +`layout: home` 페이지의 추가 컨텐츠에 자동으로 기본 마크다운 스타일이 적용됩니다(영문 원서에서는 반대로 설명함). 스타일을 적용하지 않으려면 전문에 `markdownStyles: false`를 추가하면 됩니다. ::: diff --git a/docs/ko/reference/default-theme-last-updated.md b/docs/ko/reference/default-theme-last-updated.md index f46b8f7a..2d4760e0 100644 --- a/docs/ko/reference/default-theme-last-updated.md +++ b/docs/ko/reference/default-theme-last-updated.md @@ -1,12 +1,12 @@ -# 마지막 업데이트 시간 {#last-updated} +# 마지막 업데이트 날짜 {#last-updated} -마지막 내용의 업데이트 시간은 페이지의 오른쪽 하단에 표시됩니다. 활성화하려면 config에 `lastUpdated` 옵션을 추가하세요. +마지막 업데이트 날짜는 페이지 오른쪽 하단에 표시됩니다. 이를 활성화하려면 구성 파일에 `lastUpdated` 옵션을 추가하세요. ::: tip -업데이트 시간을 보려면 markdown 파일을 커밋해야 합니다. +마크다운 파일을 커밋해야 업데이트된 시간을 확인할 수 있습니다. ::: -## 사이트 수준 설정 {#site-level-config} +## 사이트 단계에서 설정하기 {#site-level-config} ```js export default { @@ -14,9 +14,9 @@ export default { } ``` -## 프런트매터 설정 {#frontmatter-config} +## 전문에서 설정하기 {#frontmatter-config} -이 기능은 frontmatter의 `lastUpdated` 옵션을 사용하여 페이지별로 비활성화할 수 있습니다: +페이지별로 이 기능을 비활성화하려면, 전문에서 `lastUpdated` 옵션을 사용하세요: ```yaml --- @@ -24,4 +24,4 @@ lastUpdated: false --- ``` -자세한 내용은 [기본 테마: 마지막 업데이트 시간](./default-theme-config#lastupdated)를 참조하세요. 테마 수준에서 참 값을 설정하면 사이트 또는 페이지 수준에서 명시적으로 비활성화하지 않는 한 기능이 활성화됩니다. +자세한 내용은 [기본 테마: lastUpdated](./default-theme-config#lastupdated)를 참고하세요. 테마 레벨에서 참(truthy) 값을 설정하면, 사이트나 페이지 레벨에서 명시적으로 비활성화하지 않는 한 이 기능이 활성화됩니다. diff --git a/docs/ko/reference/default-theme-layout.md b/docs/ko/reference/default-theme-layout.md index de9c9d2c..cf97f416 100644 --- a/docs/ko/reference/default-theme-layout.md +++ b/docs/ko/reference/default-theme-layout.md @@ -1,6 +1,6 @@ # 레이아웃 {#layout} -페이지 [프런트매터](./frontmatter-config)에 `layout` 옵션을 설정함으로써 페이지 레이아웃을 선택할 수 있습니다. `doc`, `page`, `home`의 세 가지 레이아웃 옵션이 있습니다. 아무것도 지정하지 않으면, 해당 페이지는 `doc` 페이지로 처리됩니다. +페이지의 [전문](./frontmatter-config)에 `layout` 옵션을 설정하여 페이지 레이아웃을 선택할 수 있습니다. `doc`, `page`, `home` 세 가지 레이아웃 옵션이 있습니다. 아무것도 지정하지 않으면 `doc` 페이지로 처리됩니다. ```yaml --- @@ -8,38 +8,38 @@ layout: doc --- ``` -## Doc 레이아웃 {#doc-layout} +## `doc` 레이아웃 {#doc-layout} -`doc` 옵션은 기본 레이아웃이며, 전체 마크다운 내용을 "문서화"된 모양으로 스타일링합니다. 이것은 전체 내용을 `vp-doc` css 클래스로 감싸고, 그 아래 요소들에 스타일을 적용함으로써 작동합니다. +`doc` 옵션은 기본 레이아웃으로, 전체 마크다운 콘텐츠를 "문서" 스타일로 변환합니다. 이 레이아웃은 전체 콘텐츠를 `vp-doc` CSS 클래스로 감싸고, 하위 엘리먼트에 스타일을 적용하는 방식으로 작동합니다. -`p`나 `h2`와 같은 거의 모든 일반 요소들은 특별한 스타일링을 받습니다. 따라서 마크다운 내용 내에 사용자 정의 HTML을 추가할 경우, 이러한 스타일들에 영향을 받게 될 것임을 명심하세요. +`p`나 `h2` 같은 거의 모든 일반적인 엘리먼트들이 특별한 스타일을 갖게 됩니다. 따라서 마크다운 콘텐츠에 커스텀 HTML을 추가할 경우, 해당 HTML도 이러한 스타일의 영향을 받게 된다는 점을 유념해야 합니다. -또한 아래 나열된 문서화 특정 기능들을 제공합니다. 이 기능들은 이 레이아웃에서만 활성화됩니다. +이 레이아웃에서는 아래에 나열된 문서 전용 기능들도 제공됩니다. 이 기능들은 오직 이 레이아웃에서만 활성화됩니다. - 편집 링크 - 이전/다음 링크 -- 개요 +- 개요(outline) - [카본 광고](./default-theme-carbon-ads) -## 페이지 레이아웃 {#page-layout} +## `page` 레이아웃 {#page-layout} -`page` 옵션은 "빈 페이지"로 처리됩니다. 마크다운은 여전히 파싱되며, 모든 [마크다운 확장](../guide/markdown) 기능은 `doc` 레이아웃과 동일하게 작동하지만, 기본 스타일은 적용받지 않습니다. +`page` 옵션은 "빈 페이지"로 처리됩니다. 마크다운은 여전히 파싱되며, 모든 [마크다운 확장 기능](../guide/markdown)이 `doc` 레이아웃과 동일하게 작동하지만, 기본 스타일링은 적용되지 않습니다. -페이지 레이아웃을 통해 VitePress 테마의 마크업 영향을 받지 않고 모든 것을 직접 스타일링할 수 있습니다. 이는 사용자 정의 페이지를 생성하고 싶을 때 유용합니다. +이 페이지 레이아웃은 VitePress 테마가 마크업에 영향을 미치지 않도록 하여, 모든 스타일을 직접 지정할 수 있게 해줍니다. 이는 커스텀 페이지를 만들고자 할 때 유용합니다. -이 레이아웃에서도 페이지가 일치하는 사이드바 구성이 있는 경우 여전히 사이드바가 표시됨을 유의하세요. +이 레이아웃에서도 페이지에 매칭되는 사이드바 구성이 있는 경우 사이드바는 여전히 표시됩니다. -## 홈 레이아웃 {#home-layout} +## `home` 레이아웃 {#home-layout} -`home` 옵션은 템플릿화된 "홈페이지"를 생성합니다. 이 레이아웃에서는 `hero` 및 `features`와 같은 추가 옵션을 설정해 컨텐츠를 더 자세히 커스터마이즈할 수 있습니다. 자세한 내용은 [기본 테마: 홈 페이지](./default-theme-home-page)를 방문해주세요. +`home` 옵션은 템플릿화된 "홈 페이지"를 생성합니다. 이 레이아웃에서는 `hero`와 `features` 같은 추가 옵션을 설정하여 콘텐츠를 더 커스터마이징 할 수 있습니다. 자세한 내용은 [기본 테마: 홈 페이지](./default-theme-home-page)를 참고하세요. ## 레이아웃 없음 {#no-layout} -레이아웃을 원하지 않는 경우, 프런트매터를 통해 `layout: false`를 전달할 수 있습니다. 이 옵션은 완전히 맞춤화된 랜딩 페이지(기본적으로 사이드바, 내비게이션 바, 또는 푸터 없음)를 원할 때 유용합니다. +어떤 레이아웃도 원하지 않는 경우, 전문에 `layout: false`를 전달할 수 있습니다. 이 옵션은 (기본적으로 사이드바, 네비게이션 바, 또는 푸터가 없는) 완전히 커스터마이징 가능한 랜딩 페이지를 만들고자 할 때 유용합니다. -## 사용자 정의 레이아웃 {#custom-layout} +## 커스텀 레이아웃 {#custom-layout} -또한 사용자 정의 레이아웃을 사용할 수 있습니다: +커스텀 레이아웃을 사용할 수도 있습니다: ```md --- @@ -47,7 +47,7 @@ layout: foo --- ``` -이것은 컨텍스트에 등록된 `foo`라는 이름의 컴포넌트를 찾습니다. 예를 들어, `.vitepress/theme/index.ts`에서 컴포넌트를 전역으로 등록할 수 있습니다: +이것은 컨텍스트에 등록된 `foo`라는 이름의 컴포넌트를 찾습니다. 예를 들어 `.vitepress/theme/index.ts`에서 컴포넌트를 전역으로 등록할 수 있습니다: ```ts import DefaultTheme from 'vitepress/theme' diff --git a/docs/ko/reference/default-theme-prev-next-links.md b/docs/ko/reference/default-theme-prev-next-links.md index d083d7d9..276ae882 100644 --- a/docs/ko/reference/default-theme-prev-next-links.md +++ b/docs/ko/reference/default-theme-prev-next-links.md @@ -1,6 +1,6 @@ -# 이전 다음 링크 {#prev-next-links} +# 이전/다음 링크 {#prev-next-links} -이전 페이지와 다음 페이지에 대한 텍스트와 링크를 사용자 정의할 수 있습니다(문서 하단에 표시됨). 사이드바에 있는 텍스트와 다른 텍스트를 원하는 경우에 유용합니다. 또한, 하단부를 비활성화하거나 사이드바에 포함되지 않은 페이지로 링크하는 것이 유용할 수 있습니다. +문서 하단에 표시되는 이전 페이지와 다음 페이지의 텍스트와 링크를 커스터마이징 할 수 있습니다. 사이드바에 있는 텍스트와 다른 텍스트를 원할 경우 유용합니다. 또한 푸터를 비활성화하거나 사이드바에 포함되지 않은 페이지로 링크할 때도 유용할 수 있습니다. ## prev @@ -8,11 +8,11 @@ - 세부 사항: - 이전 페이지로의 링크에 표시할 텍스트/링크를 지정합니다. frontmatter에서 이를 설정하지 않으면, 사이드바 구성에서 텍스트/링크를 추론합니다. + 이전 페이지로 가는 링크에 표시할 텍스트/링크를 지정합니다. 전문에서 이 항목을 설정하지 않으면, 사이드바 구성에서 텍스트/링크가 유추됩니다. - 예제: - - 텍스트만 사용자 정의할 경우: + - 텍스트만 커스터마이징하려면: ```yaml --- @@ -20,17 +20,17 @@ --- ``` - - 텍스트와 링크 모두 사용자 정의할 경우: + - 텍스트와 링크를 모두 커스터마이즈하려면: ```yaml --- prev: - text: '마크다운' + text: '마크다운 확장 기능' link: '/guide/markdown' --- ``` - - 이전 페이지 숨기기: + - 이전 페이지를 숨기려면: ```yaml --- @@ -40,4 +40,4 @@ ## next -`prev`와 동일하지만 다음 페이지에 대한 설정입니다. +`prev`와 동일하지만, 다음 페이지에 대한 설정입니다. diff --git a/docs/ko/reference/default-theme-search.md b/docs/ko/reference/default-theme-search.md index 379623f8..9d446a99 100644 --- a/docs/ko/reference/default-theme-search.md +++ b/docs/ko/reference/default-theme-search.md @@ -6,7 +6,7 @@ outline: deep ## 로컬 검색 {#local-search} -VitePress는 [minisearch](https://github.com/lucaong/minisearch/)를 통해 브라우저 내 인덱스를 사용한 퍼지 전문 검색을 지원합니다. 이 기능을 활성화하려면, `.vitepress/config.ts` 파일 내에서 `themeConfig.search.provider` 옵션을 `'local'`로 설정하면 됩니다: +VitePress는 [minisearch](https://github.com/lucaong/minisearch/)로 브라우저 내 인덱스를 사용하는 퍼지(full-text) 검색을 지원합니다. 이 기능을 활성화하려면 `.vitepress/config.ts` 파일에서 `themeConfig.search.provider` 옵션을 `'local'`로 설정하면 됩니다: ```ts import { defineConfig } from 'vitepress' @@ -20,15 +20,15 @@ export default defineConfig({ }) ``` -예시 결과: +예제 결과: ![검색 모달의 스크린샷](/search.png) -또는, [Algolia DocSearch](#algolia-search)나 , 과 같은 커뮤니티 플러그인을 사용할 수 있습니다. +대안으로 [Algolia DocSearch](#algolia-search), , 와 같은 커뮤니티 플러그인을 사용할 수도 있습니다. ### i18n {#local-search-i18n} -다국어 검색을 사용하려면 다음과 같은 설정을 사용할 수 있습니다: +다국어 검색을 사용하려면 다음과 같은 구성을 사용해야 합니다: ```ts import { defineConfig } from 'vitepress' @@ -39,24 +39,24 @@ export default defineConfig({ provider: 'local', options: { locales: { - zh: { // 기본 로케일을 번역하려면 이것을 `root`로 만드십시오. + ko: { // 기본 로케일을 번역하려면 이것을 `root`로 만드십시오. translations: { button: { - buttonText: '搜索', - buttonAriaLabel: '搜索' + buttonText: '검색', + buttonAriaLabel: '검색' }, modal: { - displayDetails: '显示详细列表', - resetButtonTitle: '重置搜索', - backButtonTitle: '关闭搜索', - noResultsText: '没有结果', + displayDetails: '상세 목록 표시', + resetButtonTitle: '검색 지우기', + backButtonTitle: '검색 닫기', + noResultsText: '결과를 찾을 수 없습니다', footer: { - selectText: '选择', - selectKeyAriaLabel: '输入', - navigateText: '导航', - navigateUpKeyAriaLabel: '上箭头', - navigateDownKeyAriaLabel: '下箭头', - closeText: '关闭', + selectText: '선택', + selectKeyAriaLabel: '선택하기', + navigateText: '탐색', + navigateUpKeyAriaLabel: '위로', + navigateDownKeyAriaLabel: '아래로', + closeText: '닫기', closeKeyAriaLabel: 'esc' } } @@ -69,9 +69,9 @@ export default defineConfig({ }) ``` -### miniSearch 옵션 {#mini-search-options} +### MiniSearch 옵션 {#mini-search-options} -다음과 같이 MiniSearch를 구성할 수 있습니다: +MiniSearch를 다음과 같이 구성할 수 있습니다: ```ts import { defineConfig } from 'vitepress' @@ -103,11 +103,11 @@ export default defineConfig({ }) ``` -[MiniSearch 문서](https://lucaong.github.io/minisearch/classes/MiniSearch.MiniSearch.html)에서 더 많은 정보를 얻을 수 있습니다. +더 자세한 내용은 [MiniSearch 문서](https://lucaong.github.io/minisearch/classes/MiniSearch.MiniSearch.html)를 참고하세요. -### 사용자 정의 콘텐츠 렌더러 {#custom-content-renderer} +### 커스텀 컨텐츠 렌더러 {#custom-content-renderer} -색인 생성 전에 마크다운 콘텐츠를 렌더링하는 데 사용되는 함수를 커스터마이즈할 수 있습니다: +마크다운 컨텐츠를 인덱싱하기 전에 렌더링하는 데 사용되는 함수를 커스터마이징할 수 있습니다: ```ts import { defineConfig } from 'vitepress' @@ -131,11 +131,11 @@ export default defineConfig({ }) ``` -이 함수는 클라이언트 사이드 사이트 데이터에서 제거될 것이므로, 여기서 Node.js API를 사용할 수 있습니다. +이 함수는 클라이언트 사이드 사이트 데이터에서 제거되므로, Node.js API를 사용할 수 있습니다. -#### 예시: 검색에서 페이지 제외 {#example-excluding-pages-from-search} +#### 예제: 검색에서 페이지 제외 {#example-excluding-pages-from-search} -페이지에서 `search: false`를 프론트매터에 추가하여 검색에서 페이지를 제외할 수 있습니다. 또는 다음과 같이 합니다: +페이지의 전문에 `search: false`를 추가하여 검색에서 해당 페이지를 제외할 수 있습니다. 또는: ```ts import { defineConfig } from 'vitepress' @@ -158,10 +158,10 @@ export default defineConfig({ ``` ::: warning 참고 -사용자 정의 `_render` 함수를 제공하는 경우, `search: false` 프론트매터를 직접 처리해야 합니다. 또한, `md.render`가 호출되기 전에는 `env` 객체가 완전히 채워지지 않으므로, `frontmatter`와 같은 선택적 `env` 속성에 대한 검사는 그 이후에 수행해야 합니다. +커스텀 `_render` 함수가 제공된 경우, `search: false` 전문을 직접 처리해야 합니다. 또한, `md.render`가 호출되기 전에 `env` 객체가 완전히 채워지지 않으므로, `frontmatter`와 같은 선택적 `env` 프로퍼티에 대한 검사는 그 이후에 수행해야 합니다. ::: -#### 예시: 콘텐츠 변환 - 앵커 추가 {#example-transforming-content-adding-anchors} +#### 예제: 콘텐츠 변환 - 앵커 추가 {#example-transforming-content-adding-anchors} ```ts import { defineConfig } from 'vitepress' @@ -185,7 +185,7 @@ export default defineConfig({ ## Algolia 검색 {#algolia-search} -VitePress는 [Algolia DocSearch](https://docsearch.algolia.com/docs/what-is-docsearch)를 사용하여 문서 사이트 검색을 지원합니다. 시작 가이드를 참조하세요. 작동하게 하려면 `.vitepress/config.ts`에서 최소한 다음 정보를 제공해야 합니다: +VitePress는 [Algolia DocSearch](https://docsearch.algolia.com/docs/what-is-docsearch)를 사용한 문서 사이트 검색 기능을 지원합니다. 시작 가이드를 참고하세요. `.vitepress/config.ts`에서 이 기능을 사용하려면 최소한 다음 구성을 제공해야 합니다: ```ts import { defineConfig } from 'vitepress' @@ -206,7 +206,7 @@ export default defineConfig({ ### i18n {#algolia-search-i18n} -다국어 검색을 사용하려면 다음과 같은 설정을 사용할 수 있습니다: +다국어 검색을 사용하려면 다음과 같이 구성해야 합니다: ```ts import { defineConfig } from 'vitepress' @@ -220,43 +220,43 @@ export default defineConfig({ apiKey: '...', indexName: '...', locales: { - zh: { - placeholder: '搜索文档', + ko: { + placeholder: '문서 검색', translations: { button: { - buttonText: '搜索文档', - buttonAriaLabel: '搜索文档' + buttonText: '검색', + buttonAriaLabel: '검색' }, modal: { searchBox: { - resetButtonTitle: '清除查询条件', - resetButtonAriaLabel: '清除查询条件', - cancelButtonText: '取消', - cancelButtonAriaLabel: '取消' + resetButtonTitle: '검색 지우기', + resetButtonAriaLabel: '검색 지우기', + cancelButtonText: '취소', + cancelButtonAriaLabel: '취소' }, startScreen: { - recentSearchesTitle: '搜索历史', - noRecentSearchesText: '没有搜索历史', - saveRecentSearchButtonTitle: '保存至搜索历史', - removeRecentSearchButtonTitle: '从搜索历史中移除', - favoriteSearchesTitle: '收藏', - removeFavoriteSearchButtonTitle: '从收藏中移除' + recentSearchesTitle: '검색 기록', + noRecentSearchesText: '최근 검색 없음', + saveRecentSearchButtonTitle: '검색 기록에 저장', + removeRecentSearchButtonTitle: '검색 기록에서 삭제', + favoriteSearchesTitle: '즐겨찾기', + removeFavoriteSearchButtonTitle: '즐겨찾기에서 삭제' }, errorScreen: { - titleText: '无法获取结果', - helpText: '你可能需要检查你的网络连接' + titleText: '결과를 가져올 수 없습니다', + helpText: '네트워크 연결을 확인하세요' }, footer: { - selectText: '选择', - navigateText: '切换', - closeText: '关闭', - searchByText: '搜索提供者' + selectText: '선택', + navigateText: '탐색', + closeText: '닫기', + searchByText: '검색 기준' }, noResultsScreen: { - noResultsText: '无法找到相关结果', - suggestedQueryText: '你可以尝试查询', - reportMissingResultsText: '你认为该查询应该有结果？', - reportMissingResultsLinkText: '点击反馈' + noResultsText: '결과를 찾을 수 없습니다', + suggestedQueryText: '새로운 검색을 시도할 수 있습니다', + reportMissingResultsText: '해당 검색어에 대한 결과가 있어야 합니까?', + reportMissingResultsLinkText: '피드백 보내기 클릭' } } } @@ -268,11 +268,11 @@ export default defineConfig({ }) ``` -[이 옵션들](https://github.com/vuejs/vitepress/blob/main/types/docsearch.d.ts)은 덮어쓸 수 있습니다. 공식 Algolia 문서에서 더 많은 정보를 알아보세요. +[이 옵션들](https://github.com/vuejs/vitepress/blob/main/types/docsearch.d.ts)은 재작성 할 수 있습니다. 이에 대해 자세히 알고 싶다면 Algolia 공식 문서를 참고하세요. ### 크롤러 구성 {#crawler-config} -이 사이트가 사용하는 것을 기반으로 한 예제 구성입니다: +이 사이트에서 사용하는 예제 구성을 소개합니다: ```ts new Crawler({ @@ -285,7 +285,7 @@ new Crawler({ exclusionPatterns: [], ignoreCanonicalTo: false, discoveryPatterns: ['https://vitepress.dev/**'], - schedule: '매주 토요일 05:10에', + schedule: 'at 05:10 on Saturday', actions: [ { indexName: 'vitepress', @@ -297,7 +297,7 @@ new Crawler({ content: '.content p, .content li', lvl0: { selectors: '', - defaultValue: '문서' + defaultValue: 'Documentation' }, lvl2: '.content h2', lvl3: '.content h3', diff --git a/docs/ko/reference/default-theme-team-page.md b/docs/ko/reference/default-theme-team-page.md index 86e7b7ca..2123f349 100644 --- a/docs/ko/reference/default-theme-team-page.md +++ b/docs/ko/reference/default-theme-team-page.md @@ -5,7 +5,7 @@ const members = [ { avatar: 'https://github.com/yyx990803.png', name: 'Evan You', - title: '창작자', + title: 'Creator', links: [ { icon: 'github', link: 'https://github.com/yyx990803' }, { icon: 'twitter', link: 'https://twitter.com/youyuxi' } @@ -14,7 +14,7 @@ const members = [ { avatar: 'https://github.com/kiaking.png', name: 'Kia King Ishii', - title: '개발자', + title: 'Developer', links: [ { icon: 'github', link: 'https://github.com/kiaking' }, { icon: 'twitter', link: 'https://twitter.com/KiaKing85' } @@ -25,11 +25,11 @@ const members = [ # 팀 페이지 {#team-page} -팀을 소개하고 싶다면, 팀 페이지를 구성하기 위해 Team 컴포넌트를 사용할 수 있습니다. 이러한 컴포넌트를 사용하는 방법에는 두 가지가 있습니다. 하나는 문서 페이지에 포함시키는 것이고, 다른 하나는 전체 팀 페이지를 만드는 것입니다. +팀을 소개하고자 할 때, 팀 컴포넌트를 사용하여 팀 페이지를 구성할 수 있습니다. 이 컴포넌트를 사용하는 방법은 두 가지가 있습니다. 하나는 문서 페이지에 포함시키는 방법이고, 다른 하나는 전체 팀 페이지를 만드는 방법입니다. -## 페이지에서 팀 멤버 보여주기 {#show-team-members-in-a-page} +## 페이지에서 팀 구성원 보여주기 {#show-team-members-in-a-page} -`vitepress/theme`에서 제공되는 `` 컴포넌트를 사용하여 어떤 페이지에서든 팀 멤버 목록을 표시할 수 있습니다. +`vitepress/theme`에서 제공되는 `` 컴포넌트를 사용하여, 어떤 페이지에서도 팀 구성원 목록을 표시할 수 있습니다. ```html -# 우리 팀 +# Our Team -우리 훌륭한 팀을 만나보세요. +Say hello to our awesome team. ``` -위 코드는 카드 형태의 요소로 팀 멤버를 표시합니다. 아래와 비슷하게 표시될 것입니다. +위 코드는 카드 형태의 엘리먼트로 팀 구성원을 표시합니다. 아래와 비슷한 형태로 표시됩니다. -`` 컴포넌트는 `small` 및 `medium`의 두 가지 다른 크기로 제공됩니다. 선호도에 달렸지만, 보통 문서 페이지에서 사용할 때는 `small` 크기가 더 잘 맞을 것입니다. 또한 "description"이나 "sponsor" 버튼을 추가하는 등 각 멤버에 대해 더 많은 속성을 추가할 수 있습니다. [``](#vpteammembers)에서 더 자세히 알아보세요. +`` 컴포넌트는 `small`과 `medium` 두 가지 크기로 제공됩니다. 개인의 선호도에 따라 선택할 수 있지만, 일반적으로 `small` 사이즈가 문서 페이지에 더 적합합니다. 또한, 각 구성원에 "설명"이나 "후원" 버튼과 같은 프로퍼티를 추가할 수도 있습니다. 자세한 내용은 [``](#vpteammembers)에서 확인할 수 있습니다. -문서 페이지에 팀 멤버를 포함시키는 것은 전용 전체 팀 페이지를 만드는 것이 너무 과한 경우나, 문서 맥락을 참조로 일부 멤버를 소개할 때 좋습니다. +문서 페이지에 팀 구성원을 포함시키는 것은 전용 팀 페이지를 만드는 것이 과할 수 있는 소규모 팀이나, 문서의 맥락에 따라 일부 구성원을 소개할 때 좋습니다. -멤버 수가 많거나, 멤버를 보여주기 위해 더 많은 공간을 원한다면 [전체 팀 페이지 만들기](#create-a-full-team-page)를 고려해보세요. +만약 많은 수의 구성원이 있거나, 팀 구성원을 보여줄 더 많은 공간이 필요하다면, [전체 팀 페이지 만들기](#create-a-full-team-page)를 고려해 보세요. ## 전체 팀 페이지 만들기 {#create-a-full-team-page} -문서 페이지에 팀 멤버를 추가하는 대신, 전체 팀 페이지를 만들 수도 있습니다. 사용자 지정 [홈 페이지](./default-theme-home-page)를 생성하는 방법과 유사합니다. +팀 구성원을 문서 페이지에 추가하는 대신, 전체 팀 페이지를 만들어 [홈 페이지](./default-theme-home-page)를 커스텀하는 것처럼 팀 페이지를 만들 수도 있습니다. -팀 페이지를 생성하려면 먼저, 새 md 파일을 만듭니다. 파일 이름은 중요하지 않지만, 여기서는 `team.md`라고 하겠습니다. 이 파일에서 frontmatter 옵션 `layout: page`를 설정한 다음, `TeamPage` 컴포넌트를 사용하여 페이지 구조를 구성합니다. +팀 페이지를 만들려면, 먼저 새로운 마크다운 파일을 생성하세요. 파일 이름은 중요하지 않지만, 여기서는 `team.md`라고 부르겠습니다. 이 파일에서 전문 옵션에 `layout: page`를 설정한 후, `TeamPage` 컴포넌트를 사용하여 페이지 구조를 구성합니다. ```html --- @@ -87,7 +87,7 @@ const members = [ { avatar: 'https://www.github.com/yyx990803.png', name: 'Evan You', - title: '창작자', + title: 'Creator', links: [ { icon: 'github', link: 'https://github.com/yyx990803' }, { icon: 'twitter', link: 'https://twitter.com/youyuxi' } @@ -100,11 +100,11 @@ const members = [ ``` -전체 팀 페이지를 생성할 때는 모든 컴포넌트를 `` 컴포넌트로 감싸야 합니다. 이 컴포넌트는 공간 구조와 같은 적절한 레이아웃 구조를 팀 관련 컴포넌트에 적용할 것입니다. +전체 팀 페이지를 만들 때는 모든 컴포넌트를 `` 컴포넌트로 감싸야 합니다. 이 컴포넌트는 중첩된 팀 관련 컴포넌트들이 적절한 레이아웃 구조와 간격을 갖도록 합니다. -`` 컴포넌트는 페이지 제목 섹션을 추가합니다. 제목은 `

` 헤딩입니다. 팀에 대해 문서화하려면 `#title`과 `#lead` 슬롯을 사용하십시오. +`` 컴포넌트는 페이지 제목 섹션을 추가합니다. 제목은 `

` 헤딩으로 표시됩니다. `#title`과 `#lead` 슬롯을 사용하여 팀에 대한 설명을 작성할 수 있습니다. -``는 문서 페이지에서 사용할 때와 동일하게 작동합니다. 회원 목록을 표시합니다. +`` 컴포넌트는 문서 페이지에서 사용할 때와 동일하게 작동하며, 팀 구성원 목록을 표시합니다. -### 팀 멤버를 구분하기 위한 섹션 추가 {#add-sections-to-divide-team-members} +### 팀 구성원을 구분하기 위한 섹션 추가 {#add-sections-to-divide-team-members} -팀 페이지에 "섹션"을 추가할 수 있습니다. 예를 들어, 코어 팀 멤버와 커뮤니티 파트너와 같은 다양한 유형의 팀 멤버가 있을 수 있습니다. 이러한 멤버를 섹션으로 나누어 각 그룹의 역할을 더 잘 설명할 수 있습니다. +팀 페이지에 "섹션"을 추가할 수도 있습니다. 예를 들어, 핵심 팀 구성원과 커뮤니티 파트너와 같은 다양한 유형의 팀 구성원이 있을 수 있습니다. 이 구성원들을 섹션으로 나누어 각 그룹의 역할을 더 잘 설명할 수 있습니다. -이를 위해 이전에 만든 `team.md` 파일에 `` 컴포넌트를 추가하십시오. +이를 위해 이전에 만든 `team.md` 파일에 `` 컴포넌트를 추가하세요. ```html --- @@ -143,12 +143,12 @@ const partners = [...] - + - +