Publish Your First iOS App

React Native Publishing to iOS with Expo

Jake Cyr
3 min readOct 6, 2020
Photo by Yura Fresh on Unsplash

Now that you have created your amazing React Native app, let’s deploy it to the Apple App Store so others can download it!

Prerequisites

  • Apple Developer Account Setup (setup one up here)
  • Expo React Native app created
  • Splash screen and app icon created (project/assets folder)
  • Transporter app installed on Mac
  • XCode installed

Building and Publishing

Expo makes it very easy to build and deploy your app to the App Store.

  1. In your project folder, with a terminal window, run the following: expo build:ios
  2. Follow the prompts in the command line using your arrow keys and the ENTER button
  3. When the build finishes, navigate to the Expo link logged in your terminal with the build progress
  4. Click the download button to download your built app .ipa file
  5. Open the Transporter app on your Mac and drag the .ipa file you downloaded from your Finder window to the Transporter window
  6. Click the ‘Deliver’ button to send your app to App Store Connect
  7. When the delivery is done, navigate to App Store Connect in your browser: https://appstoreconnect.apple.com/apps
  8. Login with your Apple Developer account and you should now see your app listed on the ‘My Apps’ page

Your app build is now in processing and will probably take about 20–30 minutes depending on the size of your app. Now would be a good time to grab another cup of coffee ☕ or start on your app store submission.

Screenshots

Now that our app is processing on App Store Connect, we can start uploading our app screenshots. To do this, I’ve found it easiest to first open Simulator on your Mac (must have XCode installed), choosing the device you want to take screenshots for File -> Open Simulator -> iOS ##.# -> Devices, and then in your Expo project running npm run ios. This will run your app on the selected iOS device allowing you to take screenshots with Command + S.

Now you can drag your screen shots into the appropriate device type in your App Store Connect Preparing for Submission page.

Note: sometimes I’ve found the screenshots are a couple of pixels off from what Apple is looking for. In these cases, you can select all of your screenshots in Finder, right click and select Open In -> Preview. Then in preview, click on an image in the sidebar, hit Command + A to select all images, then select Tools and Adjust Size. Here, enter the size Apple is looking for in the error message displayed when you first dragged the images over. After resizing, hit Command + A again to select all images and then Command + S to save all of them with their new sizes. Now you should be able to upload the screenshots without receiving an error.

Test Flight

If you want to test your app on your device or have your friends and family try it out before it is officially released to get feedback, you can navigate to the Test Flight page on App Store Connect. Here you can select a build and designate your testers. You’ll have to download the Test Flight app on your iOS device and enter the redemption code you should have received in your email.

Submission

Enter the remaining submission details for your app, select a build (once it’s done processing) and when you’re ready, click the ‘Submit for Review` button.

Tips

  • If you’re submitting an app after the first time, make sure to increment the version in the app.json file before building
  • Make sure to select the correct Age Restriction title for your app to avoid it being rejected
  • App approvals usually, take about 1–7 days in my experience

Feel free to leave a response if you have any questions and click the 👏 button if you like the article. Don’t forget to follow me so you don’t miss out on future React Native articles!

Other React Native Articles

--

--

Jake Cyr

Proficient in AI and cloud tech, advancing systems development with a commitment to continual growth.