Building Your App On App Center

In my previous (and first) blog post on App Center I talked about getting started, adding the SDK to your code, and looking at Analytics and Crash reporting.  In this post I’d like to discuss building your app on App Center; which allows you to distribute your app to Beta testers and others.

There are a few steps in setting up and configuring your build process, but once done, building is as simple as pressing a button (or, even simpler, you can set it up to build on every push to your source control!)

Your Code In A Repository

To get started, return to App Center, where we have an iOS and an Android version of our app.  Unfortunately, building these requires separate (and different) configurations.  This is a result of the different requirements imposed by Apple and Google.

Before you can begin, you need to have your application in source control using one of VSTS, GitHub or BitBucket.  I use all three, but tend to put my personal code in BitBucket as they have unlimited (free) private repositories.

 

 

Build Configuration

Let’s start with the iOS application.  In the App Center click on your iOS application named appcenterdemo that we created in the previous post.  Next, click on the Build selection on the left side of the page.

You will be asked to pick from the three repositories, and then to pick your application, and finally to pick the branch you want to work with (typically Master).  That will bring you to the Brnaches page, where you will see your latest checking.  Click on that and you will see a screen indicating that you have not yet configured the branch.  To do so, click on Configure build.

This brings you to the Build Configuration page.  Here you have a number of choices to make.  Let’s take them one by one.  First, check that you have the right project.  Be sure to click the drop down to ensure you have the right version (you want AppCenterDemo.sln).

Next set the configuration.  In this case, you want Ad-Hoc as you’ll be distributing this to Beta Testers.

I generally leave the Mono version and XCode version as I find them.

We don’t have a build script at this point, so leave that as none.

You now come to one of the most important settings: Build type.  You have two choices, Device or Simulator  Since we are distributing to Beta Testers who want to run this app on their phone, choose Device Build.

You next decide on how frequently you want to build: on every push to the repo or on demand. Let’s choose On Demand (“Manually choose when to run builds”) for now.

I do set Automatically increment build number.  If you do, you’ll see a drop-down where you can decide whether to use a Build ID or a timestamp.  The timestamp can be meaningless to the user, but the Build ID can cause enormous confusion as Beta Testers may not distinguish between the Build ID and the release version.  Your call.

I leave Environment Variables off.

Uh oh, now we have to sign the build (because we said we want to run on devices).  We need two files: a provisioning profile and a certificate (p12 file).  The steps to building these are not trivial but they are not terribly difficult either.

Provisioning

Key to provisioning an iOS application is having an Apple Developer Account (which costs $99/year).  Once you do you can go to https://developer.apple.com/account.   There you can sign in and choose Certificates, Identifiers & Profiles.

Under Certificates (in the menu on the left) choose Production.  Click the + to add a new Certificate.   Under Production (not Development) choose App Store and Ad Hoc, and click on Continue.  You will come to a page called About Creating a Certificate Signing Request (CSR).  Follow the excellent directions provided.

Once done, click continue and follow the directions to upload your CSR (press the Choose File button and select the file you just saved).  Click Continue.

Congratulations! Your certificate is ready.  Download it to your mac and double click on it to install it into your Keychain.  Note the directions to save a backup somewhere secure.

It is a good idea to open KeychainAccess and make sure your certificate is there.  Turn down the triangle to see that your private key is there as well.

Once again, turn to the menu on the left, and choose App Ids under Identifiers. Click on the + to create a new one and call it AnyJesseLibertyApp (substituting your own name, if you like).

Scroll down to the App Id Suffix and check the Wildcard App Id radio button.  In the Bundle ID put an asterisk *  and click continue.  Review your App ID and click Register. Revel in your IOS App ID and then click Done.  You should now see it in your list of App Ids.

Provisioning Profile

Turn to the menu on the left once again, and this time click Distribution under Provisioning Profiles.  Click + to create a new one.  Under Distribution choose Ad hoc and click continue.  Pick the App ID you just created from the drop down, and then click continue.  Next, select the certificate you created earlier in this process (if there is more than one, check the date).  Click continue.

You may be asked to select devices to include in the provisioning profile.  Select as you see fit, and click continue.

Now it is time to give your provisioning profile a name.  Set it to AppCenterDemoProfile or whatever you like, and click continue.

 

 

Download your provisioning profile and keep it somewhere safe.

P12

All you need now is your P12 file, and that is pretty easy.  Open KeyChain Access and make sure login is selected in the top left menu.  Click on My Certificates in the Category menu and find the distribution certificate you created earlier.  Be careful not to select the Phone Developer version; you want the iPHone Distribution Certificate.

Turn down the triangle to expose the private key, and highlight both. Right click and select Export 2 Items.   Navigate to where you saved your certificate and click Save.  A dialog will pop up asking for a password.  You can leave that blank and click OK.

Another dialog will appear asking for your login password.  Enter that and click Always Allow or Allow.  Hey! Presto! you now have a P12 file.

Back to Configuring Your Build Page

Let’s return to App Center. Drag your mobile provision file into place, and click Save.  You did it!  Your build is configured.

You should now see your last commit.  Click Build now and bang! your build will be queued and then it will build, right in front of your eyes.

While it is running there will be a blue circle in the upper left of the build window, with three dots animated to show you it is doing something.  When it is done, you’ll see one of three circles

  • A gray circle with a line through it indicating that you cancelled the build
  • A dreaded red circle with an x, indicating that your build failed
  • A wonderful green circle with a check mark, indicating your build succeeded

 

If your build succeeded, you are ready to distribute, which is the topic of my next blog entry.

About Jesse Liberty

Jesse Liberty is the Principal Mobile Developer with IFS Core. He has three decades of experience writing and delivering software projects. He is the author of 2 dozen books and a couple dozen Pluralsight & LinkedIn Learning courses, and has been a Senior Technical Evangelist for Microsoft, a Distinguished Software Engineer for AT&T, a VP for Information Services for Citibank and a Software Architect for PBS. He is a Xamarin Certified Mobile Developer and a Xamarin MVP and a Microsoft MVP.
This entry was posted in App Center, Essentials, Xamarin and tagged , . Bookmark the permalink.

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.