ABOUT ME

-

Today
-
Yesterday
-
Total
-
  • [React-Native] 셋팅(Mac, android)
    React-Native 2024. 4. 24. 20:39
    728x90
    반응형

    저번 글에서는 IOS만 쓰고 안드로이드 셋팅하는 걸 깜빡하고 안 써서 따로 작성해본다

     

    1. Node, Watchman 설치

     

    brew install node
    brew install watchman

     

     

    이미 IOS를 셋팅할 때 설치했기 때문에 패스

     

    2. JDK(Java Development Kit) 설치

     

    brew tap homebrew/cask-versions
    brew install --cask zulu17
    brew info --cask zulu17

     

    터미널에 공홈에서 알려주는 대로 Homebrew를 통해 오픈JDK를 설치하면 된다

    Zulu OpenJDK를 사용하면 인텔 기반 JDK를 사용할 때보다 M1 Mac에서 빌드 속도가 빨라진다고 한다(오호)

    너무 최신버전으로 설치해도 에러가 발생할 수 있다고하니 (버전이 안 맞아서) 17 버전으로 설치해주자

     

    3. 안드로이드 스튜디오 설치

     

    https://developer.android.com/studio?hl=ko

     

    오랜만에 안드로이드 홈페이지에 가보는데 뭔가 많이 달라진듯???

    여튼 안드로이드 스튜디오 홈페이지에서 스튜디오 lguana를 다운로드 받는다

     

    맥북이라면 인텔칩이랑 애플칩 중에 선택해서 다운로드 해야한다

    내 맥은 M1이니까 애플칩으로 고고~

     

    설치를 할 때 아래의 항목에 체크를 해서 설치해주도록 하자

    • Android SDK
    • Android SDK Platform
    • Android Virtual Device

    참고로 설치할 때 스크린샷은 없어서 생략^^

     

    4. 안드로이드 SDK 설치

    안드로이드 스튜디오는 최신 버전의 안드로이드 SDK를 지원하지만 리액트 네이티브 앱을 빌드하려면 Android 13(Tiramisu)가 필요하다고 한다

    설치 고고~

     

     

    More Actions -> SDK Manager -> Languages & Frameworks -> SDK Platforms에서 show package details를 클릭 후 Android 13을 찾는다 

    Android 13에서 아래의 항목을 찾아 설치한다

    • Android SDK Platform 33
    • Intel x86 Atom_64 System Image or Google APIs Intel x86 Atom System Image or (for Apple M1 Silicon) Google APIs ARM 64 v8a System Image

    M1인 경우에는 Google APIs ARM 64 v8a System Image만 설치하면 돼서 Android SDK Platform 33이랑 Google APIs ARM 64 v8a System Image에만 체크를 해주고 설치해주었다(사진에는 잘려서 나옴)

     

    그리고 SDK Tools -> 마찬가지로 show package details를 클릭 후 Android SDK Build-Tools에서 33.0.0이 설치되어있는지 확인한다

     

    그리고 터미널에 아래와 같이 입력해주고 path를 설정해준다

     

    open ~/.zshrc (혹은 ~/.zprofile) 

    bash를 사용한다면 ~/.bashrc (혹은 ~/.bash_profile)

     

    그러면 파일이 하나 열리는데 파일의 맨 아래에 아래와 같이 안드로이드 경로를 입력해주고 저장해준다

     

    export ANDROID_HOME=$HOME/Library/Android/sdk
    export PATH=$PATH:$ANDROID_HOME/emulator
    export PATH=$PATH:$ANDROID_HOME/platform-tools

     

    저장했으면 아래 명령어를 입력해 변경된 내용이 적용되게 실행시켜준다

    source ~/.zshrc

     

     

    아래 명령어를 입력하면 ANDROID_HOME이 어느 경로에 셋팅되어있는지와 아까 파일에서 지정한 path들을 볼 수 있다

    echo $ANDROID_HOME
    echo $PATH

     

    5. 실행

     

    npm start

    를 입력해 metro 서버만을 켤 수도 있지만 

     

    npm run android

    을 사용하면 에뮬레이터에서 앱을 빌드하면서 metro 서버가 같이 켜진다

     

    여튼 켜서 아래와 같은 화면이 뜨면 완성

     

    반응형
Designed by Tistory.