React Native 에이전트를 사용하면 팀에서 하이브리드 앱의 성능을 모니터링하고 코드 오류를 식별할 수 있습니다.에이전트는 기본 구성 요소를 사용하여 하이브리드 앱에 대한 충돌 데이터, 네트워크 트래픽 및 기타 정보를 수집합니다.
에이전트를 통해 팀은 플랫폼에 관계없이 하이브리드 앱의 상태를 이해할 수 있습니다.Javascript 오류, 분산 추적, 네트워크 계측 등에 대한 통찰력을 제공하여 팀이 보다 정보에 입각한 개발 선택을 할 수 있도록 합니다.
요구 사항
React Native 에이전트를 설치하기 전에 앱이 다음 요구 사항을 충족하는지 확인하세요.
- 안드로이드 API 24+
- iOS 10
- iOS 기본 요구 사항
- Android 기본 요구 사항
기본 지원 수준은 React Native 요구 사항 을 기반으로 합니다.
설정
React Native 애플리케이션을 모니터링하려면 다음 5단계를 완료하세요.
1단계: 에이전트 설치
다음을 실행합니다.
$npm i newrelic-react-native-agent
2단계: React Native 설정
이제 index.js
을 열고 다음 코드를 추가하여 NewRelic을 시작합니다.
중요
적절한 애플리케이션 토큰을 입력하십시오.appToken
은 플랫폼에 따라 다릅니다.Android 및 iOS 앱에 대해 별도의 토큰을 생성해야 합니다.
import NewRelic from 'newrelic-react-native-agent';import * as appVesrion from './package.json';import {Platform} from 'react-native';
let appToken;
if (Platform.OS === 'ios') { appToken = '<IOS-APP-TOKEN>'; } else { appToken = '<ANDROID-APP-TOKEN>'; }
NewRelic.startAgent(appToken);NewRelic.setJSAppVersion(appVesrion.version);AppRegistry.registerComponent(appName, () => App);
3단계: Android 설정
React Native 에이전트가 Android와 호환되는지 확인하려면 Android 전용 에이전트를 설치하세요.
이 지침 을 사용하여 New Relic 기본 Android 에이전트를 설치합니다.
업데이트
build.gradle
:buildscript {...repositories {...mavenCentral()}dependencies {...classpath "com.newrelic.agent.android:agent-gradle-plugin:6.6.0"}업데이트
app/build.gradle
:apply plugin: "com.android.application"apply plugin: 'newrelic' // <-- add this다음 행을
AndroidManifest.xml
에 추가하여 앱이INTERNET
및ACCESS_NETWORK_STATE
권한을 요청하는지 확인하십시오.<uses-permission android:name="android.permission.INTERNET" /><uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
4단계: iOS 설정
React Native 에이전트가 모든 iOS 프레임워크와 호환되는지 확인하려면 New Relic iOS 에이전트를 설치하세요.
$npx pod-install
5단계: 자동 연결 및 재구축
React Native New Relic 라이브러리는 프로젝트에 연결되어야 하고 애플리케이션을 다시 빌드해야 합니다.React Native 0.60+를 사용하는 경우 자동 연결에 자동으로 액세스할 수 있으므로 추가 수동 설치 단계가 필요하지 않습니다.
안드로이드 애플리케이션
npx react-native run-android
iOS 애플리케이션
cd ios/pod install --repo-updatecd ..npx react-native run-ios
React Native 애플리케이션이 제대로 작동하는지 확인하기 위해 다음 명령을 실행할 수 있으며 치명적인 JS 오류는 New Relic UI에서 충돌로 표시됩니다.
npx react-native run-ios --configuration Release
npx react-native run-android --variant=release
엑스포 통합(선택 사항)
Expo와의 통합은 기본 워크플로 에서 자동으로 이루어지지만 구성 플러그인 을 통해 사용자 지정 관리 워크플로 를 위한 몇 가지 추가 단계가 필요합니다.
맞춤 관리 워크플로 를 설정하려면 패키지를 설치한 후 app.json
또는 app.config.js
의 플러그인 배열에 구성 플러그인을 추가하세요.
관리형 워크플로의 경우 맞춤 네이티브 코드 추가 가이드에 설명된 대로 expo prebuild --clean
명령을 사용하여 플러그인 변경 사항으로 앱을 다시 빌드해야 합니다.이 명령이 실행되고 있지 않으면 New Relic 에이전트를 시작할 때 오류가 발생합니다.
API 호출
React Native 에이전트는 iOS 및 Android SDK 에이전트와 동일한 API 호출을 사용합니다.New Relic iOS SDK 문서 또는 Android SDK 를 참조하십시오.
자바스크립트 오류
New Relic 데이터 탐색기의 사용자 지정 이벤트 섹션에서 JavaScript 오류를 볼 수 있으며 NRQL을 사용하여 쿼리할 수도 있습니다.
다음 쿼리를 사용하여 오류에 대한 대시보드를 작성할 수도 있습니다.
SELECT jsAppVersion,name,Message,errorStack,isFatal FROM `JS Errors` SINCE 24 hours ago
대시보드를 시작하는 데 도움이 필요한 경우 대시 보드 소개 를 참조하세요.