본문으로 건너뛰기

Capacitor 플러그인 기여 가이드

Capacitor 플러그인 기여 가이드

마틴 도나디우

마틴 도나디우

콘텐츠 마케터

Capacitor

Capacitor 플러그인은 웹 기술과 네이티브 디바이스 기능을 연결하여 __CAPGO_KEEP_0__ 플러그인은 웹 기술과 네이티브 디바이스 기능을 연결하여 다양한 플랫폼을 위한 앱 개발이 안내서가 도와주는 것은:

  • 환경 설정: 사용하는 도구는 Node.js, Xcode, 그리고 Android Studio 필수입니다.
  • Code 표준을 따르세요: TypeScript, Swift, 그리고 Kotlin 명확한 이름 규칙과 오류 처리를 사용하여
  • 깊이 테스트하십시오: 자바스크립트, iOS, Android에 대한 단위 테스트를 작성하여 신뢰성을 보장하십시오.
  • 명확하게 문서화하십시오: JSDoc 및 README 파일을 사용하여 쉽게 수용할 수 있도록 하십시오.
  • Pull Request 제출하십시오: 높은 품질의 code, 테스트, 및 문서화를 보장하기 전에 기여하십시오.

오픈 소스 완전 가이드 - 기여 방법

개발 환경 설정

효율적인 플러그인 개발을 위해 개발 환경을 올바르게 설정하는 것이 중요합니다. 잘 준비된 설정은 플러그인 개발, 테스트, 배포를 위한 smooth한 코딩을 가능하게 합니다.

필요한 도구와 기술

개발을 시작하기 전에 다음 도구가 설치되어 있는지 확인하세요.

분류 요구 사항
기본 도구 Node.js (LTS), npm 6+, Git
IDE/편집기 Visual Studio Code 또는 선호하는 편집기
iOS 개발 Xcode, SwiftLint, CocoaPods
안드로이드 개발 안드로이드 스튜디오, 안드로이드 SDK, JDK

웹 개발을 위한 TypeScript에 익숙해야 하며 iOS를 위한 Swift 또는 Android를 위한 Java/Kotlin에 익숙해야 하는 네이티브 개발 작업을 위해 [1][2].

모노레포 설정

The Capacitor 플러그인 모노레포 구조가 생태계의 근간입니다. 이 접근 방식은 작업이 커뮤니티 표준과 일치하는지부터 시작하기 때문에 작업이 커뮤니티 표준과 일치하는지부터 시작합니다.

  1. 리포지토리 fork 및 클론
    먼저 Capacitor 플러그인 리포지토리를 GitHub에서 fork합니다. 그런 다음 fork한 리포지토리를 클론하세요:

    git clone https://github.com/your-username/capacitor-plugins.git
    cd capacitor-plugins
    npm install
  2. 설치 의존성 및 빌드
    다음 명령어를 실행하여 모든 필요한 항목을 설치하고 플러그인을 빌드하세요:

    npm run build
  3. 버전 관리 설정
    변경 사항을 feature branch로 관리하고 upstream 저장소와 fork를 동기화하세요.

자연 플랫폼 준비

크로스 플랫폼 개발을 위해 iOS 및 Android 환경을 구성해야 합니다.

iOS:

  • Mac App Store에서 Xcode를 다운로드하세요.

  • 명령줄 도구를 설치하기 위해:

    xcode-select --install
  • CocoaPods를 다음 명령어로 설치하세요:

    sudo gem install cocoapods
  • Apple Developer 계정과 필요한 인증서를 설정하세요.

  • SwiftLint (선택 사항)을 사용하여 code 품질을 유지하세요.

안드로이드:

  • SDK와 최신 버전을 설치한 후 안드로이드 기기 에뮬레이터를 설치하세요.
  • JDK가 설치되어야 합니다.
  • SDK를 안드로이드 스튜디오에서 올바르게 설정하세요.

이러한 플랫폼을 설정한 후,established coding practices를 따르며 플러그인 개발에 뛰어들 수 있습니다.

Code 표준 가이드

개발 환경이 설정되면, 유지보수 및 사용이 쉬운 플러그인을 만들기 위해 이 가이드라인을 따르세요.

스타일 가이드 준수

The Capacitor 플러그인 생태계 ESLint와 같은 도구를 사용하여 엄격한 코딩 표준을 적용합니다. ESLint, Prettier, 그리고 SwiftLint. 이 글에서는 Capgo 플러그인에 대한 기여 가이드를 간단하게 설명합니다.

Component Format
변수 deviceInfo (camelCase)
클래스 BatteryManager (PascalCase)
메서드 getLanguageCode() (camelCase)
상수 MAX_RETRY_COUNT (SNAKE_CASE)

플러그인은 TypeScript를 사용하여 더 나은 타입 안전성과 ES6+ 기능을 사용하는 것이 좋습니다. async/await또한 Swift (iOS)와 Kotlin (Android)과 같은 플랫폼에 맞는 코딩 규칙을 따르세요.

오류 및 타입 관리

다양한 플랫폼 간에 호환성을 유지하기 위해 일관된 오류 처리가 중요합니다. 예를 들어:

async checkPermissions(): Promise<PermissionStatus> {
  try {
    const result = await this.implementation.checkPermissions();
    return result;
  } catch (error) {
    throw new Error(`Permission check failed: ${error.message}`);
  }
}

타입 안전성을 위해:

  • 특정 사용 사례에 맞춰 고유한 인터페이스를 사용하세요.
  • 플랫폼에 맞는 변형을 위한 union 타입을 적용하세요.

Code 문서

좋은 문서는 플러그인을 사용하기 쉽고 접근하기 쉬운 것을 만듭니다. 이 관행을 따르세요:

  1. API 문서: JSDoc 주석을 작성하여 @capacitor/docgen를 사용하세요. 예를 들어:
/**
 * @description Get the device's current battery level
 * @returns Promise with the battery level percentage
 */
async getBatteryLevel(): Promise<{ level: number }>;
  1. README 구조: 설치 방법, 설정 지침, 플랫폼별 요구 사항, 사용 예제 및 자세한 API 참조를 포함하는 필수 정보를 포함해야 합니다.

잘 작성된 문서는 플러그인을 쉽게 채택하고 더 광범위한 Capacitor 커뮤니티에 기여합니다.

sbb-itb-f9944d2

플러그인 테스트 안내서

테스트 Capacitor 플러그인은 smooth한 기능성과 신뢰성을 보장하기 위해 몇 가지 중요한 영역에 집중하는 것을 포함합니다.

네이티브 브리지 테스트

네이티브 브리지 테스트는 자바스크립트와 네이티브 code 간의 올바른 통신을 보장합니다. 시작하기 위해 각 플랫폼에 맞는 프레임워크를 사용하여 테스트 환경을 설정해야 합니다.

여기에는 JavaScript 측의 단위 테스트 예제가 있습니다: Jest 네이티브 측 테스트에 사용하는 테스트 프레임워크는 XCTest를 iOS에, JUnit을 Android에 사용합니다. Android의 예제는 아래와 같습니다:

// Example of a Jest unit test for the JavaScript bridge
describe('DeviceInfo Plugin', () => {
  test('getBatteryLevel returns valid percentage', async () => {
    const result = await DeviceInfo.getBatteryLevel();
    expect(result.level).toBeGreaterThanOrEqual(0);
    expect(result.level).toBeLessThanOrEqual(100);
  });
});

For testing on the native side, use XCTest for iOS and JUnit for Android.

@Test
fun testBatteryLevel() {
    val plugin = DeviceInfo()
    val result = plugin.getBatteryLevel()
    assertTrue(result.level in 0..100)
}

이제 코어 브리지 기능이 예상대로 작동하는 것을 확인한 후, 완전한 사용자 워크플로우를 테스트하세요.

플러그인 테스트 완료

다양한 시나리오에서 플러그인이 잘 작동하도록 하려면, 다음 카테고리별로 테스트하세요:

테스트 카테고리 중요한 주목점
통합 테스트 다양한 플랫폼에서 작동하는지 확인
성능 테스트 리소스 사용량과 응답 시간
보안 테스트 데이터 처리 및 권한 검사

복잡한 기능을 가진 플러그인에 대해서는 실제 사용자 시나리오를 시뮬레이션하세요. 예를 들어, 디바이스 정보 플러그인을 테스트하는 경우에는:

  • 다양한 네트워크 조건 하에서 성공적인 업로드
  • 정확한 진행 상황 보고
  • 대용량 파일 전송 중 메모리 사용량

OTA 테스트와 Capgo

Capgo Live Update Dashboard Interface

Capgo의 오픈 소스 도구는 업데이트를 빠르게 배포하고 테스트하는 것을 쉽게 만듭니다. 그 방법은 다음과 같습니다.

  1. 설정 업데이트 채널 개발, 스테이징, 및 운영 채널과 같은 것들
  2. CI/CD 도구를 사용하여 배포를 자동화하세요.
  3. 업데이트를 즉시 푸시하세요.
  4. 성능 및 문제를 __CAPGO_KEEP_0__ 대시보드를 통해 모니터링합니다. Capgo.

구간 배포를 위해 Capgo은 업데이트 한도를 작은 사용자 그룹으로 제한할 수 있습니다. 예를 들어, 매일 24시간마다 25%의 사용자에게 새로운 버전을 배포할 수 있습니다.

// Example configuration for staged rollout
{
  "plugin": "camera-plugin",
  "version": "1.2.0",
  "rollout": {
    "percentage": 25,
    "interval": "24h"
  }
}

이 구간 배포 방법은 문제를 일찍 발견하기 위해 커뮤니티 피드백을 활용하여 전체 릴리즈 전에 문제를 해결할 수 있습니다.

Pull Request Process

변경 사항을 철저히 테스트한 후 다음 단계를 따라서 Pull Request를 제출하세요.

PR Submission Checklist

제출하기 전에 다음 주요 영역을 확인하세요.

분류 체크해야 할 사항
Code 품질 - Swift/Kotlin 구현이 웹 API과 일치하는지 확인합니다.
테스트 - 새로운 기능에 대한 단위 테스트를 추가하십시오.
- CI/CD pipeline 확인이 성공적으로 완료되었는지 확인하십시오.
문서 - README, 인라인 문서 및 CHANGELOG를 필요에 따라 업데이트하십시오.

커뮤니티 가이드라인

협업 시 다음의 절차를 따르십시오:

  • 리뷰어의 피드백에 신속하게 반응하십시오.
  • 기술적인 세부 사항에만 집중하십시오.
  • GitHub의 제안 기능을 사용하여 code의 변경을 제안하십시오.
  • 작은, 집중된 풀 리퀘스트를 제출하여 하나의 기능 또는 문제를 해결하십시오.

큰 변경의 경우, 이슈를 먼저 생성하고 접근 방식을 논의하는 것이 좋습니다. Capacitor 팀은 GitHub Actions를 사용하여 자동화된 확인을 수행하며, 모든 확인이 통과해야만 리뷰가 진행될 수 있습니다.

Capgo 통합 가이드

실시간 업데이트 기능이 있는 플러그인이라면 Capgo과 완벽하게 호환되도록 하기 전에 제출하기 전에:

  1. 버전 관리
    Use clear semantic versioning for your plugin, and document all changes in the changelog. Capgo’s system helps track version adoption across user devices.

  2. 플러그인에 대한 명확한 의미 있는 버전 관리를 사용하고, 모든 변경 사항을 변경 로그에 문서화하십시오. __CAPGO_KEEP_0__의 시스템은 사용자 기기에서 버전 채택을 추적하는 데 도움이 됩니다.
    Integrate Capgo into your CI/CD pipeline to automate update deployments.

  3. 컨텍스트: Capgo 빌더 / 네이티브 클라우드 빌드 제품 페이지. 역할: 짧은 UI 레이블 또는 네비게이션 아이템. 메시지 키 `native_build_feature_ci_cd` (네이티브 빌드 기능 CI/CD).
    __CAPGO_KEEP_0__을 CI/CD PIPELINE에 통합하여 업데이트 배포를 자동화하십시오.

업데이트 모니터링

To make a meaningful contribution with your plugin, it’s important to follow the established process and meet community standards. This includes sticking to Capacitor’s coding guidelines and thoroughly testing your work.

The PR checklist highlights the need for high-quality submissions. If your plugin supports live updates, integrating with Capgo (as mentioned earlier) can help you release updates quickly without waiting for app store approvals.

플러그인으로 의미 있는 기여를 하려면 established 프로세스를 따르고 커뮤니티 표준을 충족하는 것이 중요합니다. 이는 __CAPGO_KEEP_0__의 코딩 가이드라인을 따르고, 철저히 테스트하는 것을 포함합니다. PR 체크리스트는 고품질의 제출이 필요하다는 것을 강조합니다. 실시간 업데이트 기능이 있는 플러그인이라면 __CAPGO_KEEP_0__ (이전 섹션에서 언급한 것과 같이)와 통합하면 앱 스토어 승인 기다리지 않고 업데이트를 빠르게 출시할 수 있습니다. Capacitor 업데이트와 함께 유지하면 플러그인이 유용하고 관련성이 유지될 수 있습니다.

사용자 피드백에 주의하고 필요할 때 업데이트를 하세요. 이 지속적인 노력은 생태계의 전체 품질을 유지하고 개발자에게 플러그인이 가치 있는지 유지하는 데 도움이 됩니다.

Capacitor 플러그인 기여 가이드에서 계속 진행하세요.

만약 __CAPGO_KEEP_0__ 플러그인 기여 가이드를 사용하여 Capacitor Plugin Contribution Guide __CAPGO_KEEP_0__ 플러그인 디렉토리와 연결하세요. Capgo 플러그인 디렉토리에서 Capgo 플러그인 디렉토리 workflow Capgo 플러그인으로 __CAPGO_KEEP_1__ Capacitor 플러그인으로 Capgo 구현 세부 사항 for the implementation detail in Capacitor Plugins by Capgo, __CAPGO_KEEP_0__ : Capacitor, __CAPGO_KEEP_1__ : Cloudflare Adding or Updating Plugins 구현 세부 사항에 대한 정보를 위해 Ionic Enterprise Plugin Alternatives Ionic Enterprise Plugin Alternatives의 제품 워크플로에 대한 정보를 위해 Capgo Native Builds의 제품 워크플로에 대한 정보를 위해 for the product workflow in Capgo Native Builds.

Live updates for Capacitor apps

When a web-layer bug is live, ship the fix through Capgo instead of waiting days for app store approval. 사용자들은 배경에서 업데이트를 받으며 네이티브 변경은 일반적인 검토 경로를 따라갑니다.

인간 지원으로부터 마틴

시작하기

최신 뉴스

Capgo은 전문적인 모바일 앱을 만들기 위해 필요한 최고의洞察력을 제공합니다.