How does xcode work

A target contains instructions to build one product. Examples of products include libraries, frameworks, test bundles and the app itself. To the very left of the Xcode window is the Navigator where you have quick and easy access to all of the content within your project. You can use the Navigator selector bar to select a navigator. You have many available to you. And because we have the project navigator selected, you can use it to add, delete group, or otherwise manage all of the files that exist within your project.

On the very right is the Inspector and it provides with you contextual data about the contents of your editor. Because we have the Source Editor open, you can view information about the file that's being displayed such as the file name and the file path.

The top section is a toolbar. And here, you'll find the Run button which will build and run your product. The Stop button will terminate the current action in progress. The next two drop-down menus are the Scheme and the Run Destination.

A scheme a sharable file that contains rules for our how app will be built, run and tested. The Run Destination is where you will run your app. You can choose to run your app in a simulator for a device such as the iPhone XR which is what we're doing up here. You can run it on your Mac or a connected device such as an iPhone or an iPad. The last three buttons are the Show and Hide buttons which will show and hide different sections of the Xcode window.

And these can come handy. For example, if you're developing code and you need more space in the editor, you can use the right mouse button to close the Inspector and provide yourself with that extra space in the editor.

Xcode Help is an amazing resource for learning about Xcode. And we highly recommend that you browse through it on your own.

So now that we walked through the layout of the Xcode window, let's go ahead and create an actual project from scratch. So in front of you is the Welcome to Xcode Window. And on the left, you have the option to create a new project which will store all of your files and resources for your app. You can also clone an existing project that may be hosted on the source control account such as GitHub.

And finally, you can also open up a Xcode Playground which allows you to experiment with your Swift code and then see the result of that code in real time. On the right are all of the projects that we've been recently modifying, and so we have quick and easy access to them. I'm going to go ahead and create a new project in Xcode.

This will open up the template selector. Templates are starting points for our app. And there are a variety of templates that are available for us to use. In order to pick the right template, we need to start out by identifying the platform we're developing for. And I know I'm writing an iOS app. So I'll go ahead and click on the iOS tab. Within this tab, you'll notice that there are two categories of templates available such as the Application templates and the Framework and the Library templates.

For the purpose of this session though, I'm going to go ahead and select an Application template and I'm going to pick the simplest one which is the Single View App and I'll click Next. So my teammates and I have decided we want to build a meditation application. And we've decided to call it Mind. So for the Product Name, I'm going to enter in Mind.

For the Organization Name, typically, I would put in the name of my organization, but for the purposes of this session, I'm going to call ourselves Example Team. So in this case, it is com. Finally, the Bundle Identifier is autofilled and it is a unique ID for your app within Apple's ecosystem.

It is a combination of the Product Name and the Organization Identifier. Because as developers, we want to be in the habit of constantly testing our code.

We'll show you later how to add unit tests. So after you click Finish, it will open to Save sheet. Here, I can decide where I want to save my app.

It defaults to the Desktop and I'm happy with that. So I'll leave that as is. But one thing that I do want to ensure is that Source Control is available from the very beginning of this project so that I can manage, track and backup any changes that I make during the development process. So we have our template setup now. We can add an app icon to our app. App icons are the images that a user will select whenever they want to launch our app.

App icons are assets. Examples of assets include images and colors. Assets are managed and organized by an asset catalog and we can access that asset catalog through the Navigator by clicking on it. And because we want the catalog for our app icon, let's go ahead and click on the app icon and the editor. And you'll notice from the catalog that you can have assets for Notifications, Settings, Spotlight as well as the app itself. So I have an app icon sitting on my desktop.

It's ready to be used. And I have device that uses 2X resolution. So app icon-- assets are available for 1X, 2X and 3X resolution depending upon the device you use. So I'm going to ahead and grab this app icon and drag it into the 2X catalog box for the iPhone app. Now, I want to test my app icon to make sure that it actually works. So to do that, I want to run it in a simulator for the iPhone XR.

This will launch the simulator. And you'll notice that the simulator goes about launching my app immediately. I know this because it's displaying Hello World and that's what my template is set up to do. So I need to go to the Hardware Menu to actually see my app icon in the home screen.

So I'll go to the Hardware Menu and click on Home. This will bring me to the home screen and I see my app icon is there. If I click on app icon, my app comes back into the foreground. So great, I know that my app icon works. I can terminate execution of the simulator. And now, we're at a good point where we can commit and save our changes so that our colleagues Holly and Honza can continue developing on this app-- on this project.

To do that, we first need to add a GitHub account. We can do that through Xcode Preferences which you can access from the Xcode Menu and then going to Preferences. Xcode Preferences lets you customize Xcode for your needs. And in order to add an account, we'll go ahead and ago to the Account Preference Pane and click on the Plus button.

You'll see that there are a variety of accounts that are available to us. So now it's asking me for my account credentials so I am going to go ahead and type in my account name and my password.

So it's signed in to my account which is great, so I'll go ahead and close Xcode Preferences. And now, I need to make the actual commit. This will open up the commit sheet. And here you can verify all of the changes you made and you can add a commit message to let your colleagues know what you changed. So for the commit message, I'll say that this commit will add an app icon. And I'll click commit which will close the commit sheet. So now to get to this point in our development, we started out by creating a project using Xcode.

We then chose a template that was appropriate for our platform. We added an app icon to our asset catalogue and then we used Xcode source control functionality to commit our changes so that our colleagues could continue developing on our project. To learn more about Source Control we recommend that you check out the Source Control Workflows in Xcode talk from Now we're at a point where we can start adding actual meditation functionality to our app.

And to do that, I'm going to invite up my colleague Holly. Thank you. Thanks, Prachi. And welcome to the Source Editor. This is where you will write all of the code for your app. To the left of the Source Code we have the line numbers, and to the right of the code we have the mini map which shows you a miniature view of the file in the editor for navigation. Above the source code we have the Jump Bar. The Jump bar also helps you navigate the file in the editor using the function popup.

We are already making great progress on building our meditation app. Let's have a look at where we're headed. We are building a meditation app that allows users to select a duration and meditate for that amount of time. When the meditation is over, the app will write the user's mindful minutes back to their health data. We'll need to add quite a bit of Swift code to get our app working. But instead of trying to read the code that I write, I want you to focus on the tools that Xcode provides to aid the editing process.

And if you're new to Swift, welcome. To get started with Swift, I recommend going through the Swift guided tour which is available online or in an Xcode Playground so that you can experiment with the Swift code as you walk through the tour. This resource is available on docs. And with that, let's head over to Xcode. I added some code to the project template that Prachi showed us to implement timing of meditation and drawing a peaceful background for the app.

We still have to implement a UI for selecting a meditation duration and for starting the meditation. We also have to implement the class that interacts with HealthKit. To get our app up and running really quickly, I implemented a mock HealthStore that does not interact with HealthKit and we'll implement the real HealthStore later. So here, we're looking at the ContentView. While building the UI for your app, Xcode can show you a preview of what your UI will look like on an interactive Canvas.

Create new requests, see a queue of pull requests ready for your review, and quickly view, build, and test results generated locally or by Xcode Cloud. Comments that your teammates make on code during review display inline within the code editor, along with the name and avatar of the reviewer. Jump into a comparison view of any two versions of your source code, in any editor, while retaining your current editing context.

Apps are code-signed using an Apple-hosted service that manages all of your certificates, making App Store submission easier and more reliable. Just sign in to Xcode using your Apple ID, and your Mac is configured for development and deployment based on your membership roles and permissions. The always-visible bottom bar shows useful information, such as line and column, and offers direct access to quickly compare different versions of code.

Many common key combinations and editing modes familiar to Vim users are supported directly within the code editor, using the new bottom bar to show mode indicators. This new simulator for Mac offers complete control over screen size, resolution, and variable input methods, so you can test your CarPlay experience across many different car platforms. Or you can work with your code and UI layout side by side. You can further customize your environment by opening multiple windows and multiple tabs per window.

When Xcode notices a mistake, the source code editor highlights the error and when possible, offers to fix it. Xcode speeds up your typing with intelligent code completion. Reduce your typing further with ready-to-use code snippets and source file templates, either the ones provided or ones you add. With Swift, playgrounds let you experiment with code without building and running your app. For more information on playgrounds, see Playground Help.

You can easily configure the source editor to display multiple views of the same file or to view multiple related files at once. Search-and-replace and refactoring operations help you make extensive changes to your code quickly and safely.

With these and other capabilities, Xcode makes it easier for you to write better code faster than you thought possible. Use Interface Builder to create the user interfaces of your iOS, watchOS, or OS X apps by assembling windows, views, controls, menus, and other elements from a library of configurable objects, or from ones you create.

Use storyboards to specify the flow of your app and the transitions between scenes. Then graphically connect the objects and transitions to your implementation code.

With the Auto Layout feature, define constraints for your objects so that they automatically adjust to screen size, window size, and localization. You can create a new Group and then drag your files into them to organize your project a little bit. You can also right click on the Project Navigator and create new files or add existing files to your project. Or you can drag folders or files from your computer directly onto the Project Navigator and will popup a dialog asking how you want to add the files.

If you click on a file in the Project Navigator, it will display the contents of that file in the Editor Area so that you can edit that file. Hitting these keys is going to switch to the Search Navigator to perform a project-wide search.

This really helps when you need to make a change in multiple places in a project. It will also show yellow Warnings in the issue navigator. This is where all the coding, configuration and user interface building happens. If you want to show line numbers in the gutter to the left of the editor, you can enable line numbers in the Xcode preferences.

The Dark theme can also be enabled in the preferences. There are these little back and forward arrows in the upper left corner of the editor area. These guys are actually pretty useful. They act like the back and forward buttons on your browser and they let you navigate to previously viewed files. Another way to quickly get to the file you need is to use the Jump Bar. Just hit Command-F to bring up a search popup in the upper right corner that will look for whatever you type in within the current file.

This is also a great way to jump to various areas of your file. You can also use this popup to do replacements within your file. A breakpoint is an Xcode debugging feature that lets you pause the execution of code at a specific line of code. The breakpoint gutter where the line numbers are is where you can click to set breakpoints at certain lines of code.

To turn off a breakpoint, just click the blue indicator again and it will dim out. If you want to completely remove the breakpoint, you can click and drag the blue indicator off of the breakpoint gutter.

The root node of the project navigator is your Xcode project file indicated by the blue icon. If you click that, the project properties will open in the editor area.

In this screen, you can configure things like:. Storyboards are interfaces built with visual drag and drop in the Editor Area using Interface Builder. SwiftUI was released in late September as a new way to build user interfaces by writing code. Xcode 11 has a special Preview Canvas pane that shows your user interface change in real time as you write the code to modify your user interface.

Most of my tutorials are based on Storyboards because it was the easiest way for beginners to grasp. If you chose Storyboards as your UI building option when you created the Xcode project, then your project will have a file called Main. These elements are things like buttons, sliders, labels and textfields.

You can drag and drop them onto the view but in order to size and position them, you need to use the Auto Layout system. For example, you might add a constraint saying that an element should be 20pt below the element above it. I have an introduction video to the Xcode Auto Layout system here:. With enough constraints in place, the Auto Layout system has enough information to lay out the user interface.

However, having too many constraints may result in conflicts where two or more constraints have opposing demands.

The visibility of the Document Outline can also be to toggled with this small button in the lower left corner of Interface Builder:. It looks like a two pane view. Each pane also has independent jump bars, so you can also use that to change what file each pane is displaying. For more practice using Storyboards, check out my beginner series on YouTube.

Note that it needs at least macOS The File Inspector is the first tab in the Utility Area and it shows details about the current highlighted file in the File Navigator.

Information such as the physical location of where the file is on your hard drive and other file properties:. The Quick Help Inspector shows you documentation about the method, class or keyword that your typing cursor is currently on.

Suffice to say, this inspector will draw a blank unless your typing cursor is in the code editor over a valid method, class or keyword. The left-most button is the run button. This will build and run your application and launch your app in the iOS Simulator. The button beside it will stop the execution of your application and return you to Xcode.

Profile to measure various aspects of your application such as performance, memory usage and more. The dropdown beside the Stop button indicates which build target you want to run your can run an Apple Watch target too and you can also choose if you want to run it under the iPhone or iPad simulators or different version if you have them installed.

The status bar will show you what Xcode is currently doing. The debug area will show you console output and the state of various variables when you run your application. I have a detailed guide on how to deploy your app on an iOS device. An Xcode Playground is a light weight editor for you to try out some code.

This brings up a separate window where you can do various activities related to your app in the App Store. An archive is what Xcode calls a build of your app. Selecting one of your archives will give you an option to do various things with it, including sending it to the App Store.

These three sections in the Organizer will show you various metrics collected from your app being used by real users. This information is really valuable to use for improving your app in regards to making it more robust less crashing and more efficient using less resources. If this guide helped you, please let me know by leaving a quick comment below.

Talk soon! Oh man did you hear the announcement from Apple? New Airpod Pro! Great explanation, thanks for sharing such informative and valuable blog post so keep posting. Thanks for your all your efforts with keeping us up to date with the latest! I really appreciate it! I have recently updated my Xcode to 11, and I am also learning Xcode so please bear with me.

Trying to follow along on your youtube channel. Just created the project and cannot located main.