From ce5e5232496c547ec7b34be79905143912279de6 Mon Sep 17 00:00:00 2001 From: Junseong Park <39112954+jsparkdev@users.noreply.github.com> Date: Wed, 16 Apr 2025 16:26:40 +0900 Subject: [PATCH 1/6] blog --- .../studiocms-plugins/studiocms-blog.mdx | 47 +++++++++++++++++++ 1 file changed, 47 insertions(+) create mode 100644 src/content/docs/ko/package-catalog/studiocms-plugins/studiocms-blog.mdx diff --git a/src/content/docs/ko/package-catalog/studiocms-plugins/studiocms-blog.mdx b/src/content/docs/ko/package-catalog/studiocms-plugins/studiocms-blog.mdx new file mode 100644 index 00000000..8ea16f2e --- /dev/null +++ b/src/content/docs/ko/package-catalog/studiocms-plugins/studiocms-blog.mdx @@ -0,0 +1,47 @@ +--- +i18nReady: true +title: "@studiocms/blog" +type: integration +catalogEntry: studiocms-blog +description: "StudioCMS 블로그 통합" +sidebar: + badge: + text: '플러그인' + variant: 'tip' +--- + +import { PackageManagers } from 'starlight-package-managers' +import { Steps, Tabs, TabItem } from '@astrojs/starlight/components'; + +# 소개 + +이 플러그인을 사용하면 Astro 프로젝트에서 StudioCMS 블로그 기능과 프런트엔드를 사용할 수 있습니다. StudioCMS 대시보드에서 블로그 게시물을 생성, 편집 및 삭제할 수 있습니다. + +## 설치 + +1. 다음 명령어를 사용하여 패키지를 설치합니다. + + + +2. Astro 구성 파일에 `@studiocms/blog`를 추가합니다. + + ```ts twoslash title="studiocms.config.mjs" ins={2, 6} + import { defineStudioCMSConfig } from 'studiocms/config'; + import blog from '@studiocms/blog'; + + export default defineStudioCMSConfig({ + plugins: [ + blog(), + ], + }); + ``` +## 사용법 + +### 이 플러그인은 어떤 기능을 하나요? + +이 통합은 StudioCMS로 제어되는 프런트엔드에 다음과 같은 새로운 라우트를 추가합니다. + +- `/[...slug]` - 모든 StudioCMS 페이지를 나열하는 메인 블로그 페이지입니다. +- `/blog` - 모든 블로그 게시물을 나열하는 메인 블로그 페이지입니다. +- `/blog/[slug]` - 개별 블로그 게시물 페이지입니다. +- `/rss.xml` - 블로그 게시물에 대한 RSS 피드입니다. From a8186bc0f045656eca8b1c06d837284dd8f34141 Mon Sep 17 00:00:00 2001 From: Junseong Park <39112954+jsparkdev@users.noreply.github.com> Date: Wed, 16 Apr 2025 16:43:33 +0900 Subject: [PATCH 2/6] devapps --- .../studiocms-plugins/studiocms-devapps.mdx | 131 ++++++++++++++++++ 1 file changed, 131 insertions(+) create mode 100644 src/content/docs/ko/package-catalog/studiocms-plugins/studiocms-devapps.mdx diff --git a/src/content/docs/ko/package-catalog/studiocms-plugins/studiocms-devapps.mdx b/src/content/docs/ko/package-catalog/studiocms-plugins/studiocms-devapps.mdx new file mode 100644 index 00000000..5fd1642c --- /dev/null +++ b/src/content/docs/ko/package-catalog/studiocms-plugins/studiocms-devapps.mdx @@ -0,0 +1,131 @@ +--- +i18nReady: true +title: "@studiocms/devapps" +type: integration +catalogEntry: studiocms-devapps +description: "Astro의 개발 모드에서 사용할 수 있는 유용한 도구 모음" +sidebar: + badge: + text: '누구나 사용 가능' + variant: 'caution' +--- + +import { PackageManagers } from 'starlight-package-managers' +import { Steps, Tabs, TabItem } from '@astrojs/starlight/components'; + +# 소개 + +Astro의 개발 모드에서 사용할 수 있는 유용한 도구 모음입니다. + +## 설치 + + + +{/* */} +1. 다음 명령을 사용하여 패키지를 설치하고 Astro 구성에 추가합니다. + + + +2. 아래의 [예시 구성](#예시-구성)에 나와있는대로 구성 파일을 업데이트합니다. +{/* */} + + +{/* */} +1. 다음 명령을 사용하여 패키지를 설치합니다. + + + +2. Astro 구성 파일에 `@studiocms/devapps`를 추가합니다. + + ```ts twoslash title="astro.config.mjs" ins={3, 9} + import { defineConfig } from 'astro/config'; + import db from '@astrojs/db'; + import devApps from '@studiocms/devapps'; + + export default defineConfig({ + site: "https://example.com", + integrations: [ + db(), + devApps(), + ], + }); + ``` +{/* */} + + + +## 사용법 + +모든 도구는 `astro dev` 실행 중에만 사용할 수 있으며, 프로덕션 배포 중에는 사용할 수 없습니다! + +### 예시 구성 + +```ts twoslash title="astro.config.mjs" {2, 8} ins={3, 9} +import { defineConfig } from 'astro/config'; +import db from '@astrojs/db'; +import devApps from '@studiocms/devapps'; + +export default defineConfig({ + site: "https://example.com", + integrations: [ + db(), // 필수 + devApps(/* 아래 구성 옵션을 참조하세요. */), + ], +}); +``` + +### 구성 옵션 + +`devApps` 통합에 사용할 수 있는 모든 옵션의 전체 목록입니다. 기본값이 표시되어 있으며, **모든 옵션은 선택 사항입니다**. + +```ts twoslash +import devApps from '@studiocms/devapps'; +devApps({ +// ---cut--- +endpoint: '_studiocms-devapps', +verbose: false, +appsConfig: { + libSQLViewer: true, + wpImporter: true, +}, +// ---cut-after--- +}) +``` + +## 도구 + +### libSQL Viewer + +브라우저에서 libSQL 데이터베이스의 SQL 테이블을 볼 수 있는 개발 도구입니다. 이 도구는 `@astrojs/db` libSQL 원격 데이터베이스 연결 자격 증명을 사용합니다. + +#### 요구 사항 + +설정된 다음 환경 변수 ( `@astrojs/db`에도 사용됨) +- **`ASTRO_DB_REMOTE_URL`** +- **`ASTRO_DB_APP_TOKEN`** + +#### 사용법 미리 보기 + +- 도구 모음 앱 (닫힌 상태) + +![Astro DevToolbarApp](~/assets/devapps/devapps-1-toolbar-app-closed.png) + +- 도구 모음 앱 (열린 상태) + +![Astro DevToolbarApp (Expanded)](~/assets/devapps/devapps-1-toolbar-app-expanded.png) + +### Wordpress Importer + +WordPress 게시물과 페이지를 StudioCMS 데이터베이스로 가져오는 개발 도구입니다. + +#### 요구 사항 + +- StudioCMS 통합 +- WordPress 설치 +- `@studiocms/blog` (선택 사항: 블로그 하위 항목으로 게시물을 가져오는 경우) + +#### 사용법 미리보기 + +- 도구 모음 앱 + +![Astro DevToolbarApp](~/assets/devapps/devapps-2-importer.png) From 0a0e3f6ca6e26af703412f771e33fe89bf98ea65 Mon Sep 17 00:00:00 2001 From: Junseong Park <39112954+jsparkdev@users.noreply.github.com> Date: Wed, 16 Apr 2025 16:46:32 +0900 Subject: [PATCH 3/6] markdoc --- .../studiocms-plugins/studiocms-markdoc.mdx | 37 +++++++++++++++++++ 1 file changed, 37 insertions(+) create mode 100644 src/content/docs/ko/package-catalog/studiocms-plugins/studiocms-markdoc.mdx diff --git a/src/content/docs/ko/package-catalog/studiocms-plugins/studiocms-markdoc.mdx b/src/content/docs/ko/package-catalog/studiocms-plugins/studiocms-markdoc.mdx new file mode 100644 index 00000000..f8e39c7b --- /dev/null +++ b/src/content/docs/ko/package-catalog/studiocms-plugins/studiocms-markdoc.mdx @@ -0,0 +1,37 @@ +--- +i18nReady: true +title: "@studiocms/markdoc" +type: integration +catalogEntry: studiocms-markdoc +description: "StudioCMS MarkDoc 통합" +sidebar: + badge: + text: '플러그인' + variant: 'tip' +--- + +import { PackageManagers } from 'starlight-package-managers' +import { Steps, Tabs, TabItem } from '@astrojs/starlight/components'; + +# 소개 + +이 플러그인을 사용하면 StudioCMS에서 MarkDoc을 지원할 수 있습니다. + +## 설치 + +1. 다음 명령을 사용하여 패키지를 설치합니다. + + + +2. Astro 구성 파일에 `@studiocms/markdoc`을 추가합니다. + + ```ts twoslash title="studiocms.config.mjs" ins={2, 6} + import { defineStudioCMSConfig } from 'studiocms/config'; + import markdoc from '@studiocms/markdoc'; + + export default defineStudioCMSConfig({ + plugins: [ + markdoc(), + ], + }); + ``` From 77e6bdafc47000d5de964b6391d40131b8253384 Mon Sep 17 00:00:00 2001 From: Junseong Park <39112954+jsparkdev@users.noreply.github.com> Date: Wed, 16 Apr 2025 16:48:26 +0900 Subject: [PATCH 4/6] mdx --- .../studiocms-plugins/studiocms-mdx.mdx | 37 +++++++++++++++++++ 1 file changed, 37 insertions(+) create mode 100644 src/content/docs/ko/package-catalog/studiocms-plugins/studiocms-mdx.mdx diff --git a/src/content/docs/ko/package-catalog/studiocms-plugins/studiocms-mdx.mdx b/src/content/docs/ko/package-catalog/studiocms-plugins/studiocms-mdx.mdx new file mode 100644 index 00000000..d72e7bce --- /dev/null +++ b/src/content/docs/ko/package-catalog/studiocms-plugins/studiocms-mdx.mdx @@ -0,0 +1,37 @@ +--- +i18nReady: true +title: "@studiocms/mdx" +type: integration +catalogEntry: studiocms-mdx +description: "StudioCMS MDX 통합" +sidebar: + badge: + text: '플러그인' + variant: 'tip' +--- + +import { PackageManagers } from 'starlight-package-managers' +import { Steps, Tabs, TabItem } from '@astrojs/starlight/components'; + +# 소개 + +이 플러그인을 사용하면 StudioCMS에서 MDX를 지원할 수 있습니다. + +## 설치 + +1. 다음 명령을 사용하여 패키지를 설치합니다. + + + +2. Astro 구성 파일에 `@studiocms/mdx`를 추가합니다. + + ```ts twoslash title="studiocms.config.mjs" ins={2, 6} + import { defineStudioCMSConfig } from 'studiocms/config'; + import mdx from '@studiocms/mdx'; + + export default defineStudioCMSConfig({ + plugins: [ + mdx(), + ], + }); + ``` From 3e860b80bf20c845c3b404ff4cff02b30a70c507 Mon Sep 17 00:00:00 2001 From: Junseong Park <39112954+jsparkdev@users.noreply.github.com> Date: Wed, 16 Apr 2025 16:55:53 +0900 Subject: [PATCH 5/6] web-vitals --- .../community-plugins/web-vitals.mdx | 78 +++++++++++++++++++ 1 file changed, 78 insertions(+) create mode 100644 src/content/docs/ko/package-catalog/community-plugins/web-vitals.mdx diff --git a/src/content/docs/ko/package-catalog/community-plugins/web-vitals.mdx b/src/content/docs/ko/package-catalog/community-plugins/web-vitals.mdx new file mode 100644 index 00000000..8cb8a4d8 --- /dev/null +++ b/src/content/docs/ko/package-catalog/community-plugins/web-vitals.mdx @@ -0,0 +1,78 @@ +--- +i18nReady: true +title: "@astrojs/web-vitals" +type: integration +catalogEntry: astrojs-web-vitals +description: "웹 바이탈 통합과 StudioCMS 대시보드" +sidebar: + badge: + text: '플러그인' + variant: 'tip' +--- + +import { PackageManagers } from 'starlight-package-managers' +import Gallery from '~/components/Gallery.astro'; +import { webVitalsImages } from "~/assets/index.ts"; +import { Steps, Tabs, TabItem } from '@astrojs/starlight/components'; + +# 소개 + +이 Astro 통합을 사용하면 실제 웹사이트의 성능을 추적하고 데이터를 Astro DB에 저장할 수 있습니다. 이 데이터는 StudioCMS 대시보드에서 실제 웹사이트의 시간에 따른 성능 지표를 보여주는 데 사용됩니다. + +## 설치 + + +{/* */} + +1. 다음 명령을 사용하여 패키지를 설치하고 Astro 구성에 추가합니다. + + + +2. 새 구성을 원격 데이터베이스에 푸시합니다. + + + +{/* */} + + +{/* */} + +1. 다음 명령을 사용하여 패키지를 설치합니다. + + + +2. Astro 구성 파일에 `@astrojs/web-vitals`를 추가합니다. + + ```ts twoslash title="astro.config.mjs" {12} ins={4, 13} + import node from '@astrojs/node'; + import studioCMS from 'studiocms'; + import db from '@astrojs/db'; + import webVitals from '@astrojs/web-vitals'; + import { defineConfig } from 'astro/config'; + + export default defineConfig({ + site: 'https://demo.studiocms.dev/', + output: 'server', + adapter: node({ mode: "standalone" }), + integrations: [ + db(), // 필수 + webVitals(), + studioCMS(), + ], + }); + ``` + + + +3. 새 구성을 원격 데이터베이스에 푸시합니다. + + + +{/* */} + + + + +{/* ## Gallery Demo + + */} From db42bfcc579f4122761469bdfbd3ea0072a5deac Mon Sep 17 00:00:00 2001 From: Junseong Park <39112954+jsparkdev@users.noreply.github.com> Date: Wed, 16 Apr 2025 17:01:09 +0900 Subject: [PATCH 6/6] index --- src/content/docs/ko/package-catalog/index.mdx | 26 +++++++++++++++++++ 1 file changed, 26 insertions(+) create mode 100644 src/content/docs/ko/package-catalog/index.mdx diff --git a/src/content/docs/ko/package-catalog/index.mdx b/src/content/docs/ko/package-catalog/index.mdx new file mode 100644 index 00000000..d69a7fb1 --- /dev/null +++ b/src/content/docs/ko/package-catalog/index.mdx @@ -0,0 +1,26 @@ +--- +i18nReady: true +title: 패키지 +description: 패키지 카탈로그는 StudioCMS 또는 그 커뮤니티에서 만든 패키지 모음입니다. +--- + +import PackageCatalog from '~/components/PackageCatalog.astro' +import { Badge } from '@astrojs/starlight/components'; + +패키지 카탈로그는 StudioCMS 또는 커뮤니티 구성원이 만든 패키지 모음으로, StudioCMS에 기본적으로 포함되어 있지 않습니다. 여기에 나열된 모든 패키지는 StudioCMS 팀 또는 기여자가 검증하고 테스트했습니다. + + 라벨이 있는 모든 패키지는 StudioCMS 또는 해당 대시보드의 기능을 확장하는 패키지입니다. + + 라벨이 있는 모든 패키지는 StudioCMS에 의존하지 않는 프로젝트에서도 설치하고 사용할 수 있습니다. 즉, 자체적으로 작동합니다. + +## 패키지 카탈로그 + +### StudioCMS 패키지 +--- + + + +### 커뮤니티 패키지 +--- + +