TIL 블로그

Expo build로 안드로이드 apk파일 생성하기 본문

Final Project

Expo build로 안드로이드 apk파일 생성하기

bsnow 2019. 12. 3. 03:00

react-native 를 이용해서 모바일 어플리케이션을 만드는 중이다. 

안드로이드용으로 play store 에 배포하는 것까지가 목표였는데,

일단 안드로이드 스튜디오가 필수적으로 필요한 것 같고

그건 내 노트북 상태에서는 돌아갈 수가 없는 수준의 프로그램이라서 다음 기회로 미루게 되었다..

날아간 플레이 스토어 배포의 꿈 ㅠㅠ

 

웹을 배포할 때는 AWS - S3 에 올리면 링크를 얻을 수 있었는데,

그럼 모바일은 내 컴퓨터에서 expo start 하는 것 말고는 쓸 수 있는 방법이 없어? 

라고 좌절했지만, 

 

계속 찾아보니까

플레이스토어에 올리는 게 아니더라도

.apk 파일만 만들어지면 핸드폰에서 사용할 수 있는 것이었다! (오예!)

 

안드로이드는  .apk 파일

IOS는 .ipa 파일

이 있으면 스마트폰에서 다운로드받아서 사용이 가능한데,

이런 파일들을 stand-alone file 이라고 한다고 한다. 

문자 그대로 혼자 설 수 있는,

내 노트북과 연결하지 않아도 독립적으로 실행할 수 있는 파일들을 의미한다.  

 


expo build 과정

1. app.json 을 수정한다. 

 

// app.json

{
  "name": "gostop",
  "displayName": "gostop",
  "expo": {
    "name": "gostop",
    "slug": "expo-template-bare",
    "privacy": "unlisted",
    "sdkVersion": "35.0.0",
    // 아래는 추가한 부분 (안드로이드 빌드할 거라서 안드로이드만 추가)
    "android": {
      "package": "com.gostophabit.gostop"
    },
    "icon" : "./icon.png",
    // 아이콘까지 추가 (아이콘은 정사각형, 1024*1024 png 파일을 추천한다고 함)
    "version": "1.0.0",
    "entryPoint": "node_modules/expo/AppEntry.js", 
    "platforms": [
      "ios",
      "android",
      "web"
    ],
    "description": ""
  }
}

 

 

2. 터미널 창 두개 띄워놓고

한쪽에서 exp start

다른 한 쪽에선 expo build:android

 

exp build 하기 전에 exp start 해야 한다는 것을 명심하자!

아래 링크를 통해 해결했음. 

https://forums.expo.io/t/error-connect-econnrefused-127-0-0-1-19001/12535

 

 

그러면 아마 android 의 경우, 아래 노란 박스에서처럼

선택지 두 개를 주고 keystore 를 직접 업로드할 것인지,

엑스포에 전권을 위임할 것인지를 선택하게 한다. 

처음 빌드하는 나는 엑스포에 맡기기를 선택. 

그리고 기다리면 아래처럼 빌딩을 시작한다. 

 

 

build 하는 중

 

 

3. 빌드가 완료되면 아래와 같은 화면이 뜬다. 

expo.io/builds ~~ 주소가 나오면 그 링크로 들어간다. 

 

 

 

링크로 들어가면 아래와 같은 화면이 뜨는데, 

Queued 상태에서 꽤 오래 기다려야 한다. 최소 10분 이상?

저 상태에서 아무 것도 변하지 않기 때문에 뭔가 잘못된 거 아닌가 싶지만, 계속 기다리다보면

뭔가가 시작되고, 완료가 되면

cancel 버튼 쪽에 download 버튼이 생성된다. 

 

 

 

 

.apk 파일을 안드로이드 기기에 다운로드 받으면 바로 사용 가능하다. 

 

 

 

참고링크 

https://medium.com/encored-technologies-engineering-data-science/expo-react-native-create-app-으로-앱스토어에-배포하기-d1c9af5c8802

 

[EXPO(react-native-create-app) 프로젝트 배포] 1. EXPO를 이용한 배포 과정 살펴보기

react-native로 개발하여 ios, android에 한 번에 배포하기

medium.com