[JAVASCRIPT 공부일지] 5주차 - 3 (수익성 앱 만들기 - 배포하기)

앱 서비스를 다 만들었으면 앱 배포도 만드는것 못지않게 중요합니다. 앱 스토어나 구글 플레이스토어 등 앱 마켓에 따라 배포가이드가 다르기때문입니다. 이번에는 배포를 하기 위한 체크리스트에 대해 공부해았습니다.

---

<배포를 위한 체크리스트>

앱 개발을 하면서 써왔던 "Expo"는 개발 뿐 아니라 배포,수정재배포 등 앱 개발 전체과정을 도와주는 툴입니다.
Expo도움을 받아 앱버전관리, 안드로이드, ios 인증버전관리 등을 쉽게할 수 있습니다.

먼저 앱 배포에 필요한 것들은
1) 앱 로고
2) 스플래시 스크린(앱 시작 초기화면)
3) 앱 마켓에 올릴 설명 이미지

입니다.

---

<스플래시 스크린>

플래시 스크린은 앱을 다운받았을 때 스마트폰 화면에 출력될 로고이미지와 앱을 켰을때 메인화면이 나오기 전 로고 등 '인트로페이지' 와 같이 짧게 보여지는 화면입니다.

스플래시 스크린을 제작하기 위해서
PIXLR 사이트 활용해 포토샵을 온라인으로 다뤄보려합니다.
https://pixlr.com/kr/x/

사진 에디터 : Pixlr.com - 온라인 무료 사진 편집 툴

기본으로 활용할 이미지로는 Expo에서 기본으로 제공중인 스플래시 이미지를 사용합니다.
assets 폴더에 splash.png 파일을 활용하면 됩니다.

---

그리고 배경이 투명이므로 뒷 배경으로는 무료이미지를 통해 살짝 꾸며주면 됩니다.
https://unsplash.com/

Beautiful Free Images & Pictures | Unsplash

구한 이미지는 레이아웃 크기만큼 복붙하여 새롭게 저장해서 assets폴더에 덮어쓰기를 하면 됩니다.
만약 splash.png가 아닌 다른 이름을 사용하고싶으면 app.json에서 조정하면 됩니다.
app.json에서는 배경과 이미지 주소, 이미지를 어떻게 배열시킬건지도 표현할수 있습니다.

---

<로고준비>

assets 폴더에는 icon.png 파일이 있는데, 이것또한 Expo 에서 제공중인 기본 아이콘 이미지입니다.

위에서 스플래시 이미지를 만들었던것과 마찬가지로
icon.png 규격에 맞게 적당히 사이즈 조절하면 됩니다.

---

<배포준비 : 최종 앱 파일 생성 및 개발자 가입>

먼저 안드로이드 배포방식부터 해보겠습니다.
안드로이드 배포는 비교적 승인 기간이 짧고, 개발자 라이센스 비용이 저렴하기때문입니다.

진행순서는
1) Expo를 통한 최종 앱 파일 생성
2) 구글 플레이 개발자 라이센스 가입 및 구입
3) 구글 플레이 스토어에 앱 배포

먼저 최종 앱파일 생성은 모두 명령어로 가능합니다.
아까 이미지 생성 시 다룬 app.json에 담긴 정보를 토대로 만들어집니다.

---

IF !!
*** 앱 배포과정에서 "BACKGROUND LOCATION 문제"로 배포가 안되는 현상 ***
- 백그라운드에서 자동적으로 돌아가는 지역 기반 기능이 있을경우 이 기능을 왜 사용하는지 선언해주어야합니다.
- 리액트 실습을 expo로 진행하면서 expo-location도구를 사용한적이 있으므로, 권한을 설정해주어야합니다.
>> 그러기 위해선
app.json의 android 부분에 permissions를 추가해주어야합니다.

"permissions": ["ACCESS_FINE_LOCATION", "ACCESS_COARSE_LOCATION"]

---

app.json 파일 안에서 몇가지 수정을 해주면 됩니다.

1. slug
- expo명령어로 배포/업로드를 진행하면 인터넷 주소를 하나 줍니다.
이 주소에서 소개 페이지처럼 지금까지 만든 앱을 QR코드로 확인(*Expo 클라이언트앱 설치되어있어야함)이 가능하므로
myAppName부분을 잘 설정해줍니다.

2. version
- 앱의 버전을 명시하는 부분

3. iOS - buildNumber / bundleIdentifier
- buildNumber는 버전을 뜻하고 bundleIdentifier은 앱에대한 주소를 뜻합니다.

3. android - versioncode / package
- 위의 iOS처럼 versioncode는 말그대로 버전을 뜻하고 package는 앱에 대한 주소 혹은 패키지를 뜻합니다.

---

<최종파일생성>

expo build:android

명령어를 터미널창에 입력하면 됩니다.
만약 expo start로 실행중인 서버가 있으면 ★ Ctrl + C로 서버를 종료시킨다음에 작성해야 합니다.

그렇다면 apk로 만들것인지 app-bundle로 만들것인지 선택이 나오는데 app-bundle로 만들어야합니다.

그 다음 항목부터는 키를 생성하는 등의 항목이므로 모두 Enter를 입력합니다.

---

IF !!
*** JDK 어쩌고 에러가 나게되면 ***
https://aileen93.tistory.com/43  (맥 유저)

https://gaeggu.tistory.com/2 (윈도우 유저)

링크를 참고하여 JDK를 설치해야합니다.

---

다 완료되면, 주소가 나오는데, 주소를 클릭하면 앱 소개페이지로 넘어갑니다. 
또한 queue... 라면서 아직 대기중이면 컴퓨터를 종료하지 않고 대기해야합니다.

이후에 expo 페이지로 들어가면 만든 프로젝트 우측 밑 default로 앱 번들 파일이 업로드되어 있는 것을 확인할 수 있습니다.
여기서 앱파일을 다운받을 수 있습니다.

---

<expo의 수익구조? >

- Expo는 사용자에게 우선권을 판매(일종의 구독시스템)하여, 대기시간을 조정할 수 있습니다. 짧게는 10분 길게 30분정도 가능합니다.

---

<구글플레이 스토어 개발자 가입>

https://developer.android.com/distribute/console?hl=ko

과정대로 진행하다보면 25달러에 가입이 가능합니다.

---

<안드로이드 & iOS 배포>

1) 구글플레이 개발자 페이지 (GooglePlay Console)에 들어가 앱 만들기라는 버튼을 누릅니다.
https://play.google.com/console/u/0/developers/8011237109127935096/app-list?onboardingflow=signup

2) 대시보드에서 상세 설정들을 조정해줍니다.

- 앱액세스 권한 : 특수한 액세스권한없이 모두이용가능 클릭

- 광고 : 앱에 광고가있습니다 클릭

- 콘텐츠 등급 : 설문지 시작을 누르시고, 등급에 따라 문제를 풀어야합니다.

모두 완료 후 제출을 누르면 개인정보처리방침이 나오는데, 직접 만드시거나, 교육받는 플랫폼의 주소를 넣어주시면 됩니다. 앱에 대한 상세정보 이미지까지 완료 후, 프로덕션을 통해 출시까지 완료하면 ✨앱 배포하기는 완성✨입니다.

---

다음 공부일지에서는 앱 개발을 하면서 느꼈던 😃후기를 작성해보겠습니다.

'스파르타 코딩 클럽' 온라인 교육 플랫폼에서 배운 내용을 토대로 작성하였습니다.