Firebase Dynamic Links: Getting Started

May 24 2021 , Swift 5, iOS 14, Xcode 12 Swift 5, iOS 14, Xcode 12

Learn how to use Firebase Dynamic Links to implement deep linking on iOS. By Danijela Vrzan.

Leave a rating/review
Download materials
Save for later
Share
Contents

Contents

Hide contents

Firebase Dynamic Links: Getting Started

35 mins

Users consume content faster every day and any time they have to spend navigating to your app is time wasted. With Deep links, a single URL can send users directly to your app or even to a specific view within your app.

But what if they don’t have the app installed? That’s covered, too! The link prompts them to install the app from the App Store before continuing with the process.

In this tutorial, you’ll build Raycipe, a simple master-detail view recipe app. During the process, you’ll learn about:

  • Deep links and Universal links.
  • Creating and testing deep links with Firebase Dynamic Links.
  • Handling deep links when users don’t have the app installed.
  • Programmatic navigation to a specific view with SwiftUI.
Note: You need a paid Apple Developer account to set up Firebase Dynamic Links. You can get one here or continue reading to see how Dynamic Links work without implementing them.

Getting Started

Download the starter project by clicking Download Materials at the top or bottom of the tutorial.

Inside starter, open Raycipe.xcodeproj. Build and run. You’ll see something like this:

Screenshot from the simulator showing Raycipe app and a list of recipes on a home view

In Xcode, take a look at the main files:

  • recipe.json contains the app’s data.
  • AppMain.swift is the app’s entry point. All the life-cycle methods go here. It’s also where you’ll initialize Firebase.
  • HomeView.swift is the app’s main view and displays a list of recipes.
  • RecipeDetailView.swift shows detailed information about a selected recipe.
  • DeepLinkHandler.swift is a helper class you’ll use to parse your URL.

Before you start, take a moment to learn about deep linking.

Deep Linking

Developers use Deep links to send users directly to an app instead of a website or store. More importantly, they can send users to a specific in-app view, saving them time they’d otherwise spend locating the content themselves. It improves the user experience and can increase the likelihood of someone installing your app.

Firebase Dynamic Links work on top of Universal Links. They’re specific to the Apple platform introduced with iOS 9 and provide greater security while improving performance.

Using Firebase to set up dynamic links makes implementing deep linking easier.

Next, you’ll learn more about Firebase Dynamic Links.

Firebase Dynamic Links

Firebase Dynamic Links work on Android and iOS regardless of whether the user has your app installed. When you set up a new dynamic link, you can also decide if you want to open a dynamic link only in the browser for a specific platform.

Dynamic link behaviour per platform

Additionally, dynamic links survive the installation process. In the diagram below, you’ll see the process of opening a dynamic link depending on the platform. If a user doesn’t have the app, they’ll see a prompt to install it from the App Store. Then after installation, the app can open and navigate to the linked content.

Diagram showing how the process of clicking a link works if the user has the app installed or not and depending on the platform that link is open

Note: You don’t need a website to implement dynamic links. However, it’s a good idea to have one if you want to open the dynamic link in a browser or encourage more users to download your app.

Setting Up Firebase

Before you implement Firebase Dynamic Links in your app, you need to set up a new Firebase project.

If you already know how to set up a Firebase project and initialize Firebase, do so now. Then skip to Configuring Firebase Project Settings.

To set up your Firebase project, follow the standard set of instructions documented in Firebase Analytics: Getting Started. Start with Setting Up Firebase. Continue with Adding Firebase to Xcode until you reach Editing Build Settings.

Note: The instructions referenced above will, at one point, ask you to check FirebaseAnalytics from the list of available libraries. For this tutorial, you should check FirebaseDynamicLinks instead.

When you finish, come back here and continue reading below.

Configuring Firebase Project Settings

At this point, you’ve set up your Firebase project. But, you’re not ready to use dynamic links yet. You need to add your App Store ID and Team ID to the project settings.

Ideally, you want your dynamic link to point to your app in the App Store so new users can install the app and then continue with the navigation.

If you have an app in the App Store, use your app’s App Store ID. If you don’t have an app already, you’ll use the official raywenderlich.com app. However, you won’t be able to see how links survive the installation process as you’re not navigating to your own app.

If you don’t know how to set them up, continue reading below.

Note: If you already know how to find and add the App Store ID and Team ID to your Firebase project’s settings, do so now. Then, feel free to skip the next two sections and continue with Setting Up Domain for Hosting.

If you don’t know how to set them up, continue reading below.

Setting Up the App Store ID

Before you can use the raywenderlich.com app’s App Store ID, you need to find it. Copy and paste raywenderlich.com app store into your search engine. You’ll see a search result from apps.apple.com:

Image showing a google search result when you type in the raywenderlich.com app store in your search engine

With this approach, you can find the App Store ID for any app on the App Store.

Click the search result and look for the id parameter in the URL:

Image showing how to find the App ID for an app by searching for it in your web browser and looking at the id parameter in the url

The App Store ID for the raywenderlich.com app is 1481444772.

Next, open Firebase console and go to Project Settings. Copy and paste 1481444772 into the App Store ID field:

Image of Firebase project settings window and where to add your App Store ID

Next, you’ll add your Team ID.

Adding Your Team ID

Dynamic links require your Team ID to work. You can find it under Membership Details on the Apple Developer website:

Image showing where to find Team ID in the Apple Developer website under Membership Information

Copy and paste it to the Firebase project settings below your App Store ID.

Next, you’ll set up a domain for hosting.

Setting Up a Domain for Hosting

Before you can use Firebase Dynamic Links, you need to create a custom domain for it.

Note: In the following section, you’ll learn how to set up Firebase Dynamic Links using a custom subdomain on a domain you own. It’s optional, and if you don’t own a domain, you can skip to Creating a Free Firebase Custom Domain.