App Store Deployment with Codemagic

You can now integrate FlutterFlow with Codemagic, making app store deployment as simple as a click of a button.
Before deploying your app, we recommend testing your application on a real device. Here are instructions on how to do this.
Prerequisites
Create an Apple account.
​Purchase an Apple Developer membership. Please see this link for more details on the Apple Developer program and how to sign up. 
Set an App Launcher Icon for your app (under Settings & Integrations --> General). The App Launcher icon can't be transparent or contain an alpha channel. 
Create a Bundle Identifier
A Bundle Identifier (ID) is a unique number that identifies your app inside of the Apple ecosystem. 
Please follow these steps to create a Bundle ID:
Open your FlutterFlow project and navigate to Settings & Integrations. Select your Package Name and copy it (Cmd/Ctrl + C).
Open the Apple Developer homepage and select Certificates, IDs & Profiles and then select Identifiers (far left menu).
Click on the Add button (+). 
The Register a new identifier page will open. Select App IDs and then select Continue.
Select App and then click Continue.
Enter the App Bundle Information:
Bundle ID: paste the Package Name that you copied from FlutterFlow. Double-check that the Package Name in FlutterFlow is the same as the Bundle ID. If these are different, errors will occur.
Description: Provide a short description of your app (this will appear in the app store).
Capabilities, scroll down and select the capabilities that are required for your app. For example, if your app uses Apple Sign In - make sure to check the box for Sign In with Apple. If you aren't sure what something is, hover over the information icon to the right of the capability.
When you are done, select Register.
Add A New App To App Store Connect
​App Store Connect is used to submit apps to the App Store, manage apps, and more. 
Please follow these steps to add a new app to App Store Connect:
Navigate to App Store Connect and then select My Apps.
Click on the Add button (+) and then select New App.
A popup will appear. Enter your app information:​
Platform: for mobile apps this will be iOS.
Name: Enter a Name for your app  (this is the name that will show in the App Store).
Primary Language for your app.
Bundle ID: Select the Bundle ID you created in the previous step.
SKU: Enter a unique identifier. You can also add your Bundle ID here, as long as it is unique.
User Access: Set the user access. If you select Limited Access, you will need to select the users that you would like to be able to access this app. This will only appear if you have other users included in your App Store Connect account.
When you are done, select Create. 
You will then be navigated to the main dashboard for your app.
Add Your Apple App ID To FlutterFlow
An App ID is used by Apple to identify your app and associate it with your development team. 
Please follow these steps to add your App ID to FlutterFlow:
From App Store Connect, select My Apps, and then select your app.
Select App Information (under General in the left Sidebar).
Scroll down to General Information and find your Apple ID.
Select the Apple ID and copy it.
Return to FlutterFlow and navigate to Settings & Integrations --> Deployment.
Paste the Apple ID into the box labeled App ID.
Generate Your API Key and Add It To FlutterFlow
Please follow these steps to generate your API Key:
Return to the App Store Connect page. If you have closed this window, navigate to App Store Connect and select Users and Access, and then select Keys (blue text).
If you see the Request Access button, click on it.
If you haven't added any key before, click on the Generate API Key. Otherwise, select the Add button (+).
A popup will appear. Enter your API Key Information:
Name: Enter a name for the key. This is a reference and is not part of the key itself.
Access: Select the access type. This link has additional information on roles.
When you are done, select Generate.
Find the row for the API Key you just generated and select Download API Key. A popup will appear, select Download.
Return to FlutterFlow and navigate to Settings & Integrations --> Deployment.
Under Private Key, select Upload Private Key. Select the API Key File and then select Open.
If you don't see the Download API Key link immediately, refresh your page.
Add Your Issuer ID To FlutterFlow
Navigate to App Store Connect and select Users and Access, and then select Keys (blue text).
Locate the Issuer ID and select Copy.
Return to FlutterFlow and navigate to Settings & Integrations --> Deployment.
Paste the Issuer ID into the box labeled Issuer ID.
Add Your Key ID To FlutterFlow
Return to the App Store Connect page. If you have closed this window, navigate to App Store Connect and select Users and Access, and then select Keys (blue text).
Find the row for the API Key you just generated and select Copy Key ID.
Return to FlutterFlow and navigate to Settings & Integrations --> Deployment.
Paste the Key ID into the box labeled Key ID.
Deploy To The App Store
You can deploy directly from FlutterFlow or from your GitHub repository.
Deploy From FlutterFlow
Deploy From GitHub
Please follow these steps to deploy from FlutterFlow:
From FlutterFlow, navigate to Settings & Integrations --> Deployment. 
Scroll down to find the App Store section and click on the arrow icon on the right to open it. 
Click on the Deploy To App Store.
A popup will appear. Select Deploy. If another deployment is in progress, selecting Deploy will cancel the previous deployment.
A request will be sent to Codemagic to deploy your app to the App Store. Please note: It can take a few minutes for this request to process. Once this step is complete, your Latest Message will change to Submitted.
It can take 30 minutes to several hours for your app to be deployed to the App Store. You can check the status of your deployment by selecting Check Build Status.
Once complete, you will receive an email from App Store Connect that a new build has been added to your app. 
Associating the Github repo allows you to introduce the custom code into your FlutterFlow project. You may want to deploy the modified code directly from your Github repo to App Store.
​
To deploy from Github repo:
If you haven't added the Github repo yet, you can do so using the instructions here.
From FlutterFlow, navigate to Settings & Integrations --> Deployment. 
Find the Deployment Settings section and click on the arrow icon on the right to open it. 
Under the Deployment Source, checkmark the Use Github repo: 'your repo URL'.
Enter the Branch Name of your repo, from which you want to deploy the code. Make sure to enter the correct branch name.
Submit Your App For App Store Approval
From App Store Connect, select My Apps, and then select your app. 
Enter your Version Information. This page contains additional information on what is required, localized and, editable.
When you are done, select Submit For Review.
Your app will now be reviewed by Apple. For additional information on Apple's review guidelines, please see this link.
Common Build Issues And How To Fix Them
Invalid App Store Icon. The App Store Icon in the asset catalog in 'Runner.app' can't be transparent nor contain an alpha channel.
You need to update your App Launcher Icon (under Settings & Integrations --> General) with an image that isn't transparent and/or doesn't contain an alpha channel. 
Last modified 6mo ago