30 Days From Learning to Launching a Swift App on Apple Vision Pro

I have a confession to make: I’ve tried multiple times to learn iOS development and each time I’ve failed.

Let’s rewind to 2007. The very first iPhone was just released. When it initially came out, there was no App store or way to create apps. Apple’s workaround was simple: just build everything as a website (as long as there’s no Adobe Flash).

A year later in 2008 the App Store launched and developers could start creating apps using Objective-C.

I graduated college in 2005 and was working my first job making websites. In a few years I went from PHP to ColdFusion to ActionScript to Ruby on Rails. In each case I was building for the web – not for mobile.

When the App Store launched, I had to made a career decision: do I continue trying to learn how to build for the web and become really good at Ruby, do I try to switch to iOS development (from scratch), or try to do both.

I think many people have a point like this in their learning journey. They don’t learn something new until they need it. My jobs used web technology and I didn’t need to know iOS development.

There were a few times I tried to learn iOS development. I took the Stanford iOS course and learned some Objective-C basics. I read Head First iPhone and iPad Development and gained a better understanding of how components communicate. I took a course on iOS development at a local community college (and even made some friends). I worked on multiple Code School courses about Objective C and iOS development. I even went to WWDC and was even interviewed by a Brazilian newspaper with my coworkers Eric and Jon.

Throughout all of this I never dedicated the time needed to get good as iOS development.

Over the years I’ve set goals for myself to learn more about iOS development but each time I don’t dedicate enough time to make an impact. I’ve told myself that anything I create isn’t going to be as good as what seasoned developers can make. Or that a new solo dev can’t compete with people with a decade of expererience.

The sad part is if I’d continued learning a decade ago, that’d be me!

As part of my goal to make my 40s my best decade ever, I want to break out of this pattern and learn how to build apps using Swift. With the release of the Apple Vision Pro, I’m more excited about Swift development than I’ve ever been before.

I have no idea what the future holds for AR and VR, but in my gut I feel it’s a new medium that’s going to revolutionize the way we interact with computers – similar to how the iPhone did. I don’t imagine that’ll happen immediately, or even with the current iteration of AR/VR, but when it does I want to be able to build the apps that I dream about on it.

With that in mind, I’ve decided to keep a learning journal of my experience learning SwiftUI development with the goal of building apps for the Apple Vision Pro in 2024.

My goal is to ship an app on the Apple Vision Pro in February (!). Let’s go! 🙌

Day 1: January 28, 2024

Where to start! There’s no shortage of iOS development resources out there. Many educational resources start at the very beginning, which would be perfect for people wanting start from scratch.

I’ve never programmed in Swift before. Initially I thought, “OK, I’ll learn Swift first”. I watched a few Swiftful Thinking videos and quickly realized this is too basic for what I’m looking for. Swift as a language isn’t anywhere near as confusing as Objective-C.

Next step: let’s look for a course to start learning SwiftUI!

The two courses I found that looked the most promising are Design+Code and Kodeco. Kodeco was formerly raywenderlich.com, which has been a pillar in iOS education for a decade. Back at WWDC I even went to a party they threw!

Before jumping into a paid course, I decided to check out what the official Apple resources were for learning how to build apps. I was fortunate to stumble on the Sample App Tutorials, which were exactly what I was looking for!

Starting with the About Me app, these tutorials are amazing. You download a sample application that you can run locally. The website goes through the code file by file explaining the key parts and giving recommendations on some parts I can change to see how it impacts the app.

This was an ideal app to learn the basics. It’s a navigation bar, 4 static pages and some content that’s set in a single source of truth. Super straightforward and understandable from the code and description alone. This one showcases a bunch of concepts:

Navigation Tabs
Horizontal and Vertical stacks for organizing content
Text and Images
Looping over arrays
Scrollviews
Performing an action when a button is clicked
Various other styling options for corner radius, padding, fonts, aspect ratio and more.

A very solid start that already opens up a bunch of possibilities.

The next app they showcase is the Choose Your Own Story app. This one uses a NavigationStack to create a “choose your own adventure” story. You’re presented with a story and a number of choices for your next step. Clicking on one takes you to the next page by pushing a new view on the NavigationStack.

As a web developer, I’ve always wondered how some apps have a separate history for each tab in their navigation (like Letterboxd for example). Turns out the answer is that each tab likely has their own NavigationStack. That explains why clicking on a new tab clears the back button, and yet clicking back to a tab brings you to the last view you clicked on in that stack. 💁‍♂️

One thing I don’t fully understand is where an app starts. 🤔

Day 2: January 29, 2024

Before starting today I went back and started this blog post. I’ve found that when I write about what I’m learning I end up retaining much more of it. Might as well learn and share while I’m at it!

Before jumping to the next sample project, I wanted to figure out why the start file for the two projects was different. I noticed that the start files have a @main decorator and extend from App.

@main
struct AboutMeApp: App {
    var body: some Scene {
        WindowGroup {
            ContentView()
        }
    }
}Code language: Swift (swift)

On to the next project: Date Planner! This application is a nested todo app. You create a new Event with multiple todos associated with it. This app touches on a bunch of new concepts.

One concept I’ve interacted with a bunch in other apps is a List. A list contains rows components, each of which can be swiped left for additional actions (like delete). Recreating this kind of interaction in JavaScript would be a pain, yet in Swift it’s just this:

ForEach(eventData.sortedEvents(period: period)) { $event in
    NavigationLink {
        EventEditor(event: $event)
    } label: {
        EventRow(event: event)
    }
    .swipeActions {
        Button(role: .destructive) {
            eventData.delete(event)
        } label: {
            Label("Delete", systemImage: "trash")
        }
    }
}Code language: Swift (swift)

These few lines do a lot! The EventRow is the component that shows up each row of the List. When the row is clicked, the EventEditor component is shown. And lastly you can swipe left to see the delete action. Here’s what that ends up looking like.

I learned a bunch from this app. The List, View and swipe controls are all concepts I’d love to implement on a native Hardcover App.

Day 3: January 30, 2024

To start, I realized I didn’t read everything about the Date Planner project. That made me realize that the view on the iPad was completely different than the iPhone app. Looking at the code to understand this I’m still a little fuzzy on how this is done, but it’s good to have an example of how it works.

The next app, Organizing with Grids, is simple in comparison with only two files (whew, I needed that after the 13 files from the last one). This one showcases a grid and updating the current state to change the title color based on what’s clicked. It’s simple, but it’s a good example of how grids work.

The grid from Organizing with Grids is hardcoded to be a single column. Editing Grids makes this concept dynamic with a Stepper.

One concept that I wish React.js had that was used in this demo used is the idea of an @binding variable:

@Binding var symbol: Symbol?Code language: JavaScript (javascript)

This allows a variable to be passed into a component, it to be reassigned in that component then for the calling context to get that updated value. So, a two-way binding.

Day 4: January 31, 2024

Day 6: February 2, 2024

It’s time: I picked up my Apple Vision Pro!

Ever since I watched the Hyper Reality video years ago, I’ve been excited about the possibilities offered by augmented reality.

Building an app for the AVP is one of my top motivations to work on this now.

I did the demo at the Apple store, which showcased some immersive videos and instructions on how to interact with the device. If you end up getting the device yourself, you can watch the same video from the AppleTV app, but the spatial video examples are only available through the demo.

Today we had some friends coming over for a party, and took the opportunity for everyone to go through a demo of their own. 😂

The results were a lot of people saying “wooooow”.

Day 7: February 3, 2024

Continued reading through more sample swift code from the Apple website. I think I’ve finished everything from the Sample Apps section that’s relevant to the type of apps I’m hoping to build.

Day 8: January 4, 2024

Through the AVP Subreddit I joined the Apple Vision Pro Discord. I found some recommendations on apps. One that I’d love to see is a way to share or find spatial videos. The ones in the demo were incredible, but I haven’t been able to find many other examples.

Day 9: February 5, 2024

I tried an experiment today of working on Hardcover using the Apple Vision Pro and posting about in realtime on Mastodon.

You can read the full thread if you’re curious. The takeaway was that everything was possible, but I was about 75% as productive and 100% more exhausted after 3 hours.

As far learning goes, I decided to switch from Apple’s sample code to videos with Kodeco. I watched the first course in the SwiftUI path, Your First iOS & SwiftUI App: An App from Scratch. It was a very gentle introduction without lingering on the basic syntax.

I ended up watching a bunch of these lessons from the AVP while my wife slept on my lap. 🤗

Day 10: February 6, 2024

Met up with a developer I found from the AVP Discord with the idea of building a YouTube for Spacial Videos.

I registered the spacial.tube and spacial.garden domains for this, but not sure if I’ll use either. For now I setup a Rails site on here from a template that’s a YouTube clone from a starter codebase.

Day 11: February 7, 2024

More developers are involved in the project now – we’re up to 6 in fact! Moved from space.tube to spacetube.app, as a Next.js app landing page.

Day 12: February 8, 2024

Had the kickoff meeting for the group of us building SpaceTube. We’re aiming to launch something by early March 2024.

I’ll be mostly working on the backend, but this’ll be a great chance to understand how the SwiftUI side works as it’s built out by some developers with a lot more experience than my 11 days. 😅

From a technical standpoint, the app will be a SwiftUI app for the Apple Vision Pro, using Supabase for the database, and Next.js for the few backend actions and a landing page. I initially put it in Rails, but this tech stack means less code overall – and less that any one person has to support.

There’s a Swift library for Supabase that’ll allow us to read and write directly from it.

Day 13: February 9, 2024

Someone joined the Hardcover Discord interested in creating an iOS app. We’re going to work together and build something while we’re learning. 🙌

They shared two in depth articles about Swift design that I was able to understand about 40% of.

Day 14: February 10, 2024

Spent most of today working on non-iOS stuff: SpaceTube newsletter setup and and updating this blog post.