React Native 개발 환경 셋업하기

요즘 취미로 앱개발을 하고 싶어서, 어떤 것을 공부해서 해볼까 하던참에, 마침 React를 공부하고 있던 터라, React Native를 이용하여
개발 하면 어떨까 싶어서 React Native에 대해서 공부하게 되었습니다.

React Native를 간단하게 설명하면, 기존 프론트엔드 라이브러리인, React의 기술을 활용할 수 있고, Android/IOS 크로스플랫폼을 지원하는 프레임워크입니다.

이 포스팅에서는 React Native를 사용하기 위한 개발환경 셋업에 대해서 소개합니다. (MacOS 기준)

개발환경 셋업은 크게 3가지 챕터로 이루어져 있습니다.

• 기본 개발 환경 셋업
• Android & IOS 환경 셋업
• react-native CLI

기본 개발 환경 셋업

Home brew install

(Homebrew Download & Install)[https://brew.sh/index_ko]

Node & Watchman install

```
brew install node
brew install watchman
```

Java Development Kit install

```
brew tap AdoptOpenJDK/openjdk
brew cask install adoptopenjdk8
```

Android 개발 환경

Android Studio install

• (Install)[https://developer.android.com/studio/index.html]

• Android SDK

• Android SDK Platform

• Performance (Intel ® HAXM) (See here for AMD)

• Android Virtual Device

  

Android 환경변수 설정하기

export ANDROID_HOME=~/Library/Android/sdk
export PATH=${PATH}:${ANDROID_HOME}/tools
export PATH=${PATH}:${ANDROID_HOME}/platform-tools

android avd 명령 입력으로 명령어 목록조회
이때, 안드로이드 스튜디오를 이용하여 avd 생성해도 되고, android cli를 이용해도 된다.

android avd가 생성되었다면, android list avd를 실행하여 잘 생성되었는지 확인한다.

아래와 같이 출력된다면 정상적으로 생성이 된 것이다.

lAvailable Android Virtual Devices:
    Name: Pixel_API_29
  Device: pixel (Google)
    Path: /Users/jykang/.android/avd/Pixel_API_29.avd
  Target: Google Play (Google Inc.)
          Based on: Android API 29 Tag/ABI: google_apis_playstore/x86
    Skin: pixel_silver
  Sdcard: 512M

IOS 개발 환경

Xcode & CocoaPods Install

Xcode => Mac App Store에서 설치.

Xcode Command Line Tools 설정.

cocoapods

sudo gem install cocoapods

React Native CLI

React Native 환경에는 크게 React Native CLI와 Expo CLI가 있지만,
이 포스팅에서는 React Native CLI에 대해서만 소개하도록 하겠습니다.

프로젝트 생성하기

특정 버전을 지정하여 생성

npx react-native init AwesomeReactTsProject --version X.XX.X

TypeScript Version

npx react-native init AwesomeReactTsProject --template react-native-template-typescript

Android로 React Native 앱 실행

npx react-native run-android

Ios로 React Native 앱 실행

npx react-native run-ios