React-native 앱은 네이티브 안드로이드 프로젝트 내에 JS로 작성한 로직과 네이티브 컴포넌트를 결합하여 동작합니다.

RN 앱의 기본 구조

네이티브 코드와 JS 코드의 분리

• RN 프로젝트는 Android 전용 폴더(android/)를 포함합니다.
• 이 프로젝트 내에는 앱의 기본 Activity가 포함되며 이 Activity는 JS 런타임과 함께 동작하며 ReactRootView를 초기화합니다.

Metro Bundler의 역할

• 개발 환경에서 Metro Bundler라는 Node.js 기반의 서버가 실행되어 JS 코드를 번들링하고, 이를 HTTP를 통해 앱에 전달합니다.

Bridge 아키텍처

• JS 코드와 네이티브 코드는 비동기적으로 통신하는 Bridge를 통해 상호작용합니다. 이 구조 덕분에 JS에서 네이티브 API를 호출하거나, 네이티브 이벤트를 받아올 수 있습니다.

안드로이드 스튜디오에서 제공하는 에뮬레이터와 RN과의 통합

• RN 앱은 에뮬레이터 환경에서 Gradle 빌드 시스템을 통해 컴파일되어 APK가 생성되고, 에뮬레이터 상에서 배포 및 구동됩니다.

개발 프로세스의 동작 원리

앱 실행 시 네이티브 안드로이드 코드는 ReactInstanceManager를 통해 ReactRootView를 생성합니다.

• ReactRootView는 Metro Bundler가 제공하는 JS 번들을 받아 런타임을 실행합니다.