Xcode 12 for Beginners

IOS

What is Xcode?

Xcode is the Mac app that you use to build apps for iOS, macOS, tvOS and watchOS. You use Swift programming, and the many tools inside Xcode, to build applications for iPhone, iPad, Mac, Apple TV, and more.

Xcode is an IDE, an Integrated Development Environment, which essentially means that Xcode includes many additional tools for development. A few examples are: a debugger, source control, device management, iPhone Simulator, profiling tools, Interface Builder, documentation, and much more.

Minimum system requirements for Xcode 12:

  • A Mac with macOS 11 (Big Sur)
  • 4 GB RAM, but 8+ GB is more comfy
  • At least 8 GB of free storage space†
  • A 2013-2015 or newer Mac, MacBook, iMac or Mac mini

Xcode only runs on macOS, which means you need a Mac if you want to build iOS apps with Xcode. Xcode won’t run on iPad. A few alternatives for Windows/PC are available, but they’re far from ideal.

Powerful Combo: Xcode and SwiftUI

Xcode is upgraded once a year, around Sept-Oct, at the same time the new major version of iOS is released. Every update of Xcode brings improvements, new features, bug fixes, and access to the latest SDKs. Throughout the year, a number of smaller updates to Xcode are made, including updates for Swift.

A notable newcomer in Xcode is SwiftUI. With SwiftUI, you can declare the User Interfaces (UIs) of your iOS apps, and their behavior. It’s the new way to build UIs – and it changes how we think about building User Interfaces for iOS apps.

An exciting aspect of SwiftUI is that you can use Swift programming to build User Interfaces. Here’s a quick example:

struct ContentView: View {
    var body: some View {
        Text("Hello worl!")
    }
}

The above code declares a view, which will put that well-known Hello worl! text on screen. Up to this point, you’d create a Storyboard-based view controller to show anything on screen in your iOS app. You can build those view controllers with Interface Builder (see below).

Coding a UI with code is novel and exciting, but it’s also slated to be more productive. On top of that, you can now commit UI code with Git — without merge conflicts — and that wasn’t possible before.

SwiftUI is new, and although it’s publicly released as production software, it’ll need to go through an adoption phase before becoming the new defacto standard to build UIs. It’s likely that SwiftUI will see an adoption curve similar to Swift in 2014, i.e. slow but steady growth.

Until SwiftUI takes over Storyboard-based UIs, it’s important to learn to work with view controllers and storyboards, as well as with SwiftUI. Moreover, SwiftUI integrates well with existing UIKit-based views and libraries, which means that UIKit-based views remain relevant for considerable time. It’s smart to learn both approaches.

At A Glance: How To Use Xcode

Let’s take a look at Xcode! First, make sure you’ve started Xcode on your Mac. You’re greeted with Xcode’s Welcome Screen:

Xcode Welcome Screen

Here’s what you can choose to do:

  • Start a new playground to code Swift
  • Create a new Xcode project, like building an iOS app
  • Clone an existing project from a Git repository
  • Open any of your latest projects, on the right

You can also open any other project with the button in the bottom-right, or choose to hide the Welcome Screen next time Xcode starts. If you’ve got many Xcode projects, just opening them via Finder might be more productive.

Next, when you open an iOS app project in Xcode, you see something like this:

Xcode Overview

Let’s go over the Xcode UI one by one. First, we’ve got 4 major areas in Xcode:

  1. On the left, you see the Navigators. They help you locate resources in your Xcode project, such as Swift files, issues, breakpoints, and more.
  2. In the middle, you see the Editor. This is where the magic happens! You write Swift code here. (In Interface Builder, the middle part is where you build UIs. More on IB, below.)
  3. On the right, you see the Inspectors. They help you inspect and adjust attributes of files, UI elements, etcetera. Inspectors are the most useful in Interface Builder.
  4. At the bottom, you see the Debug Area. You use this area to debug your app; to see debug output, and what’s going on if your app crashes or has a bug. Debugging is an important aspect of app development.

Xcode’s UI also has a few other useful bits and bobs, such as:

  • At the top right you see a Play and Stop button, and a dropdown item next to it. With these buttons you can build your app, after which it starts running on the given target. In other words, first select “iPhone 11 Pro”, then hit Play, and your app starts in iPhone Simulator. Neat!
  • At the top, in the middle, you see a status bar. With it, Xcode will tell you what it’s doing. It’ll also inform you about errors in your project.
  • At the top-right, you’ll see a few buttons that let you show or hide parts of Xcode. If you want to focus on some Swift code, you can hide the left and right panes, for example. The + button is the Library, which includes Swift code snippets (and more, in Interface Builder). The button with the two arrows enables Xcode’s Code Review mode, which lets you compare Swift files side-by-side.
  • The code editor in Xcode has two neat functions: a breadcrumb, and a minimap. The minimap is a global outline of your code, and it works like a scrollbar. The breadcrumb, or jump bar, helps you navigate the hierarchy of your project. You can also use it to jump to a particular function or class. And the < and > buttons on the left let you go back or forward to a previous file, like in a web browser.

Products You May Like

Leave a Reply

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