Skip to content

Commit

Permalink
Merge branch 'main' into feat/allowed-hosts
Browse files Browse the repository at this point in the history
  • Loading branch information
@sarah11918
sarah11918 authored Feb 26, 2025
2 parents 3e39de3 + de8a334 commit 77ab41e
Show file tree
Hide file tree
Showing 56 changed files with 1,181 additions and 663 deletions.
97 changes: 46 additions & 51 deletions i18n-guides/한국어.md
View file
Original file line number Diff line number Diff line change
@@ -1,29 +1,25 @@
# Astro 문서 한국어 번역 안내서
# Astro 문서 한국어 번역 가이드

이 안내서는 Astro 공식 문서의 한국어 번역에 기여하려는 분들을 위해 작성되었습니다.
이 가이드는 Astro 문서의 한국어 번역에 기여하고자 하는 분들을 위해 작성되었습니다.

한국어 번역에 관심있는 분들은 [Astro 공식 Discord 서버](https://astro.build/chat)의 [한국어 번역 채널](https://discord.com/channels/830184174198718474/1073677243290767512)에 참여해주세요!

## 기본 규칙

- **항상 원 저자의 의도를 유지하세요:** 가능한 한 문장의 어조와 방향이 영어 버전에 쓰여진 내용과 일치하도록 번역하세요.
- **쉬운 이해를 우선시하세요:** 간혹 정확한 번역과 쉽게 이해할 수 있는 번역 사이에서 선택해야 하는 경우가 있습니다. 예를 들어 용어를 사용하기보다 풀어서 설명해야 하는 경우가 존재합니다. 이런 경우 항상 최대한 단순하고 간결하며 이해하기 쉽게 번역해야 합니다.
번역에 관심있는 분들은 [Astro 공식 Discord 서버](https://astro.build/chat)의 [한국어 번역 채널](https://discord.com/channels/830184174198718474/1073677243290767512)에 참여해주세요!

## 표준

간결하고 일관된 번역을 유지하기 위해 다음과 같은 몇 가지 표준이 권장됩니다.

### 링크

- **외부 링크:** 외부 링크의 한국어 버전이 존재하는 경우 URL을 업데이트하여 한국어 버전의 링크로 이동할 수 있어야 합니다. 그렇지 않은 경우 영어 페이지의 기존 URL을 유지합니다.
- **외부 링크:**
- 외부 링크의 한국어 페이지가 존재하면 URL을 업데이트하여 한국어 페이지의 링크를 제공해야 합니다.
- 한국어 페이지가 존재하지 않으면 기존 URL을 유지합니다.
- **내부 링크:**
- Astro 공식 문서 페이지에 대한 링크는 항상 `/en`을 `/ko`로 업데이트합니다.
- 링크로 이동할 페이지가 아직 번역되지 않은 경우에는 `/en`은 `/ko`로 수정하되, ID는 영어 버전을 그대로 유지합니다.
- 다른 페이지에서 링크된 페이지를 번역하는 경우, 해당 페이지를 링크하는 다른 페이지의 업데이트도 PR에 포함시킵니다.
- Astro 문서 페이지에 대한 링크는 `/en`을 `/ko`로 업데이트합니다.
- 링크로 이동할 페이지가 아직 번역되지 않았다면 `/en`을 `/ko`로 수정하되, URL의 앵커는 그대로 유지합니다.

### 코드

Astro API, JavaScript 또는 기타 라이브러리의 일부가 아닌 경우에는 한국어를 사용하는 독자들의 이해를 돕기 위해 주석, 문자열 데이터를 번역합니다.
Astro API, JavaScript 또는 기타 라이브러리의 일부가 아니라면 독자들의 이해를 돕기 위해 주석, 문자열 데이터를 번역합니다.

예시:

Expand Down Expand Up @@ -51,46 +47,45 @@ import MySiteLayout from '../layouts/MySiteLayout.astro';

### 기타

- 독자를 지칭해야 하는 경우 `당신`, `귀하`라는 표현 대신 `여러분` 이라는 표현을 사용하는 것을 권장합니다.
- `인라인 코드`가 디렉터리 또는 파일의 경로를 나타내는 경우 디렉터리 또는 파일임을 명시하세요. 예: (`/src/pages` 디렉터리, `/src/pages/index.astro` 파일)
- 버튼의 텍스트는 동작을 유도하기 위해 `~하기`로 번역하는 것을 권장합니다. (예: `Install Astro` → `Astro 설치하기`)
- 메뉴 또는 제목을 번역할때는 간결하고 명확한 정보를 전달하기 위해 명사로 번역하는 것을 권장합니다. (예: `Install Astro` → `Astro 설치`)
- 설명을 위한 소괄호와 앞에 위치한 단어 사이에 공백을 추가하여 통일성을 유지합니다. (예: `사이드바 (정적 HTML)`)

## 용어집

잘못된 번역을 발견했거나 새로운 번역을 추가하고 싶다면 PR을 보내주세요!

> `Markdown`, `Astro`, `TypeScript`, `React` 등 회사명, 제품명과 같은 고유한 이름은 한글로 번역하지 않습니다.
| 원문 | 번역 | 출처 | 비고 |
| :------------------ | :------------ | :----------------------------------------------------------- | ---- |
| changelog | 변경 로그 | | |
| client-side | 클라이언트 측 | | |
| component | 컴포넌트 | 외래어 표기법 | |
| configuration | 구성 | [정보통신용어사전](https://terms.tta.or.kr/dictionary/dictionaryView.do?word_seq=039507-1) | |
| content collections | 콘텐츠 컬렉션 | 외래어 표기법 | |
| dependencies | 종속성 | | |
| directive | 지시어 | | 문장이 연상되는 지시문 대신 키워드 또는 예약어가 연상되는 지시어 사용 |
| directory | 디렉터리 | [우리말샘](https://opendict.korean.go.kr/dictionary/view?sense_no=136968) | |
| element | 요소 | [정보통신용어사전](https://terms.tta.or.kr/dictionary/dictionaryView.do?word_seq=095809-1) | |
| footer | 바닥글 | Microsoft | |
| fragment | 프래그먼트 | | |
| frontmatter | 프런트매터 | | |
| header | 머리글 | Microsoft | |
| integration | 통합 | | |
| island | 아일랜드 | 외래어 표기법 | |
| production | 프로덕션 | 외래어 표기법 | |
| release | 릴리스 | 마이크로소프트 | |
| rendering | 렌더링 | [정보통신용어사전](https://terms.tta.or.kr/dictionary/dictionaryView.do?word_seq=054262-2) | |
| script | 스크립트 | [정보통신용어사전](https://terms.tta.or.kr/dictionary/dictionaryView.do?word_seq=054948-1) | |
| server-side | 서버 측 | | |
| syntax | 구문 | [정보통신용어사전](https://terms.tta.or.kr/dictionary/dictionaryView.do?word_seq=057320-1) | |
| tag | 태그 | 외래어 표기법 | |
| template | 템플릿 | [정보통신용어사전](https://terms.tta.or.kr/dictionary/dictionaryView.do?word_seq=057749-1) | |
| troubleshooting | 문제 해결 | Microsoft | |
| variable | 변수 | [정보통신용어사전](https://terms.tta.or.kr/dictionary/dictionaryView.do?word_seq=059344-1) | |

출처의 일부는 다음에서 찾을 수 있습니다.

- 외래어 표기법: 국립국어원의 [외래어 표기법](https://kornorms.korean.go.kr/example/exampleList.do)에서 검색할 수 있습니다.

- Microsoft: [Microsoft Terminology Search](https://msit.powerbi.com/view?r=eyJrIjoiODJmYjU4Y2YtM2M0ZC00YzYxLWE1YTktNzFjYmYxNTAxNjQ0IiwidCI6IjcyZjk4OGJmLTg2ZjEtNDFhZi05MWFiLTJkN2NkMDExZGI0NyIsImMiOjV9)에서 검색할 수 있습니다.

> `Markdown`, `Astro`, `TypeScript`, `React`, `Intellisense` 등 고유한 이름은 한글로 번역하지 않습니다.
| 원문 | 번역 | 출처 |
| :------------------ | :------------ | :----------------------------------------------------------- |
| changelog | 변경 로그 | |
| client-side | 클라이언트 측 | |
| configuration | 구성 | |
| content collections | 콘텐츠 컬렉션 | |
| dependencies | 의존성 | |
| directive | 지시어 | |
| directory | 디렉터리 | |
| e-commerce | 이커머스 | | |
| footer | 푸터 | |
| format(ting) / formatter | 포맷팅 / 포맷터 | |
| fragment | 프래그먼트 | |
| frontend | 프런트엔드 | |
| frontmatter | 프런트매터 | |
| header | 헤더 | |
| hook | 훅 | |
| hydration | 하이드레이션 | |
| island | 아일랜드 | |
| on-demand | 온디맨드 | |
| placeholder | 자리 표시자 | |
| prerequisites | 사전 준비 사항 | |
| release | 릴리스 | |
| repository | 리포지토리 | |
| server-side | 서버 측 | |
| toolbar | 도구 모음 | |
| troubleshooting | 문제 해결 | |
| type safe | 타입 안전 | |
| view transitions | 뷰 전환 | [MDN][mdn-vt], [Chrome for Developers][chrome-vt] |

[mdn-vt]: https://developer.mozilla.org/ko/docs/Web/API/View_Transition_API
[chrome-vt]: https://developer.chrome.com/docs/web-platform/view-transitions?hl=ko
32 changes: 15 additions & 17 deletions src/content/docs/en/basics/astro-components.mdx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,6 @@ title: Components
description: An introduction to Astro components.
i18nReady: true
---

import ReadMore from '~/components/ReadMore.astro';

**Astro components** are the basic building blocks of any Astro project. They are HTML-only templating components with no client-side runtime and use the `.astro` file extension.
Expand Down Expand Up @@ -45,7 +44,6 @@ You can use the component script to write any JavaScript code that you need to r
- fetching content from an API or database
- creating variables that you will reference in your template


```astro title="src/components/MyComponent.astro"
---
import SomeAstroComponent from '../components/SomeAstroComponent.astro';
Expand All @@ -54,6 +52,7 @@ import someData from '../data/pokemon.json';
// Access passed-in component props, like `<X title="Hello, World" />`
const { title } = Astro.props;
// Fetch external data, even from a private API or database
const data = await fetch('SOME_SECRET_API_URL/users').then(r => r.json());
---
Expand Down Expand Up @@ -108,7 +107,7 @@ const { title } = Astro.props;
</ul>
<!-- Use a template directive to build class names from multiple strings or even objects! -->
<p class:list={["add", "dynamic", {classNames: true}]} />
<p class:list={["add", "dynamic", { classNames: true }]} />
```

## Component-based design
Expand All @@ -126,7 +125,6 @@ import Button from './Button.astro';
</div>
```


## Component Props

An Astro component can define and accept props. These props then become available to the component template for rendering HTML. Props are available on the `Astro.props` global in your frontmatter script.
Expand Down Expand Up @@ -221,8 +219,6 @@ import Wrapper from '../components/Wrapper.astro';

This pattern is the basis of an [Astro layout component](/en/basics/layouts/): an entire page of HTML content can be “wrapped” with `<SomeLayoutComponent></SomeLayoutComponent>` tags and sent to the component to render inside of common page elements defined there.



### Named Slots

An Astro component can also have named slots. This allows you to pass only HTML elements with the corresponding slot name into a slot's location.
Expand All @@ -240,18 +236,20 @@ const { title } = Astro.props;
---
<div id="content-wrapper">
<Header />
<slot name="after-header" /> <!-- children with the `slot="after-header"` attribute will go here -->
<!-- children with the `slot="after-header"` attribute will go here -->
<slot name="after-header" />
<Logo />
<h1>{title}</h1>
<slot /> <!-- children without a `slot`, or with `slot="default"` attribute will go here -->
<!-- children without a `slot`, or with `slot="default"` attribute will go here -->
<slot />
<Footer />
<slot name="after-footer" /> <!-- children with the `slot="after-footer"` attribute will go here -->
<!-- children with the `slot="after-footer"` attribute will go here -->
<slot name="after-footer" />
</div>
```

To inject HTML content into a particular slot, use the `slot` attribute on any child element to specify the name of the slot. All other child elements of the component will be injected into the default (unnamed) `<slot />`.


```astro /slot=".*?"/
---
// src/pages/fred.astro
Expand All @@ -273,7 +271,7 @@ To pass multiple HTML elements into a component's `<slot/>` placeholder without

```astro title="src/components/CustomTable.astro" "<slot name="header"/>" "<slot name="body"/>"
---
// Create a custom table with named slot placeholders for head and body content
// Create a custom table with named slot placeholders for header and body content
---
<table class="bg-white">
<thead class="sticky top-0 bg-white"><slot name="header" /></thead>
Expand Down Expand Up @@ -306,13 +304,12 @@ Note that named slots must be an immediate child of the component. You cannot pa
Named slots can also be passed to [UI framework components](/en/guides/framework-components/)!
:::


:::note
It is not possible to dynamically generate an Astro slot name, such as within a map function. If this feature is needed within UI framework components, it might be best to generate these dynamic slots within the framework itself.
It is not possible to dynamically generate an Astro slot name, such as within a [map](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/map) function. If this feature is needed within UI framework components, it might be best to generate these dynamic slots within the framework itself.
:::


### Fallback Content for Slots

Slots can also render **fallback content**. When there are no matching children passed to a slot, a `<slot />` element will render its own placeholder children.

```astro {14}
Expand All @@ -335,7 +332,7 @@ const { title } = Astro.props;
</div>
```

Fallback content will only be displayed when there are no matching elements with the slot="name" attribute being passed in to a named slot.
Fallback content will only be displayed when there are no matching elements with the `slot="name"` attribute being passed in to a named slot.

Astro will pass an empty slot when a slot element exists but has no content to pass. Fallback content cannot be used as a default when an empty slot is passed. Fallback content is only displayed when no slot element can be found.

Expand Down Expand Up @@ -372,10 +369,10 @@ import BaseLayout from './BaseLayout.astro';
```

:::note
Named slots can be transferred to another component using both the `name` and `slot` attributes on a `<slot />` tag
Named slots can be transferred to another component using both the `name` and `slot` attributes on a `<slot />` tag.
:::

Now, the default and `head` slots passed to `HomeLayout` will be transferred to the `BaseLayout` parent
Now, the default and `head` slots passed to `HomeLayout` will be transferred to the `BaseLayout` parent.

```astro
// src/pages/index.astro
Expand All @@ -393,6 +390,7 @@ import HomeLayout from '../layouts/HomeLayout.astro';
Astro supports importing and using `.html` files as components or placing these files within the `src/pages/` subdirectory as pages. You may want to use HTML components if you're reusing code from an existing site built without a framework, or if you want to ensure that your component has no dynamic features.

HTML components must contain only valid HTML, and therefore lack key Astro component features:

- They don't support frontmatter, server-side imports, or dynamic expressions.
- Any `<script>` tags are left unbundled, treated as if they had `is:inline`.
- They can only [reference assets that are in the `public/` folder](/en/basics/project-structure/#public).
Expand Down
7 changes: 4 additions & 3 deletions src/content/docs/en/guides/configuring-astro.mdx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -28,7 +28,6 @@ It is only required if you have something to configure, but most projects will u

We recommend using the default file format `.mjs` in most cases, or `.ts` if you want to write TypeScript in your config file. However, `astro.config.js` and `astro.config.cjs` are also supported.


<ReadMore>Read Astro's [configuration reference](/en/reference/configuration-reference/) for a full overview of all supported configuration options.</ReadMore>

## The TypeScript config File
Expand Down Expand Up @@ -84,9 +83,11 @@ const { ...props } = Astro.props;
<head>
<meta charset="utf-8">
<Head />
<!-- -->
<!-- Additional head elements -->
</head>
<body><!-- --></body>
<body>
<!-- Page content goes here -->
</body>
</html>
```

Expand Down
Loading

0 comments on commit 77ab41e

Please sign in to comment.