# React Native

## 사전 작업 <a href="#pre-work" id="pre-work"></a>

이 문서는 React Native SDK 연동 완료 이후 인앱 메시지 수신을 테스트하기 위한 방법을 가이드합니다. 아래 문서의 사전 작업을 완료 후 진행해주세요.

{% content-ref url="../../sdk-integrating/initialize/react-native-sdk" %}
[react-native-sdk](https://docs.marketap.io/t3ZS4WXNMj0HK27EtIMV/developer/sdk-integrating/initialize/react-native-sdk)
{% endcontent-ref %}

{% content-ref url="" %}
[](https://docs.marketap.io/t3ZS4WXNMj0HK27EtIMV/developer/in-app-message/in-app-campaign)
{% endcontent-ref %}

수신 및 집계를 정확히 확인하기 위해 로그 레벨을  `debug` 로 설정해주세요.

{% content-ref url="../../advanced-usage/log-level" %}
[log-level](https://docs.marketap.io/t3ZS4WXNMj0HK27EtIMV/developer/advanced-usage/log-level)
{% endcontent-ref %}

## 1. 캠페인 수신 확인

[캠페인 테스트 단계](https://docs.marketap.io/t3ZS4WXNMj0HK27EtIMV/developer/in-app-message/in-app-campaign/..#id-1)에서 설정한 트리거 이벤트인 `홈 화면 조회` 를 찍도록 이벤트를 추가하고 캠페인이 트리거 되는지 확인해보겠습니다.&#x20;

코드의 적당한 위치에 홈 화면 조회(`mkt_home_view`) 이벤트를 추가합니다. 앱 실행 후 해당 코드가 실행되면 캠페인이 트리거되어야 합니다.&#x20;

```typescript
import React, {useEffect} from 'react';
import Marketap from 'react-native-marketap-sdk';

export default function HomeScreen() {
  useEffect(() => {
    Marketap.track('mkt_home_view').catch(error => {
      console.error('Failed to track mkt_home_view:', error);
    });
  }, []);

  return null;
}
```

디바이스에서 인앱 메시지가 정상 수신되는지 확인해주세요. [#id-2](#id-2 "mention") 으로 이동해서 연동을 추가로 확인해주세요.

## 2. 로그 확인

네이티브 플랫폼별 로그를 확인해주세요.

{% content-ref url="ios" %}
[ios](https://docs.marketap.io/t3ZS4WXNMj0HK27EtIMV/developer/in-app-message/in-app-campaign/ios)
{% endcontent-ref %}

{% content-ref url="android" %}
[android](https://docs.marketap.io/t3ZS4WXNMj0HK27EtIMV/developer/in-app-message/in-app-campaign/android)
{% endcontent-ref %}

## 3. 클릭 액션 커스텀하기 (선택)

캠페인에 클릭 액션 URL이 설정되어 있는 경우, 마켓탭 SDK는 OS별 기본 동작으로 URL을 처리합니다.

OS별 동작은 아래 링크를 참고해주세요.

* ios: [#id-3](https://docs.marketap.io/t3ZS4WXNMj0HK27EtIMV/developer/in-app-message/ios#id-3 "mention")
* android: [#id-3](https://docs.marketap.io/t3ZS4WXNMj0HK27EtIMV/developer/in-app-message/android#id-3 "mention")

이 기본 동작을 비활성화하고 클릭 시 액션을 직접 제어하려면, 아래 페이지 안내에 따라 clickHandler 기반 커스텀 연동을 진행해주세요.

{% content-ref url="../../advanced-usage/custom-click-handler" %}
[custom-click-handler](https://docs.marketap.io/t3ZS4WXNMj0HK27EtIMV/developer/advanced-usage/custom-click-handler)
{% endcontent-ref %}

## 4. 이어서 진행하기

이제 In-App Campaign 테스트가 완료되었습니다. 아래 문서에서 이어서 진행해주세요.

<table data-view="cards"><thead><tr><th></th><th data-hidden data-card-target data-type="content-ref"></th></tr></thead><tbody><tr><td>EVENT 및 USER 연동</td><td><a href="../../taxonomy/sdk">sdk</a></td></tr><tr><td>Push Notification 테스트</td><td><a href="../../push-notification/test">test</a></td></tr><tr><td>심화 연동</td><td><a href="../../advanced-usage/overview">overview</a></td></tr></tbody></table>
