Capacitor 로컬 환경 설정

웹 기술을 사용하여 iOS 및 Android 앱을 구축하고 싶으신가요? 로컬 Capacitor 환경을 빠르고 효율적으로 설정하는 방법을 알아보겠습니다.

주요 단계:

1. 필수 소프트웨어 설치:

   • Node.js (v20.0.0+), npm (v9.0.0+), Git (v2.40.0+), 현대적인 IDE (예: VS Code).
   • 시스템 요구사항: 8GB RAM, 256GB 저장공간, Intel i5/AMD Ryzen 5 프로세서.

2. iOS 설정 (macOS 전용):

   • macOS 13.0+ (Ventura), Xcode 16.0+, CocoaPods 1.12.0+, 활성화된 Apple Developer 계정.

3. Android 설정:

   • Android Studio Hedgehog (2023.1.1)+, Android SDK API level 23+, JDK 17, Gradle 8.0+.
   • Android 도구를 위한 환경 변수 설정.

4. Capacitor 설치:

   npm install @capacitor/core @capacitor/cli @capacitor/ios @capacitor/android

5. 프로젝트 초기화:

   • npx cap init를 사용하여 새 프로젝트를 생성하거나 기존 앱에 Capacitor 통합.

6. 플랫폼 추가:

   npx cap add ios
   npx cap add android

7. 빌드 및 동기화:

   • 웹 에셋 빌드 (npm run build) 및 네이티브 플랫폼과 동기화 (npx cap sync).

8. 실시간 업데이트 활성화:

   • Capgo를 사용하여 실시간 업데이트:

     npx @capgo/cli init

9. 앱 테스트:

   • iOS 시뮬레이터 (npx cap open ios) 또는 Android 에뮬레이터 (npx cap open android) 사용.

빠른 팁:

환경 관리 및 실시간 업데이트 활성화를 위해 capacitor.config.ts를 업데이트하세요. 예시:

const config: CapacitorConfig = {
  server: {
    url: process.env.NODE_ENV === 'development' ? 'http://localhost:3000' : 'https://production-url.com',
    cleartext: true
  }
};

이 설정을 통해 Capacitor 앱의 개발, 테스트, 배포가 원활해집니다.

[계속…]