Welcome to iOS 17 Programming for Beginners. I hope you will find this a useful introduction to creating and publishing iOS 17 apps on the App Store.

In this chapter, you’ll download and install Xcode on your Mac. Then, you’ll explore the Xcode user interface. After that, you’ll create your first iOS app and run it in Simulator. Finally, you’ll run your app on an iOS device.

By the end of this chapter, you will know how to create an iOS app, how to run it in Simulator, and how to run in on an iOS device.

The following topics will be covered in this chapter:

• Downloading and installing Xcode from the App Store
• Exploring the Xcode user interface
• Running your app in Simulator
• Running your app on an iOS device

To do the exercises for this chapter, you will need the following:

• An Apple Mac computer (Apple Silicon or Intel) running macOS 13 Ventura or macOS 14 Sonoma
• An Apple ID (if you don’t have one, you will create one in this chapter)
• Optionally, an iOS device running iOS 17

The Xcode project for this chapter is in the Chapter01 folder of the code bundle for this book, which can be downloaded here:

https://github.com/PacktPublishing/iOS-17-Programming-for-Beginners-Eighth-Edition

Check out the following video to see the code in action:

https://youtu.be/T-0fMJj2vq8

You’ll start by downloading Xcode, Apple’s integrated development environment (IDE) for developing iOS apps from the App Store, in the next section.

Xcode is Apple’s IDE for developing macOS, iOS, iPadOS, watchOS, tvOS, and visionOS apps. You’ll need to download and install Xcode prior to writing your first app. Follow these steps:

1. Choose App Store from the Apple menu.
2. In the search field in the top-right corner, type Xcode and press the Return key.
3. You’ll see Xcode in the search results. Click Get and then click Install.
4. If you have an Apple ID, type it in the Apple ID text box and enter your password when prompted. If you don’t have one, click the Create Apple ID button and follow the step-by-step instructions to create one:

   

   Figure 1.1: Apple ID creation dialog box

   You can see more information on how to create an Apple ID using this link: https://support.apple.com/en-us/HT204316#appstore.

5. Once Xcode has been installed, launch it. You’ll see a License Agreement screen. Click on Agree:

Figure 1.2: License agreement screen

6. You’ll be prompted to enter your Mac’s administrator username and password. Once you have done so, click OK:

Figure 1.3: Prompt for administrator username and password

7. You’ll see a screen showing you the available development platforms. You just need macOS and iOS for now. Leave the settings at their default values and click on Download and Install:

Figure 1.4: Development platforms screen

8. If you are using an Apple Silicon Mac and have not yet installed Rosetta, which allows Intel-based Mac apps to run on Apple Silicon Macs, you’ll be prompted to install it now. Click on Install:

Figure 1.5: Rosetta prompt

9. You’ll see a What’s New in Xcode screen. Click on Continue:

Figure 1.6: What’s New in Xcode screen

10. You’ll see the Welcome to Xcode screen. Click on Create New Project... in the left-hand pane:

Figure 1.7: Welcome to Xcode screen

11. Xcode will start to download iOS 17.0 Simulator automatically. Note that you will not be able to run any apps on Simulator until this process has been completed:

Figure 1.8: Simulator download progress bar

12. You’ll see the new project screen as follows. In the Choose a template for your new project: section, select iOS. Then choose App and click Next:

13. You’ll see the Choose options for your new project: screen:

    

    Figure 1.10: Choose options for your new project: screen

    Configure the options as follows:

    • Product Name: The name of your app. Enter JRNL in the text field.
    • Organization Identifier: Used to create a unique identifier for your app on the App Store. Enter com.myname for now. This is known as reverse domain name notation format and is commonly used by iOS developers.
    • Interface: The method used to create the user interface for your app. Set this to Storyboard.
    • Include Tests: Uncheck this check box.

    Leave the other settings at their default values. Click on Next when done.

14. You’ll see a Save dialog box. Choose a location to save your project, such as the Desktop or Documents folder, and click on Create:

Figure 1.11: Save dialog box

15. You’ll see a dialog box saying Git Repository Creation Failed. Click on Fix.

    The reason why you see this dialog box is because the Source Control checkbox in the Save dialog box was ticked. Apple recommends that Source Control be turned on. Source Control is outside the scope of this book but if you wish to learn more about version control and Git, see this link: https://git-scm.com/video/what-is-version-control.

16. You will see the Source Control screen as follows:

Figure 1.12: Source Control preference screen

Enter the following information:

• Author Name: Your own name
• Author Email: Your email address

Close the Source Control screen by clicking the close button in the top-left corner when done. The Xcode main window will appear.

Fantastic! You have now successfully downloaded and installed Xcode and created your first project. In the next section, you will learn about the Xcode user interface.

You’ve just created your first Xcode project! As you can see, the Xcode user interface is divided into several distinct parts, as shown here:

Figure 1.13: Xcode user interface

Let’s look at each part in more detail. The following description corresponds to the numbers shown in the preceding screenshot:

• Toolbar (1) – Used to build and run your apps, and view the progress of running tasks.
• Navigator area (2) – Provides quick access to the various parts of your project. The Project navigator is displayed by default.
• Editor area (3) – Allows you to edit source code, user interfaces, and other resources.
• Inspector area (4) – Allows you to view and edit information about items selected in the Navigator area or Editor area.
• Debug area (5) – Contains the debug bar, the variables view, and the Console. The Debug area is toggled by pressing Shift + Command + Y.

Next, let’s examine the toolbar more closely. The left side of the toolbar is shown here:

Figure 1.14: Xcode toolbar (left side)

Let’s look at each part in more detail. The following descriptions correspond to the numbers shown in the preceding screenshot:

• Navigator button (1) – Used to display and hide the Navigator area.
• Stop button (2) – Only appears next to the Run button when the app is running. Stops the currently running app.
• Run button (3) – Used to build and run your app.
• Scheme menu (4) – Shows the specific scheme to build your project (JRNL) and the destination to run your app on (iPhone SE (3rd generation)).

  Schemes and destinations are distinct. Schemes specify the settings for building and running your project. Destinations specify installation locations for your app, and exist for Simulator and physical devices.

• Activity view (5) – Displays the progress of running tasks.

The right side of the toolbar is shown here:

Figure 1.15: Xcode toolbar (right side)

Let’s look at each part in more detail. The following descriptions correspond to the numbers shown in the preceding screenshot:

• Xcode Cloud button (1) – Allows you to sign in to Xcode Cloud, a continuous integration and delivery service built into Xcode
• Library button (2) – Displays user interface elements, code snippets, and other resources
• Inspector button (3) – Used to display and hide the Inspector area

Don’t be overwhelmed by all the different parts, as you’ll learn about them in more detail in the upcoming chapters. Now that you are familiar with the Xcode interface, you will run the app you just created in Simulator, which displays a representation of an iOS device.

Simulator is installed when you install Xcode. It provides a simulated iOS device so that you can see what your app looks like and how it behaves, without needing a physical iOS device. It can model all the screen sizes and resolutions for both iPad and iPhone so you can test your app on multiple devices easily.

To run your app in Simulator, follow these steps:

1. Click the Destination pop-up menu to view a list of simulated devices. Choose iPhone SE (3rd generation) from this menu:

Figure 1.16: Xcode Destination pop-up menu with iPhone SE (3rd generation) selected

2. Click the Run button to install and run your app on the currently selected simulator. You can also use the Command + R keyboard shortcut.
3. Simulator will launch and show a representation of an iPhone SE (3rd generation). Your app displays a white screen, as you have not yet added anything to your project:

Figure 1.17: iOS Simulator

4. Switch back to Xcode and click on the Stop button (or press Command + .) to stop the currently running project.

You have just created and run your first iOS app in Simulator! Great job!

Now, you may be wondering what the Devices and Build sections in the Destination menu are used for. Let’s look at them in the next section.

Understanding the Devices and Build sections

You learned how to choose a simulated device in the Destination menu to run your app in the previous section. In addition to the list of simulated devices, this menu also has Devices and Build sections.

These allow you to run apps on actual iOS devices and prepare apps for submission to the App Store.

Click the Destination menu in the toolbar to see the Devices and Build sections at the top of the menu:

Figure 1.18: Xcode Destination menu showing Devices and Build sections

If you have an Apple Silicon Mac, the Devices section will display text stating My Mac (Designed for iPad), because Apple Silicon Macs can run iOS apps. Otherwise, No Devices will be displayed. If you were to plug in an iOS device, it would appear in this section, and you would be able to run the apps you develop on it for testing. Running your apps on an actual device is recommended as Simulator will not accurately reflect the performance characteristics of an actual iOS device and does not have hardware features that actual devices have.

The Build section has two menu items, Any iOS Device(arm64) and Any iOS Simulator Device (arm64, x86_64). These are used when you need to archive your app prior to submitting it to the App Store. You’ll learn how to do this in Chapter 27, Testing and Submitting Your App to the App Store.

Now let’s see how to build and run your app on an actual iOS device. Most of the instructions in this book do not require you to have an iOS device though, so if you don’t have one, you can skip the next section and go straight to Chapter 2, Simple Values and Types.

Although you’ll be able to go through most of the exercises in this book using Simulator, it is recommended to build and test your apps on an actual iOS device, as Simulator will not be able to simulate some hardware components and software APIs.

In addition to your device, you’ll need an Apple ID (used to automatically create a free Apple developer account) or a paid Apple developer account to build and run your app on your device. You can use the same Apple ID that you used to download Xcode from the App Store. To run your app on an iOS device, follow these steps:

1. Use the cable that came with your iOS device to connect your device to your Mac, and make sure the iOS device is unlocked.
2. Your iOS device will display a Trust This Computer alert. Tap Trust and key in your device passcode when prompted.
3. Your Mac will display an Allow Accessory to Connect alert. Click Allow. Your iOS device is now connected to your Mac and will appear in Xcode’s Destination menu.

   You can view connected devices by choosing Window | Devices and Simulators in the Xcode menu bar.

4. In the Destination menu, note that your iOS device has Developer Mode disabled by default:

   

   Figure 1.19: Xcode Destination menu showing iPhone with Developer Mode disabled

   Developer Mode was introduced by Apple during their World Wide Developer Conference in 2022 (WWDC 2022), and is required to install, run, and debug your apps on devices running iOS 16 or greater.

   To watch a WWDC 2022 video on Developer Mode, click this link: https://developer.apple.com/videos/play/wwdc2022/110344/.

5. If you attempt to build and run your app on your iOS device, you will see the following alert:

Figure 1.20: Alert showing Developer Mode is not turned on

6. To enable Developer Mode on your iOS device, go to Settings | Privacy & Security, scroll down to the Developer Mode item, and tap it.
7. Turn the Developer Mode switch on:

Figure 1.21: Developer Mode switch

8. An alert will appear to warn you that Developer Mode reduces the security of your iOS device. Tap the alert’s Restart button.
9. After your iOS device restarts and you unlock it, confirm that you want to enable Developer Mode by tapping Turn On and entering your iOS device’s passcode.
10. Verify that the (Developer Mode disabled) text no longer appears next to your iOS device in the Destination menu:

Figure 1.22: Xcode Destination menu with an actual iOS device selected

11. Wait for Xcode to finish indexing and processing, which will take a while. Once complete, Ready will be displayed in the status window. Your iOS device is now ready to install and run apps from Xcode.
12. Run the project by clicking the Run button (or use Command + R). You will get the following error in Xcode’s Signing & Capabilities pane, Signing for “JRNL” requires a development team:

    

    Figure 1.23: Xcode Signing & Capabilities panel

    This is because a digital certificate is required to run the app on an iOS device, and you need to add a free or paid Apple Developer account to Xcode so the digital certificate can be generated.

    Using an Apple ID to create a free developer account will allow you to test your app on an iOS device, but it will only be valid for 7 days. Also, you will need a paid Apple Developer account to distribute apps on the App Store. You’ll learn more about this in Chapter 27, Testing and Submitting Your App to the App Store.

    Certificates ensure that the only apps that run on your device are the ones you authorize. This helps to protect against malware. You can also learn more about them at this link: https://help.apple.com/xcode/mac/current/#/dev60b6fbbc7.

13. Click the Add Account... button:

Figure 1.24: Xcode Signing & Capabilities pane with Add Account… button selected

14. The Xcode Settings window appears with the Accounts pane selected. Enter your Apple ID and click Next:

    

    Figure 1.25: Apple ID creation dialog box

    Note that you can create a different Apple ID if you wish using the Create Apple ID button.

    You can also access the Xcode settings by choosing Settings in the Xcode menu.

15. Enter your password when prompted. After a few minutes, the Accounts pane will display your account settings:

Figure 1.26: Accounts pane in Xcode preferences

16. Close the Settings window when you’re done by clicking the red close button in the top-left corner.
17. In Xcode’s Editor area, click Signing & Capabilities. Make sure Automatically manage signing is ticked and Personal Team is selected from the Team pop-up menu:

Figure 1.27: Xcode Signing & Capabilities pane with account set

18. If you still see errors on this screen, try changing your Bundle Identifier by typing some random characters into it, for example, com.myname4352.JRNL.
19. Everything should work now when you build and run, and your app will be installed on your iOS device. However, it will not launch, and you will see the following message:

Figure 1.28: Could not launch “JRNL” dialog box

5. This means you need to trust the certificate that has been installed on your device. You’ll learn how to do this in the next section.

Trusting the Developer App certificate on your iOS device

A Developer App certificate is a special file that gets installed on your iOS device along with your app. Before your app can run, you need to trust it. Follow these steps:

1. On your iOS device, tap Settings | General | VPN & Device Management:

Figure 1.29: VPN & Device Management setting in iOS Settings

2. Tap Apple Development:

Figure 1.30: Apple Development section in Device Management settings

3. Tap Trust “Apple Development:

Figure 1.31: Trust button

4. Tap Trust:

   

   Figure 1.32: Trust dialog box

   You should see the following text, which shows the app is now trusted:

   

   Figure 1.33: Apple Development section with trusted certificate

5. Click the Run button in Xcode to build and run again. You’ll see your app launch and run on your iOS device.

Congratulations! You have successfully run your app on an actual iOS device!

In this chapter, you learned how to download and install Xcode on your Mac. Then, you familiarized yourself with the different parts of the Xcode user interface. After that, you created your first iOS app, selected a simulated iOS device, and built and ran the app in Simulator. Finally, you learned how to connect an iOS device to Xcode via USB so that you can run your app on it.

In the next chapter, we’ll start exploring the Swift language using Swift Playgrounds, and learn how simple values and types are implemented in Swift.

Learn more on Discord

To join the Discord community for this book – where you can share feedback, ask questions to the author, and learn about new releases – follow the QR code below:

https://packt.link/8hBmp