[React Native] Native Modules

카테고리 : Development
태그: development · reactnative · android · ios · Objective-C · Swift · 네이티브 모듈 설정
등록일: 2023년 06월 08일
최근 업데이트: 2023년 06월 08일

---

• 네이티브 모듈 소개
  • 👉 네이티브 모듈의 필요성:
  • 👉 네이티브 모듈 시스템:
  • 네이티브 모듈 설정:
    • 👉 내용 정리:

네이티브 모듈 소개

👉 네이티브 모듈의 필요성:

• React Native 앱에서는 때로 JavaScript에서 기본적으로 사용할 수 없는 네이티브 플랫폼 API에 접근해야 할 필요가 있다.
• 예를 들어, Apple 또는 Google Pay에 액세스하기 위한 네이티브 API, 기존의 Objective-C, Swift, Java 또는 C++ 라이브러리를 재사용하거나 고성능, 멀티스레드 코드를 작성해야 할 경우가 있다.

👉 네이티브 모듈 시스템:

• 네이티브 모듈 시스템은 Java/Objective-C/C++ (네이티브) 클래스의 인스턴스를 JavaScript(JS)에게 JS 객체로 노출시켜, JS 내에서 임의의 네이티브 코드를 실행할 수 있도록 한다.
• 이 기능은 일반적인 개발 프로세스의 일부로 사용되지는 않지만, 필요성은 있다.
• React Native가 JS 앱에서 필요한 네이티브 API를 제공하지 않는 경우 직접적으로 네이티브 모듈을 내보낼 수 있다

네이티브 모듈 설정:

• React Native 애플리케이션에는 두 가지 방법으로 네이티브 모듈을 작성할 수 있음.
  1. React Native 애플리케이션의 iOS/Android 프로젝트 내에서 직접 작성
  2. React Native 애플리케이션의 종속성으로 설치할 수 있는 NPM 패키지로 작성

👉 내용 정리:

1. Android 네이티브 모듈 생성: React Native 애플리케이션의 Android 프로젝트 내에서 네이티브 모듈을 생성하는 방법에 대한 안내입니다. Android Studio를 사용하여 Java로 네이티브 모듈을 작성하고 React Native 앱에서 사용하는 방법을 안내합니다.
2. iOS 네이티브 모듈 생성: React Native 애플리케이션의 iOS 프로젝트 내에서 네이티브 모듈을 생성하는 방법에 대한 안내입니다. Xcode를 사용하여 Objective-C 또는 Swift로 네이티브 모듈을 작성하고 React Native 앱에서 사용하는 방법을 안내합니다.
3. JavaScript에서 네이티브 모듈 사용: 작성한 네이티브 모듈을 React Native 앱의 JavaScript 코드에서 사용하는 방법에 대한 안내입니다. 네이티브 모듈을 JavaScript에서 불러오고 메소드를 호출하는 방법을 설명합니다.
4. 네이티브 모듈 테스트: 작성한 네이티브 모듈을 테스트하는 방법에 대한 안내입니다. Jest를 사용하여 네이티브 모듈의 유닛 테스트를 작성하고 실행하는 방법을 안내합니다.