Firebase Dynamic Links: Getting Started
- Getting Started
- Deep Linking
- Firebase Dynamic Links
- Setting Up Firebase
- Configuring Firebase Project Settings
- Setting Up the App Store ID
- Adding Your Team ID
- Setting Up a Domain for Hosting
- Setting Up Firebase Hosting
- Creating a Firebase-Hosted Subdomain
- Creating a Free Firebase Domain
- Adding Associated Domains in Xcode
- Testing Your Deep Link in Terminal
- Building Firebase Dynamic Links
- Defining the URL
- Using Dynamic Link Builder API
- Shortening the URL
- Seeing Your App in Action
- Interpreting Your Dynamic Link
- Handling the Incoming URL
- Parsing the URL Components
- Using Environment Values
- Handling the Incoming Dynamic Link
- Handling Navigation in Your App
- Where to Go From Here?
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.
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:
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.
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.
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.
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.
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.
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:
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:
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:
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:
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.