<div id="readability-page-1" class="page"><section>January 02, 2022<article><h2 id="intro"><a href="#intro" aria-label="intro permalink"></a>Intro</h2>
React Native 개발은 역시 빌드, 배포라고 생각한다. 지금까지 개발했던 모든 것을 이제 사용자에게 공개하는 날이 온 것이다. 이번 글에서 안드로이드와 IOS를 빌드하여 각각 PlayStore, AppStore에 올리고 심사하는 과정을 살펴보자.
<h2 id="목차"><a href="#%EB%AA%A9%EC%B0%A8" aria-label="목차 permalink"></a>목차</h2>
<ol>
<li><a href="#-intro">Intro</a></li>
<li><a href="#android-%ED%94%8C%EB%A0%88%EC%9D%B4%EC%8A%A4%ED%86%A0%EC%96%B4%EC%97%90-%EC%98%AC%EB%A6%AC%EA%B8%B0">Android 플레이스토어에 올리기</a></li>
<li><a href="#ios-%EC%95%B1%EC%8A%A4%ED%86%A0%EC%96%B4%EC%97%90-%EC%98%AC%EB%A6%AC%EA%B8%B0">IOS 앱스토어에 올리기</a></li>
<li><a href="#-outtro">Outtro</a></li>
</ol>
<h2 id="android-플레이스토어에-올리기"><a href="#android-%ED%94%8C%EB%A0%88%EC%9D%B4%EC%8A%A4%ED%86%A0%EC%96%B4%EC%97%90-%EC%98%AC%EB%A6%AC%EA%B8%B0" aria-label="android 플레이스토어에 올리기 permalink"></a>Android 플레이스토어에 올리기</h2>
안드로이드를 배포하기 위해 우선 서명된 키로 빌드해야한다. 안드로이드 스튜디오를 열어보자.
상단 메뉴에서 <code>build &gt; Genarate Signed Bundle/ APK</code>를 클릭한다.

 
 <img alt="Android_PlayStore_Distribution_1" title="Android_PlayStore_Distribution_1" src="https://snyung.com/static/99f6ea226d5c36c0e1d57a5a5dc57634/39d76/android_1.png" sizes="(max-width: 361px) 100vw, 361px" loading="lazy" decoding="async">
 
당연히 APK로 빌드하려고 했으나 Google에서는 많은 이유로 AAB(Android App Bundle) 파일로 빌드하는 것을 추천하고 있다. 그래서 AAB 파일로 빌드하였다.

 
 <img alt="Android_PlayStore_Distribution_2" title="Android_PlayStore_Distribution_2" src="https://snyung.com/static/23bdc1f142fddeba390b2e9bce6913ff/74cfa/android_2.png" sizes="(max-width: 553px) 100vw, 553px" loading="lazy" decoding="async">
 
다음 화면으로 넘어가면 처음 빌드라면 빈칸으로 있을 것이다. 우선 <code>Create new...</code> 를 클릭해서 Key를 생성한다. 생성한 Key는 잘 보관하길 바란다. Key를 생성하면 생성하면서 입력한 비밀번호를 다시 입력해야한다. 아래와 같이 빈칸을 다 채워주자.

 
 <img alt="Android_PlayStore_Distribution_3" title="Android_PlayStore_Distribution_3" src="https://snyung.com/static/c8c9d08beb80cfa7810f2d8e2011bb3b/a6d36/android_3.png" sizes="(max-width: 650px) 100vw, 650px" loading="lazy" decoding="async">
 
빌드 결과물이 저장될 경로를 설정하고 플레이스토어에 올리기 위해서 release를 선택한다.

 
 <img alt="Android_PlayStore_Distribution_4" title="Android_PlayStore_Distribution_4" src="https://snyung.com/static/4b455864de5389e6c4a0fc6344b8c14e/a6d36/android_4.png" sizes="(max-width: 650px) 100vw, 650px" loading="lazy" decoding="async">
 
AAB 확장자로 빌드된 파일을 확인할 수 있다.

 
 <img alt="Android_PlayStore_Distribution_5" title="Android_PlayStore_Distribution_5" src="https://snyung.com/static/617be173c9c4f612e6960d9db24e8a4f/9b7bd/android_5.png" sizes="(max-width: 444px) 100vw, 444px" loading="lazy" decoding="async">
 
<a href="https://play.google.com/console">https://play.google.com/console</a> 접속하면 이전에 올려진 버전과 함께 여태까지의 기록을 확인할 수 있다. 앱을 선택해서 자세히보자.

 
 <img alt="Android_PlayStore_Distribution_6" title="Android_PlayStore_Distribution_6" src="https://snyung.com/static/2c0dba4bbd49e2c24295e01ba03de93d/a6d36/android_6.png" sizes="(max-width: 650px) 100vw, 650px" loading="lazy" decoding="async">
 
좌측 메뉴 중 프로덕션에 들어가면 우측 상단에 <code>새 버전 만들기 버튼</code>이 있다. 우리는 새로운 버전의 앱을 배포하기 위해서 새로운 버전을 우선 만들어 주어야한다.
이전에 국가/지역을 선택해주는 것도 좋다. 모든 국가로도 가능하다. 대한민국만 선택하는 경우 플레이스토어에서 대한민국 기준으로 검색할 경우에만 검색이 되어 모든 국가로 추가해주었다.

 
 <img alt="Android_PlayStore_Distribution_7" title="Android_PlayStore_Distribution_7" src="https://snyung.com/static/98f33448e450869dee436dcb38171b0f/a6d36/android_7.png" sizes="(max-width: 650px) 100vw, 650px" loading="lazy" decoding="async">
 
프로덕션 만들기 페이지로 이동하게 되면 중간에 App Bundle을 올릴 수 있는 공간이 있다. 드래그해서 올릴 수 있으며 파일을 선택해서 올릴 수 있다(올리는데 약간의 시간이 걸린다).

 
 <img alt="Android_PlayStore_Distribution_8" title="Android_PlayStore_Distribution_8" src="https://snyung.com/static/1ac2c73a77019dfaf8633c9d7247fb5e/a6d36/android_8.png" sizes="(max-width: 650px) 100vw, 650px" loading="lazy" decoding="async">
 
우리가 항상 플레이스토어에서 보이는 개발자들의 변경사항이 출시노트와 동일하다고 생각하면 된다. 사용자를 위해서 간단하게 변경사항 작성하자.
모든 내용을 입력하고 저장을 누르면 <code>버전 검토 버튼</code>이 활성화된다. 이어서 <code>버전 검토 버튼</code>을 누르자.
이제 <code>심사가 이루어지고 통과된다면 자동으로 플레이스토어에 올라간다.</code>

 
 <img alt="Android_PlayStore_Distribution_9" title="Android_PlayStore_Distribution_9" src="https://snyung.com/static/e328734c9938a6e19e4fa994fd93edd2/a6d36/android_9.png" sizes="(max-width: 650px) 100vw, 650px" loading="lazy" decoding="async">
 
<h2 id="ios-앱스토어에-올리기"><a href="#ios-%EC%95%B1%EC%8A%A4%ED%86%A0%EC%96%B4%EC%97%90-%EC%98%AC%EB%A6%AC%EA%B8%B0" aria-label="ios 앱스토어에 올리기 permalink"></a>IOS 앱스토어에 올리기</h2>
서명을 이미 Xcode에 등록했다는 가정하에 작성하였습니다. IOS 빌드를 위해 Xcode를 실행한다.
빌드하기 전 빌드할 Bundle의 version과 build version을 확인한다.

 
 <img alt="IOS_AppStore_Distribution_1" title="IOS_AppStore_Distribution_1" src="https://snyung.com/static/90381ae64c4fa4adbdf78161307528ed/a6d36/IOS_1.png" sizes="(max-width: 650px) 100vw, 650px" loading="lazy" decoding="async">
 
배포 빌드를 위해서는 시뮬레이터를 선택되어 있으면 안된다. 이를 위해 <code>Any iOS Device</code>로 바꿔준다.

 
 <img alt="IOS_AppStore_Distribution_2" title="IOS_AppStore_Distribution_2" src="https://snyung.com/static/51d17b717796bcda83b105311aa53fd8/6bc44/IOS_2.png" sizes="(max-width: 222px) 100vw, 222px" loading="lazy" decoding="async">
 
Xcode 메뉴에서 <code>Product &gt; Archive</code>를 선택한다. 방금 전 <code>Any iOS Device</code>로 선택을 바꾸지 않는다면, 해당 메뉴가 활성화되지 않는다.

 
 <img alt="IOS_AppStore_Distribution_3" title="IOS_AppStore_Distribution_3" src="https://snyung.com/static/cb8141958e3a920cee75b8a742f5f3d3/5fce1/IOS_3.png" sizes="(max-width: 271px) 100vw, 271px" loading="lazy" decoding="async">
 
빌드가 되었다면 <a href="https://appstoreconnect.apple.com/">appstoreconnect.apple.com</a> 에 올리는 작업을 하자. 올릴 Bundle 파일을 선택하고 <code>Distribution App</code> 버튼을 클릭한다.

 
 <img alt="IOS_AppStore_Distribution_4" title="IOS_AppStore_Distribution_4" src="https://snyung.com/static/646216f9387cb180e20c0b1f4c1915c7/a6d36/IOS_4.png" sizes="(max-width: 650px) 100vw, 650px" loading="lazy" decoding="async">
 
당연하게 앱스토어에 올리는 과정이니 App Store Connect를 선택하고 다음 버튼을 누른다.

 
 <img alt="IOS_AppStore_Distribution_5" title="IOS_AppStore_Distribution_5" src="https://snyung.com/static/64a4440d3a031af67b2e253c0823148c/a6d36/IOS_5.png" sizes="(max-width: 650px) 100vw, 650px" loading="lazy" decoding="async">
 
Upload를 선택하고 다음으로 이동한다.

 
 <img alt="IOS_AppStore_Distribution_6" title="IOS_AppStore_Distribution_6" src="https://snyung.com/static/79d44b563a21b5413b95a64d12c06233/a6d36/IOS_6.png" sizes="(max-width: 650px) 100vw, 650px" loading="lazy" decoding="async">
 
기본으로 설정된 체크박스를 그대로 두고 다음 버튼을 누른다.

 
 <img alt="IOS_AppStore_Distribution_7" title="IOS_AppStore_Distribution_7" src="https://snyung.com/static/cf6f1f66afa668a69e1354a75febf070/a6d36/IOS_7.png" sizes="(max-width: 650px) 100vw, 650px" loading="lazy" decoding="async">
 
이 단계에서 우리가 가지고 있는 인증서를 선택해서 Bundle 파일에 서명한다.

 
 <img alt="IOS_AppStore_Distribution_8" title="IOS_AppStore_Distribution_8" src="https://snyung.com/static/69c9056c9a3fd209d3d774448444d807/a6d36/IOS_8.png" sizes="(max-width: 650px) 100vw, 650px" loading="lazy" decoding="async">
 
마지막으로 나온 결과값을 확인하고 Upload한다.

 
 <img alt="IOS_AppStore_Distribution_9" title="IOS_AppStore_Distribution_9" src="https://snyung.com/static/4e24fce8d54a473102b04103662dc6e3/a6d36/IOS_9.png" sizes="(max-width: 650px) 100vw, 650px" loading="lazy" decoding="async">
 
upload되면 <a href="https://appstoreconnect.apple.com/">appstoreconnect.apple.com</a> TestFlight 탭에서 확인할 수 있다. 아직은 처리중으로 기다리면 올릴 수 있는 상태로 변경된다.

 
 <img alt="IOS_AppStore_Distribution_10" title="IOS_AppStore_Distribution_10" src="https://snyung.com/static/2b22f9c079dcafe3af1837440abd047f/a6d36/IOS_10.png" sizes="(max-width: 650px) 100vw, 650px" loading="lazy" decoding="async">
 
<a href="https://appstoreconnect.apple.com/">appstoreconnect.apple.com</a> 좌측 상단에 있는 플러스 버튼을 클릭해서 새로운 버전을 만든다.
중간을 이동하면 빌드라는 공간에 방금 올린 Bundle파일을 올릴 수 있다.

 
 <img alt="IOS_AppStore_Distribution_11" title="IOS_AppStore_Distribution_11" src="https://snyung.com/static/a2edd0696bf932ccadb6b9c04150af91/a6d36/IOS_11.png" sizes="(max-width: 650px) 100vw, 650px" loading="lazy" decoding="async">
 
상단에 변경사항을 간단하게 작성(업그레이드된 사항 7자 이상 작성하기)하고 저장을 하고 심사를 위해 제출 버튼을 누르자.

 
 <img alt="IOS_AppStore_Distribution_12" title="IOS_AppStore_Distribution_12" src="https://snyung.com/static/c1bd0f0afea3856b60a03ef7668e5a76/a6d36/IOS_12.png" sizes="(max-width: 650px) 100vw, 650px" loading="lazy" decoding="async">
 
애플에서 심사를 진행하고 승인이 되면 자동으로 플레이스토어에 올라간다. 심사는 최대 일주일이 걸린다고 한다.

 
 <img alt="IOS_AppStore_Distribution_13" title="IOS_AppStore_Distribution_13" src="https://snyung.com/static/48aa06cd216f1f903f96a4a0f0c71eb4/a6d36/IOS_13.png" sizes="(max-width: 650px) 100vw, 650px" loading="lazy" decoding="async">
 
<h2 id="-outtro"><a href="#-outtro" aria-label=" outtro permalink"></a>👋 Outtro</h2>
혼자서 공부를 하고 배포하려니까 많이 힘들어서 작성하였다. 나뿐만 아니라 혼자서 고생하는 많은 분들께 도움되길 바란다.
<h4 id="rn-개발기"><a href="#rn-%EA%B0%9C%EB%B0%9C%EA%B8%B0" aria-label="rn 개발기 permalink"></a>RN 개발기</h4>
<table>
<thead>
<tr>
<th></th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td>IOS Signing(인증서) 제대로 알고 사용하기</td>
<td><a href="/content/2021-08-22--IOS-Signing(%EC%9D%B8%EC%A6%9D%EC%84%9C)-%EC%A0%9C%EB%8C%80%EB%A1%9C-%EC%95%8C%EA%B3%A0-%EC%82%AC%EC%9A%A9%ED%95%98%EA%B8%B0">살짝 읽어보기</a></td>
</tr>
<tr>
<td>앱 개발 유용한 Firebase 기능</td>
<td><a href="/content/2021-08-25--%EC%95%B1-%EA%B0%9C%EB%B0%9C%EC%97%90-%EC%9C%A0%EC%9A%A9%ED%95%9C-Firebase-%EA%B8%B0%EB%8A%A5">살짝 읽어보기</a></td>
</tr>
<tr>
<td>React Native Webview 개발기</td>
<td><a href="/content/2021-08-29--React-Native-Webview-%EA%B8%B0%EB%8A%A5-%EA%B0%9C%EB%B0%9C">살짝 읽어보기</a></td>
</tr>
<tr>
<td>App과 Web 통신하기</td>
<td><a href="">준비중</a></td>
</tr>
<tr>
<td>fastlane으로 간편하게 앱(Android, IOS) 테스트 배포하기</td>
<td><a href="">준비중</a></td>
</tr>
<tr>
<td>PlayStore(플레이스토어) + AppStore(앱스토어) 배포</td>
<td><a href="/content/2021-09-15--PlayStore(%ED%94%8C%EB%A0%88%EC%9D%B4%EC%8A%A4%ED%86%A0%EC%96%B4)-AppStore(%EC%95%B1%EC%8A%A4%ED%86%A0%EC%96%B4)-%EB%B0%B0%ED%8F%AC">현재 페이지</a></td>
</tr>
</tbody>
</table></article><section>#PlayStore#AppStore#배포</section><ins data-ad-client="ca-pub-8793464953717853" data-ad-slot="3513526331" data-ad-layout="" data-ad-layout-key="" data-ad-format="auto" data-full-width-responsive="true"></ins><section><section><a href="/aboutme"></a><section><a href="/aboutme"></a>😍 개발문화 만들기 | 설계 | 생산성 | 도전 🏛 @Im-D @callbus</section></section><section><a href="/content/2021-08-29--React-Native-Webview-기능-개발"></a></section></section></section></div>

sNyung Site's RSS Feed

Intro
React Native 개발은 역시 빌드, 배포라고 생각한다. 지금까지 개발했던 모든 것을 이제 사용자에게 공개하는 날이 온 것이다. 이번 글에서 안드로이드와 IOS를 빌드하여 각각 PlayStore, AppStore에 올리고 심사하는 과정을 살펴보자.
목차
Intro
Android 플레이스토어에 올리기
IOS 앱스토어에 올리기
Outtro
Android 플레이스토어에 올리기
안드로이드를 배포하기 위해 우선 서명된 키로 빌드해야한다. 안드로이드 스튜디오를 열어보자.
상단 메뉴에서 build > Genarate Signed Bundle/ APK를 클릭한다.
      
  
    
당연히 APK로 빌드하려고 했으나 Google에서는 많은 이유로 AAB(Android App Bundle) 파일로 빌드하는 것을 추천하고 있다. 그래서 AAB 파일로 빌드하였다.
      
  
    
다음 화면으로 넘어가면 처음 빌드라면 빈칸으로 있을 것이다. 우선 Create new... 를 클릭해서 Key를 생성한다. 생성한 Key는 잘 보관하길 바란다. Key를 생성하면 생성하면서 입력한 비밀번호를 다시 입력해야한다. 아래와 같이 빈칸을 다 채워주자.
      
  
    
빌드 결과물이 저장될 경로를 설정하고 플레이스토어에 올리기 위해서 release를 선택한다.
      
  
    
AAB 확장자로 빌드된 파일을 확인할 수 있다.
      
  
    
https://play.google.com/console 접속하면 이전에 올려진 버전과 함께 여태까지의 기록을 확인할 수 있다. 앱을 선택해서 자세히보자.
      
  
    
좌측 메뉴 중 프로덕션에 들어가면 우측 상단에 새 버전 만들기 버튼이 있다. 우리는 새로운 버전의 앱을 배포하기 위해서 새로운 버전을 우선 만들어 주어야한다.
이전에 국가/지역을 선택해주는 것도 좋다. 모든 국가로도 가능하다. 대한민국만 선택하는 경우 플레이스토어에서 대한민국 기준으로 검색할 경우에만 검색이 되어 모든 국가로 추가해주었다.
      
  
    
프로덕션 만들기 페이지로 이동하게 되면 중간에 App Bundle을 올릴 수 있는 공간이 있다. 드래그해서 올릴 수 있으며 파일을 선택해서 올릴 수 있다(올리는데 약간의 시간이 걸린다).
      
  
    
우리가 항상 플레이스토어에서 보이는 개발자들의 변경사항이 출시노트와 동일하다고 생각하면 된다. 사용자를 위해서 간단하게 변경사항 작성하자.
모든 내용을 입력하고 저장을 누르면 버전 검토 버튼이 활성화된다. 이어서 버전 검토 버튼을 누르자.
이제 심사가 이루어지고 통과된다면 자동으로 플레이스토어에 올라간다.
      
  
    
IOS 앱스토어에 올리기
서명을 이미 Xcode에 등록했다는 가정하에 작성하였습니다. IOS 빌드를 위해 Xcode를 실행한다.
빌드하기 전 빌드할 Bundle의 version과 build version을 확인한다.
      
  
    
배포 빌드를 위해서는 시뮬레이터를 선택되어 있으면 안된다. 이를 위해 Any iOS Device로 바꿔준다.
      
  
    
Xcode 메뉴에서 Product > Archive를 선택한다. 방금 전 Any iOS Device로 선택을 바꾸지 않는다면, 해당 메뉴가 활성화되지 않는다.
      
  
    
빌드가 되었다면 appstoreconnect.apple.com 에 올리는 작업을 하자. 올릴 Bundle 파일을 선택하고 Distribution App 버튼을 클릭한다.
      
  
    
당연하게 앱스토어에 올리는 과정이니 App Store Connect를 선택하고 다음 버튼을 누른다.
      
  
    
Upload를 선택하고 다음으로 이동한다.
      
  
    
기본으로 설정된 체크박스를 그대로 두고 다음 버튼을 누른다.
      
  
    
이 단계에서 우리가 가지고 있는 인증서를 선택해서 Bundle 파일에 서명한다.
      
  
    
마지막으로 나온 결과값을 확인하고 Upload한다.
      
  
    
upload되면  appstoreconnect.apple.com TestFlight 탭에서 확인할 수 있다. 아직은 처리중으로 기다리면 올릴 수 있는 상태로 변경된다.
      
  
    
appstoreconnect.apple.com 좌측 상단에 있는 플러스 버튼을 클릭해서 새로운 버전을 만든다.
중간을 이동하면 빌드라는 공간에 방금 올린 Bundle파일을 올릴 수 있다.
      
  
    
상단에 변경사항을 간단하게 작성(업그레이드된 사항 7자 이상 작성하기)하고 저장을 하고 심사를 위해 제출 버튼을 누르자.
      
  
    
애플에서 심사를 진행하고 승인이 되면 자동으로 플레이스토어에 올라간다. 심사는 최대 일주일이 걸린다고 한다.
      
  
    
👋 Outtro
혼자서 공부를 하고 배포하려니까 많이 힘들어서 작성하였다. 나뿐만 아니라 혼자서 고생하는 많은 분들께 도움되길 바란다.
RN 개발기
IOS Signing(인증서) 제대로 알고 사용하기
살짝 읽어보기
앱 개발 유용한 Firebase 기능
살짝 읽어보기
React Native Webview 개발기
살짝 읽어보기
App과 Web 통신하기
준비중
fastlane으로 간편하게 앱(Android, IOS) 테스트 배포하기
준비중
PlayStore(플레이스토어) + AppStore(앱스토어) 배포
현재 페이지

PlayStore(플레이스토어) + AppStore(앱스토어) 배포

댓글