페이지 복사
설치 단계와 이 플러그인의 전체 마크다운 가이드를 포함한 설정 명령어를 복사하세요.
이 가이드는 Capacitor 플러그인을 Capgo 웹사이트에 추가하거나 기존 플러그인 문서를 업데이트하는 방법을 설명합니다. 이 가이드는 기여자, 유지보수자 및 문서 유지보수를 도와주는 AI agent에게 유용합니다.
개요
개요 제목Capgo 생태계에 새로운 플러그인을 추가할 때, 여러 파일과 위치를 업데이트하여 플러그인이 모든 관련된 장소에서 올바르게 표시되도록 해야 합니다:
- 플러그인 목록 구성 - 플러그인 메타데이터를 마스터 목록에 추가
- 플러그인 목록 페이지 - 카테고리별 플러그인 목록 페이지에 플러그인 추가하기
- 사이드바 네비게이션 - 문서 사이드바에 플러그인 추가하기
- 플러그인 문서 - 개요 및 시작 가이드 페이지 생성하기
- 플러그인 튜토리얼 - 포괄적인 튜토리얼 생성하기
파일 위치
파일 위치 섹션중요 파일 업데이트
중요 파일 업데이트 섹션| 파일 | 목적 |
|---|---|
/src/config/plugins.ts | Capgo 마케팅 웹사이트의 페이지/영역: Capgo 마케팅 웹사이트. 역할: 짧은 UI 레이블 또는 네비게이션 아이템. 메시지 키 `subprocessors_table_purpose` (Subprocessors Table Purpose). |
/src/content/docs/docs/plugins/index.mdx | 마스터 플러그인 목록과 메타데이터 |
/astro.config.mjs | 카테고리별 플러그인 인덱스 페이지 |
/src/content/docs/docs/plugins/[plugin-name]/ | 사이드바 네비게이션 설정 |
/src/content/plugins-tutorials/en/ | 플러그인 문서 디렉토리 |
영어 튜토리얼 파일
단계별 가이드-
단계별 가이드 섹션
마스터 목록에 플러그인 추가마스터 목록에 플러그인 추가 섹션
/src/config/plugins.ts그리고 플러그인을 추가하세요.actions배열:// First, import an appropriate Heroiconimport YourIconName from 'astro-heroicons/mini/IconName.astro'// Then add to the actions array{name: '@capgo/your-plugin-name',author: 'github.com/Cap-go',description: 'Brief description of what the plugin does',href: 'https://github.com/Cap-go/your-plugin-name/',title: 'Display Name',icon: YourIconName,}사용 가능한 아이콘: 사용 가능한 아이콘을 확인하세요.
/node_modules/astro-heroicons/mini/인덱스 페이지에 플러그인 추가 -
제목 '인덱스 페이지에 플러그인 추가'입니다.
열기그리고 플러그인을 해당 카테고리 아래에 추가하세요:
/src/content/docs/docs/plugins/index.mdx클립보드 복사<LinkCardtitle="Your Plugin Name"description="Brief description of what the plugin does"href="/docs/plugins/your-plugin-name/"/>배열::
- ⭐ 주요 플러그인
- 📱 기기 및 시스템 플러그인
- 🎥 미디어 및 카메라 플러그인
- 🛠️ 유틸리티 플러그인
- 🤖 AI 및 고급 미디어
- 📍 위치 및 백그라운드 서비스
- 📞 통신 및 분석
- 🔐 보안 및 시스템
- 📊 안드로이드 전용 기능
- 📥 다운로드 및 네비게이션
-
사이드바 네비게이션에 추가
제목 ‘사이드바 네비게이션에 추가’열기
/astro.config.mjs사이드바 구성 (라인 540 주변)에 플러그인을 추가하세요.{label: 'Your Plugin Name',items: [{ label: 'Overview', link: '/docs/plugins/your-plugin-name/' },{ label: 'Getting started', link: '/docs/plugins/your-plugin-name/getting-started' },],collapsed: true,}사이드바에 나열된 플러그인은 알파벳 순입니다.
-
플러그인 문서 디렉토리 만들기
‘플러그인 문서 디렉토리 만들기’ 제목의 섹션플러그인 문서 디렉토리를 새로 만드세요:
터미널 창 mkdir -p /src/content/docs/docs/plugins/your-plugin-name/ -
플러그인 개요 페이지 만들기
‘플러그인 개요 페이지 만들기’ 제목의 섹션새로운 플러그인 개요 페이지를 만드세요:
/src/content/docs/docs/plugins/your-plugin-name/index.mdx:---title: "@capgo/your-plugin-name"description: Brief description of the plugin's purposetableOfContents: falsenext: falseprev: falsesidebar:order: 1label: "Introduction"hero:tagline: Detailed tagline explaining what the plugin doesimage:file: ~public/your-plugin-icon.svgactions:- text: Get startedlink: /docs/plugins/your-plugin-name/getting-started/icon: right-arrowvariant: primary- text: Githublink: https://github.com/Cap-go/your-plugin-name/icon: externalvariant: minimal---import { Card, CardGrid } from '@astrojs/starlight/components';<CardGrid stagger><Card title="Feature 1" icon="puzzle">Description of first key feature</Card><Card title="Feature 2" icon="rocket">Description of second key feature</Card><Card title="Cross-platform" icon="puzzle">Works on both iOS and Android 📱</Card><Card title="Comprehensive Documentation" icon="open-book">Check the [Documentation](/docs/plugins/your-plugin-name/getting-started/) to master the plugin.</Card></CardGrid> -
시작 가이드 작성
시작 가이드 작성 섹션생성
/src/content/docs/docs/plugins/your-plugin-name/getting-started.mdx:---title: Getting Starteddescription: Learn how to install and use the plugin in your Capacitor app.sidebar:order: 2---import { Steps } from '@astrojs/starlight/components';import { PackageManagers } from 'starlight-package-managers'<Steps>1. **Install the package**<PackageManagers pkg="@capgo/your-plugin-name" pkgManagers={['npm', 'pnpm', 'yarn', 'bun']} />2. **Sync with native projects**<PackageManagers type="exec" pkg="cap" args="sync" pkgManagers={['npm', 'pnpm', 'yarn', 'bun']} /></Steps>## Configuration### iOS Configuration[iOS-specific setup instructions]### Android Configuration[Android-specific setup instructions]## Usage[Basic usage examples]## API Reference[Detailed API documentation]## Complete Example[Full working example]## Best Practices[Recommended practices and tips]## Platform Notes[Platform-specific notes and limitations] -
튜토리얼 파일 생성
튜토리얼 파일 생성 섹션생성
/src/content/plugins-tutorials/en/your-plugin-name.md:---locale: en---# Using @capgo/your-plugin-name PackageThe `@capgo/your-plugin-name` package [brief description]. In this tutorial, we will guide you through the installation, configuration, and usage of this package in your Ionic Capacitor app.## Installation[Installation steps]## Configuration[Configuration steps for iOS and Android]## API Usage[Detailed API usage examples]## Complete Example[Full working example]## Best Practices[Tips and best practices]## Troubleshooting[Common issues and solutions]## Conclusion[Summary and links to additional resources]
플러그인 문서 구조
플러그인 문서 구조 섹션필수 파일
필수 파일src/content/docs/docs/plugins/your-plugin-name/├── index.mdx # Overview page with hero and feature cards└── getting-started.mdx # Installation and usage guide
src/content/plugins-tutorials/en/└── your-plugin-name.md # Comprehensive tutorial선택적 파일
선택적 파일복잡한 플러그인은 추가 문서 페이지를 추가할 수 있습니다:
src/content/docs/docs/plugins/your-plugin-name/├── index.mdx├── getting-started.mdx├── api-reference.mdx # Detailed API documentation├── examples.mdx # Additional examples├── troubleshooting.mdx # Troubleshooting guide└── migrations.mdx # Migration guides콘텐츠 지침
콘텐츠 지침플러그인 설명 쓰기
플러그인 설명 쓰기- 간결하게: 100자 이하로 설명을 작성하세요
- Be Specific:
- Use Action Words:
Good Examples:
- “
- Integrate
- “Control
“Enable :
- Bad Examples
- :
- “A 플러그인 ”
문서 작성을 위한 기여
문서 작성을 위한 섹션- 설치 시작: 명확한 설치 단계부터 시작하세요
- 구성 제공: 플랫폼에 따라 요구되는 설정 요구 사항을 포함하세요
- 사용 예제 제공: 실제 code 예제를 제공하세요
- API 참조 포함: 모든 메소드와 매개 변수를 문서화하세요
- 완전한 예제 추가: 실제-world 사용 패턴을 보여주세요
- List Best Practices: Share tips for optimal usage
- Document Platform Differences: iOS와 Android의 차이점을 설명합니다.
- Add Troubleshooting: 일반적인 문제를 해결하는 방법을 설명합니다.
Code Examples
Code 예시- code Examples
- __CAPGO_KEEP_0__ 예시 제목
- 모든 __CAPGO_KEEP_0__ 예시에서 TypeScript을 사용하세요.
- __CAPGO_KEEP_0__ 예시에서 import문을 상단에 추가하세요. 또한 중요한 단계에 대한 주석을 추가하세요. 오류 처리를 보여주세요.
- 기본 및 고급 사용법을 모두 보여주세요
체크리스트
체크리스트 섹션새 플러그인을 추가할 때 이 체크리스트를 사용하세요
- 플러그인을 추가했습니다
/src/config/plugins.ts - Heroicons에서 적절한 아이콘을 선택했습니다
- 플러그인을 추가했습니다
/src/content/docs/docs/plugins/index.mdx정확한 카테고리 아래 - 사이드바 항목을 추가했습니다
/astro.config.mjs - 플러그인 문서 디렉토리를 생성했습니다
- 생성했습니다
index.mdx소개 페이지 - 만들어졌습니다.
getting-started.mdx안내서 - 만들어진 튜토리얼
/src/content/plugins-tutorials/en/ - 설치 방법을 포함했습니다.
- iOS 설정을 문서화했습니다.
- Android 설정을 문서화했습니다.
- 사용 예시를 제공했습니다.
- API 참조를 추가했습니다.
- 완전한 작동 예시를 포함했습니다.
- 최선의 방법을 나열했습니다.
- 플랫폼에 따라 특정한 주의사항을 추가했습니다.
- 모든 링크가 올바르게 작동하는지 테스트했습니다.
아이콘 참조
아이콘 참조 섹션플러그인에 사용되는 일반 아이콘 ( astro-heroicons/mini/):
| 아이콘 | 사용 사례 |
|---|---|
BoltIcon | 전기, 에너지 |
CameraIcon | 카메라, 사진, 비디오 |
ChatBubbleLeftIcon | 채팅, 메시징, 통신 |
FingerPrintIcon | 생체 인식, 보안, 인증 |
MapPinIcon | 위치, 지리 정보, 지도 |
SpeakerWaveIcon | 음성, 소리, 음악 |
VideoCameraIcon | 비디오, 녹음, 스트리밍 |
CreditCardIcon | 결제, 구매 |
PlayCircleIcon | 미디어 플레이어, 비디오 플레이어 |
SignalIcon | 연결성, 네트워크, 비콘 |
RadioIcon | 비콘, 방송, 무선 |
ChatBubbleOvalLeftIcon | 소셜 미디어, 웨챗 |
기존 플러그인 업데이트
기존 플러그인 업데이트기존 플러그인을 업데이트할 때:
- 버전 번호 업데이트하기 문서에 반영하기
- 이동 가이드 추가하기 파괴적인 변경 사항이 존재할 경우
- API 업데이트 새로운 메서드와 함께 업데이트합니다
- 새로운 기능에 대한 예제를 추가합니다 새로운 기능에 대한 예제를 추가합니다
- 플랫폼 요구 사항을 업데이트 변경된 경우
- 최선의 방법을 다시 검토합니다 새로운 기능에 따라
- 튜토리얼을 최신 __CAPGO_KEEP_0__과 동기화합니다 with latest API
제목 ‘언어 경로’
Section titled “Language Paths”영어로 플러그인 문서를 작성하고 검토하세요. 지역화된 경로는 사이트 메타데이터에 의해 생성되고 에지에서 번역 워커로 번역됩니다.
변경을 테스트하세요
변경을 테스트하는 방법플러그인 문서를 추가하거나 업데이트 한 후:
-
사이트를 로컬에서 빌드하세요:
터미널 창 bun run build -
오류를 확인하세요:
- 모든 링크가 작동하는지 확인하세요
- 이미지가 올바르게 로드되는지 확인하세요
- code 예제가 유효한지 확인하세요
- 네비게이션이 작동하는지 확인하세요
-
사이트 미리보기:
터미널 창 bun run dev -
플러그인이 나타나는지 확인:
- 플러그인 목록 페이지 확인
- 사이드바 네비게이션 확인
- 모든 문서 페이지 테스트
- 튜토리얼 페이지가 작동하는지 확인
일반적인 실수
일반적인 실수 섹션플러그인 문서 추가 또는 업데이트에 도움이 필요하시면:
- : 우리의디스코드 커뮤니티에 가입하세요 __CAPGO_KEEP_0__
- : GitHub에 이슈를 열어주세요Getting Help 웹사이트 저장소
- 이메일: Capgo 마케팅 웹사이트. UI 레이블. 페이지 등록.astro. 메시지 키 `email_label` (이메일 레이블). | 라이브 업데이트 제품 페이지. UI 레이블. 메시지 키 `live_update_guidance_email_label` (라이브 업데이트 안내 이메일 레이블). support@capgo.app
support@__CAPGO_KEEP_0__.app
예시예시 섹션
- 참고로, 다음 잘 문서화된 플러그인을 확인하세요::
/src/content/docs/docs/plugins/updater/업데이터 - (복잡한 플러그인, 여러 페이지):
/src/content/docs/docs/plugins/flash/플래시 - (단순한 플러그인, 좋은 시작 예시):
/src/content/docs/docs/plugins/social-login/(플러그인과 하위 페이지)
Capgo 문서에 플러그인을 추가하는 것은 다음과 같습니다:
- 마스터 구성에 메타데이터를 추가하는 것
- 분류된 인덱스 페이지에 플러그인을 추가하는 것
- 사이드바 네비게이션을 구성하는 것
- 전반적인 문서 페이지를 만드는 것
- 상세한 튜토리얼을 작성하는 것
- 모든 변경 사항을 로컬에서 테스트하는 것
이 안내서를 따라하면 플러그인이 일관되게 문서화되고 사용자가 쉽게 찾을 수 있도록 합니다.
플러그인 추가 또는 업데이트 계속하기
“Adding or Updating Plugins”를 계속하는 방법” 섹션 제목만약 당신이 사용 중이라면 Adding or Updating Plugins __CAPGO_KEEP_0__ Plugin Directory와 연결하여 Capgo Plugin Directory의 제품 워크플로우 Capgo Plugins by __CAPGO_KEEP_1__ Capacitor Plugins by Capgo의 구현 세부 사항 for the implementation detail in Capacitor Plugins by Capgo, Ionic Enterprise Plugin Alternatives의 제품 워크플로우 __CAPGO_KEEP_0__ Native Builds Capgo Native Builds의 제품 워크플로우 Capgo Native Builds Capacitor 플러그인: 알아야 할 사항 실용적인 Capacitor 플러그인: 알아야 할 사항의 맥락에서.