From 473e44b32a358a42e015a29d5e476e9f301ab23a Mon Sep 17 00:00:00 2001
From: Restitutor1008 <restitutor1008@gmail.com>
Date: Sat, 31 Oct 2026 07:31:19 +0000
Subject: [PATCH] docs(landing): translate installation page into Korean

Add page.ko.mdx for /docs/installation, register it in
src/i18n/pages.ts, and add language alternates to the English
page metadata.

Refs #870

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01XKr1b8ZfeaoBrHc1WTodFK
---
 .../(detail)/docs/installation/page.ko.mdx    | 146 ++++++++++++++++++
 .../app/(detail)/docs/installation/page.mdx   |   5 +
 apps/landing/src/i18n/pages.ts                |   4 +
 3 files changed, 155 insertions(+)
 create mode 100644 apps/landing/src/app/(detail)/docs/installation/page.ko.mdx

diff --git a/apps/landing/src/app/(detail)/docs/installation/page.ko.mdx b/apps/landing/src/app/(detail)/docs/installation/page.ko.mdx
new file mode 100644
index 000000000..6ae2d240b
--- /dev/null
+++ b/apps/landing/src/app/(detail)/docs/installation/page.ko.mdx
@@ -0,0 +1,146 @@
+export const metadata = {
+  title: '설치',
+  alternates: {
+    canonical: '/ko/docs/installation',
+    languages: {
+      en: '/docs/installation',
+      ko: '/ko/docs/installation',
+      'x-default': '/docs/installation',
+    },
+  },
+}
+
+# 설치
+
+## @devup-ui/react 설치
+
+프로젝트 디렉터리에서 npm으로 패키지를 설치합니다.
+
+```bash
+npm install @devup-ui/react
+```
+
+### Next.js에서 Devup UI 사용하기
+
+Next.js를 사용한다면 Next.js 플러그인을 설치합니다.
+
+```bash
+npm install @devup-ui/next-plugin
+```
+
+플러그인을 설치한 후 Next.js 프로젝트에 다음과 같이 적용합니다.
+
+```js
+// next.config.js
+
+import { DevupUI } from '@devup-ui/next-plugin'
+
+export default DevupUI({})
+```
+
+### Vite에서 Devup UI 사용하기
+
+Vite를 사용한다면 Vite 플러그인을 설치합니다.
+
+```bash
+npm install @devup-ui/vite-plugin
+```
+
+플러그인을 설치한 후 Vite 프로젝트에 다음과 같이 적용합니다.
+
+```ts
+import { DevupUI } from '@devup-ui/vite-plugin'
+import react from '@vitejs/plugin-react'
+import { defineConfig } from 'vite'
+
+export default defineConfig({
+  plugins: [react(), DevupUI()],
+})
+```
+
+Devup UI로 UI 라이브러리를 개발하는 경우, 라이브러리 모드를 사용할 수 있습니다.
+
+```ts
+import { DevupUI } from '@devup-ui/vite-plugin'
+import react from '@vitejs/plugin-react'
+import { defineConfig } from 'vite'
+
+export default defineConfig({
+  plugins: [
+    react(),
+    DevupUI({
+      // CSS를 추출하지 않습니다
+      extractCss: false,
+    }),
+  ],
+})
+```
+
+### Rsbuild에서 Devup UI 사용하기
+
+Rsbuild를 사용한다면 Rsbuild 플러그인을 설치합니다.
+
+```bash
+npm install @devup-ui/rsbuild-plugin
+```
+
+플러그인을 설치한 후 Rsbuild 프로젝트에 다음과 같이 적용합니다.
+
+```js
+// rsbuild.config.mjs
+
+import { DevupUIRsbuildPlugin } from '@devup-ui/rsbuild-plugin'
+import { defineConfig } from '@rsbuild/core'
+import { pluginReact } from '@rsbuild/plugin-react'
+
+export default defineConfig({
+  plugins: [pluginReact(), DevupUIRsbuildPlugin()],
+})
+```
+
+### Webpack에서 Devup UI 사용하기
+
+Webpack을 직접 사용한다면 Webpack 플러그인을 설치합니다.
+
+```bash
+npm install @devup-ui/webpack-plugin
+```
+
+Webpack 설정에 플러그인을 추가합니다.
+
+```js
+// webpack.config.js
+
+import { DevupUIWebpackPlugin } from '@devup-ui/webpack-plugin'
+
+export default {
+  plugins: [new DevupUIWebpackPlugin()],
+}
+```
+
+### Bun에서 Devup UI 사용하기
+
+Bun을 번들러로 사용한다면 Devup UI와 함께 Bun 플러그인을 설치합니다.
+
+```bash
+bun add @devup-ui/react @devup-ui/bun-plugin
+```
+
+Bun 빌드를 실행하기 전에 플러그인을 import하여 Bun에 등록합니다.
+
+```ts
+// build.ts
+
+import '@devup-ui/bun-plugin'
+
+await Bun.build({
+  entrypoints: ['./src/index.tsx'],
+  outdir: './dist',
+})
+```
+
+## 프로젝트 예제
+
+- [Next.js 예제](https://github.com/dev-five-git/devup-ui/tree/main/apps/next)
+- [Vite 예제](https://github.com/dev-five-git/devup-ui/tree/main/apps/vite)
+- [Vite 기반 라이브러리 예제](https://github.com/dev-five-git/devup-ui/tree/main/apps/vite-lib)
diff --git a/apps/landing/src/app/(detail)/docs/installation/page.mdx b/apps/landing/src/app/(detail)/docs/installation/page.mdx
index 111b17467..9459e1945 100644
--- a/apps/landing/src/app/(detail)/docs/installation/page.mdx
+++ b/apps/landing/src/app/(detail)/docs/installation/page.mdx
@@ -2,6 +2,11 @@ export const metadata = {
     title: "Installation",
     alternates: {
         canonical: '/docs/installation',
+        languages: {
+            en: '/docs/installation',
+            ko: '/ko/docs/installation',
+            'x-default': '/docs/installation',
+        },
     }
 
 }
diff --git a/apps/landing/src/i18n/pages.ts b/apps/landing/src/i18n/pages.ts
index abbed77a2..da78fbc10 100644
--- a/apps/landing/src/i18n/pages.ts
+++ b/apps/landing/src/i18n/pages.ts
@@ -14,4 +14,8 @@ export const translatedPages: Record<string, TranslatedPage | undefined> = {
     load: () => import('@/app/(detail)/docs/overview/page.ko.mdx'),
     Layout: DocsLayout,
   },
+  '/docs/installation': {
+    load: () => import('@/app/(detail)/docs/installation/page.ko.mdx'),
+    Layout: DocsLayout,
+  },
 }