react native(리액트 네이티브) ios 배포하기

2023-01-17

apple, deploy, frontend, ios, native, react, react native, 리액트 네이티브, 배포

Views: 518

시작하기

ios 배포를 하기 위해서는 ios 개발자 계정이 필요합니다.
애플 개발자계정은 apple developer에서 등록할 수 있습니다.
개발자 멤버쉽을 구매해야하는데 1년에 129,000원정도 합니다. 1년마다 만료가 되기때문에 1년이 되기전에 갱신을 해주어야 합니다.
아이폰, 아이패드 등의 애플기기가 있어야만 등록이 가능합니다. 멤버쉽을 구매하고 며칠을 기다려야 승인이 나옵니다. 저는 승인이 될때까지 6일정도 걸렸습니다.
반면에 안드로이드는 한번 구매하면 평생 무료입니다.

애플 개발자 로그인

애플 개발자 계정 생성 부분은 생략하겠습니다.

xcode 프로젝트 배포 설정
Certificates, Identifiers & Profiles
App Store Connect 앱 추가
xcode로 업로드
TestFlight로 확인
개인정보처리방침
App Store Connect에서 앱 배포
심사제출

1. xcode 프로젝트 배포 설정

ios/[파일명].xcworkspace 파일을 열고 xcode general 탭에서 빌드 버전을 명시해줍니다.

xcode 빌드 버전 작성

appicon사이트에서 아이콘을 넣으면 자동으로 사이즈에 맞춰서 만들어줍니다. 만들어진 아이콘을 다운로드 받습니다.

xcode로 돌아와서 images/AppIcon으로 들어가면 아이콘을 넣을 수 있는 공간이 나옵니다.
아까 받은 사이즈별 앱아이콘을 드래그해서넣어줍니다.
favicon

2. Certificates, Identifiers & Profiles

애플의 Certificates 사이트로 들어가서 서명을 추가해줍니다. 이후 development.cer파일은 저장해서 잃어버리지 않도록 합니다.

Certificates

3. App Store Connect 앱 추가

App Store Connect 사이트로 들어가면 앱을 추가 할 수 있는 페이지가 나옵니다. 추가해주도록 하겠습니다.

App Store Connect

추가 버튼을 클릭하면 다음 폼이 나옵니다. 작성해주도록 합니다. 마지막 부분의 SKU는 제품의 고유번호라고 생각하면 쉽습니다. 자유롭게 작성해주면 됩니다.

신규 앱추가

생성 완료

4. xcode로 업로드

생성이후 하단으로 스크롤을 내려보면 빌드 섹션이 보이는데, 거기서 업로드 도구 보기를 클릭하면 업로드하는 방법을 알수 있습니다.

업로드 방법
업로드 하는 방법으로는 세가지가 있는데, 저희는 이중에서 첫번째 xcode로 업로드를 해보려고 합니다.

xcode로 돌아옵니다.
xcode의 Product > Archive를 선택해줍니다.
archive

빌드를 기다리고 나면, 다음과 같은 창이 나옵니다.

Distribute App

Distribute App버튼을 눌러줍니다.
다음 이미지부터 이미지 처럼 선택을 해주고 다음으로 넘어가 주시면 됩니다.

app store connect

upload

automatically manage signing

정보를 잘 확인해줍니다. 이후 업데이트를 누르면 업데이트가 진행됩니다.

detail

upload

업로드가 완료되면 TestFlight로 확인해봅니다.

5. TestFlight로 확인

TestFlight에서 확인 했는데 다음과 같은 경고가 나오면 파란색 관리 버튼을 눌러줍니다.

수출 규정 관련 문서가 누락됨

암호화를 사용하지 않을 경우 체크 부분에서 암호화 없는 선택메뉴를 선택해주면됩니디.

제출 준비 완료

앞으로도 암호화를 사용하지 않을 예정이면 info.plist에서 다음 코드를 입력해줍니다.

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
<plist version="1.0">
<dict>
 <key>ITSAppUsesNonExemptEncryption</key>
 <false/>
 <!-- ... -->