STUDY/Others

React Native 초기설정(Expo cli)

sinawi95 2021. 7. 22. 13:55
728x90

mac

  1. brew 설치
  2. watchman 설치 brew install watchman
  3. Node.js 설치
    1. nvm 설치 brew install nvm
    2. node 설치nvm install --lts
    3. node.js 버전확인 node --version
    4. npm 버전 확인 npm --version
  4. ios 개발환경
    1. Xcode 설치(앱스토어)
    2. Xcode 실행 - Preferences - Locations - Command Line Tools - 가장 최신 버전으로 설정
    3. 코코아팟 설치: 라이브러리 관리도구
      1. sudo gem install cocoapods
      2. 버전 확인 pod --version
    4. 시뮬레이터 실행확인
      1. Xcode 실행 - Xcode tap - Open Developer Tool - Simulator
      2. Simulator.app 실행
      3. 실행 이후 File 탭 - Open Device 로 원하는 기기 실행 가능
  5. 안드로이드 개발 환경
    1. JDK 설치
    2. 안드로이드 스튜디오 설치 https://bit.ly/android-ide-download
      1. Install Type - Custom
        1. Android SDK
        2. API 30: Android 10.0+ (R)
        3. Performance (intel HAXM)
        4. Android Virtual Device
      2. Android Studio 실행 이후
        1. Configure - SDK Manager 클릭
        2. 왼쪽 탭 Appearance & Behavior - system settings - Android SDK
        3. SDK Flatforms
          1. Android SDK Platform 29
          2. intel x86 Atom_64 System Image / Google APIs Intel x86 Atom system image
        4. SDK Tools
          1. Android SDK Build - Tools 29.0.2
        5. ./zshrc 파일을 열고 다음 내용 추가export ANDROID_HOME=$HOME/Library/Andriod/sdk export PATH=$PATH:$ANDROID_HOME/emulator export PATH=$PATH:$ANDROID_HOME/tools export PATH=$PATH:$ANDROID_HOME/tools/bin export PATH=$PATH:$ANDROID_HOME/platform-tools
        6. adb --version 설치 확인
      3. 에뮬레이터 실행
        1. 안드로이드 스튜디오 실행
        2. configure - AVD Manager 클릭
        3. 원하는 기기 선택, system image 선택

windows

  1. Node.js 설치
    1. https://nodejs.org/ko/download/
    2. node.js 버전확인 node --version
  2. python python 2.7 설치
    1. https://bit.ly/python-2-download
    2. python 3이 이미 있는 경우 환경변수 설정해야됨. python 3을 python3으로바꾸든지 python 2를 python2로 설정하든지
  3. 안드로이드 개발 환경
    1. JDK 설치 및 환경 변수 설정
    2. 안드로이드 스튜디오 설치 https://bit.ly/android-ide-download
      1. Install Type - Custom
        1. Android SDK
        2. API 30: Android 10.0+ (R)
        3. Performance (intel HAXM)
        4. Android Virtual Device
      2. Android Studio 실행 이후
        1. Configure - SDK Manager 클릭
        2. 왼쪽 탭 Appearance & Behavior - system settings - Android SDK
        3. SDK Flatforms
          1. Android SDK Platform 29
          2. intel x86 Atom_64 System Image / Google APIs Intel x86 Atom system image
        4. SDK Tools
          1. Android SDK Build - Tools 29.0.2
        5. 환경변수 추가
          1. 사용자 변수 추가
            1. 변수이름:ANDRIOD_HOME / 변수 값: %LOCALAPPDATA%\\Android\\Sdk
            2. 시스템 변수 - path 변수에 값 추가 %LOCALAPPDATA%\\Android\\Sdk\\palatform-tools
        6. 실행 확인 adb --version
      3. 에뮬레이터 실행
        1. 안드로이드 스튜디오 실행
        2. configure - AVD Manager 클릭
        3. 원하는 기기 선택, system image 선택

Expo 설치(공통)

  1. https://expo.io 회원가입
  2. expo cli 설치
    1. npm install --global expo-cli
  3. 프로젝트 생성 및 실행
    1. expo init (project name)
    2. cd (project name)
    3. npm start
  4. 기기에서 프로젝트 구동
    1. 실제 기기
      1. 아이폰: expo go 설치
      2. 안드로이드: expo
      3. QR 코드로 입장/ 연결된 wifi 가 같아야됨
      4. 케이블로 연결후 run android(ios) device/emulator 클릭
    2. 가상 기기
      1. ios:
        1. 명령 프롬프트에서 i 입력
        2. run on ios device/emulator
      2. android:
        1. 명령 프롬프트에서 a 입력
        2. run on android device/emulator

가상환경이 필요하지 않으면 안드로이드 스튜디오나 xcode 시뮬레이터는 받지 않아도 될거같다

저작자표시