[겉핥기 프로젝트] React Native 설치 및 샘플 코드 실행 (안드로이드)

React Native는 react 문법을 사용하여 WebApp이 아닌 모바일 Native 앱을 작성할 수 있게 하는 기능을 제공한다.(안드로이드, 아이폰 지원)

• [참고] 데스크탑용으로는 Native 어플리케이션 작성을 지원하는 react-native-macos(OSX용), react-native-windows(윈도우용)가 있고, WebApp 형태로 작성할 경우 OS별 테마가 적용된 react component인 react-desktop이 있다.

사전 설치 요구사항

• Node.js

  
  

• 안드로이드 스튜디오

  
  

안드로이드 스튜디오 세팅

1. SDK Manager를 실행한다.

   
   

2. Android 6.0 SDK(Marshmallow, API Level = 23)를 설치한다. (주의: 현재 Android 7.0 SDK는 지원하지 않는다)

   
   

3. AVD Manager를 실행한다.

   
   

4. 6.0 SDK를 사용하여 AVD를 생성한다.

   
   

React Native 설치

1. 커맨드라인 상에서 아래와 같이 입력하여 React Native를 설치한다.

   npm install -g react-native-cli
   

   
   

샘플 프로젝트 생성 및 실행

1. 커맨드라인 상에서 아래와 같이 입력하면 샘플 프로젝트가 생성된다.

   react-native init 생성할-프로젝트명
   

   => [참고] react-native init시 Unexpected token … 에러가 발생하는 경우

   
   

2. AVD(안드로이드 에뮬레이터)가 실행되어 있는 상태에서 아래와 같이 입력하면 프로젝트가 빌드되어 에뮬레이터 상에 실행되는 것을 볼 수 있다.

   react-native run-android
   

   
   

3. [참고] IOS용 실행 커맨드는 참고로 다음과 같다.

   react-native run-ios
   

   
   

참고 사이트

• https://www.tutorialspoint.com/react_native/ - 튜토리얼

  
  

<테스트 환경>
- OS : Windows 7
- 안드로이드 스튜디오 버전 : 2.3.3
- node.js 버전 : 6.11.2
- react-native-cli 버전 : 2.0.1