Setting Up Firebase: Free iOS Development Tutorial

Topics Covered in This IOS Development Tutorial:

Creating a Firebase App, Adding Dependencies, Connecting to Firebase, Testing the SDK, Connecting the Model & View Controller with Firebase

Exercise Overview

In the last exercise, we updated our application to work with the MVC design pattern and set it to be based on a single datasource. This is great, but there’s still one more factor in getting our app to be ready for the real-world: interaction with “the Cloud.” In this lesson we are going to learn how to:

• Interact with a web service
• Create a back-end to store our data
• Parse data from the cloud for display in our application

Getting Started

1. If you completed the previous exercise you can skip the following sidebar. We recommend you finish the previous exercises (1B–4A) before starting this one.

   If you completed the previous exercise, Jive Factory.xcodeproj should still be open. If you closed it, re-open it (from yourname-iOS Dev Level 2 Class > Jive Factory).

   If You Did Not Complete the Previous Exercises (1B–4A)

   1. Close any files you may have open and switch to the Desktop.
   2. Navigate to Class Files > yourname-iOS Dev Level 2 Class.
   3. Duplicate the Jive Factory-Real World Setup Done folder.
   4. Rename the folder to Jive Factory.
   5. Open Jive Factory > Jive Factory.xcodeproj.

Creating a Firebase Account

Firebase is a web service that is owned by Google and is designed to allow developers to more easily create and interact with REST Web services. Firebase does all the heavy lifting for you. They maintain the web servers and databases and provide you with easy to use libraries for speeding up your development process.

1. At the time of this writing, Firebase requires that users sign up/in with a Google-related account. If you don’t already have one, go to accounts.Google.com/signup and create a Google account before moving on.

2. Go to firebase.Google.com

   NOTE: The following Firebase interface description was correct at the time of this writing, but later updates may cause your console to look different.

3. Click the SIGN IN button at the top right.
4. In the sign in prompt that appears, enter the email associated with your Google account and click Next.
5. In the field that just appeared, enter your email password.
6. Click Sign in.

7. In the top right, click Go to Console.

Creating a Firebase App

Each project you create in Firebase is a dataset that you can interact with via mobile, desktop, or web applications. Let’s create a project.

1. Click Add Project.
2. Under Project Name type: Jive Factory
3. Click Continue.
4. You will be asked if you want to add Google Analytics to your project, toggle the button to Disable Google Analytics for now, and click Create Project.

5. Firebase will start to create your project, when it is done, click Continue.

   You will be redirected to your project’s console.

6. On the home page, you should be able to select the iOS button under “Get started by adding Firebase to your app”.
7. In the dialog that opens you will need to enter the Apple bundle ID from your app. To get your Bundle Identifier, do the following:
   • Switch to Xcode.
   • In the Project navigator, click on the Jive Factory project name (not the folder).
   • Click on General at the top.
   • Next to Bundle Identifier, copy (Cmd–C) the text (com. YourName. Jive-Factory).
   • Return to Firebase in your browser and paste (Cmd–V) the text.
8. Click Register app.

9. You will be asked to Download GoogleService-Info.plist. Click it!

   A file named GoogleService-Info.plist will now be automatically downloaded to your computer. We need to add this to our Jive Factory project.
10. As the on-screen instructions describe, locate GoogleService-Info.plist in your Downloads folder.

11. With Xcode visible, drag GoogleService-Info.plist to the Project navigator, dropping it under the existing Info.plist.

    

12. In the dialog that opens make sure Copy items if needed is checked on and click Finish.

Adding Dependencies

Now we need to add the dependencies required by Firebase. Dependencies are libraries of code that another library needs to run. Remember back to an earlier exercise when we imported MapKit? That was a dependency that we added to the project.

We will use Swift’s built-in package manager, which allows developers to easily add libraries and dependencies to projects. It is commonly the case that you may want to use one library, but because it is dependent on other libraries, you’ll need to add (and maintain) them as well in order for the one library to work. Swift Package Manager helps simplify things for developers who want to install a library by maintaining any additional dependencies.

1. In Xcode, navigate to File > Add Packages… At the top right, you should see a texbox asking to Search or Enter Package URL, enter the url given in the Firebase console webpage (https://GitHub.com/firebase/firebase-iOS-sdk).
2. Once Xcode finishes retrieving the dependencies and packages from the URL (may take a while), it will give you an option to choose what dependencies from the URL you would like to add to your project. Right now, we just need the Firebase/Database option, so select that and choose Add Package.

3. You’ll see Package Dependencies show up in the Project navigator.

   Firebase is successfully installed!

Testing the SDK

1. Still in Xcode, open the BandsTableViewController.swift file (in Jive Factory > Jive Factory) and add the following bold code around:

   import UIKit
   import FirebaseDatabase
   
   class BandsTableViewController: UITableViewController {

2. In the viewDidLoad method, add the code shown in bold:

   override func viewDidLoad() {
      super.viewDidLoad()
      bandsModel.fetch() 
   
      FirebaseApp.configure()
      let myRootRef = Database.database().reference()
      // Write data to Firebase
      myRootRef.setValue("Firebase Data")
   
   }

3. Now we want to add some test data to our app. Below the code we added earlier, type the following:

   myRootRef.setValue("Firebase Data")
   
      myRootRef.observe(.value, with: {
         snapshot in
         print("\(snapshot.key) -> \(String(describing: snapshot.value))")
     })

4. Return to Firebase in your browser.
5. Select the Next button until you are asked to Continue to console, select that button.
6. On the left, click on Realtime Database and click the Create Database button.
7. In the Set up database pop-up that comes up, leave the Database Options to the default and select Next.

8. Choose Start in test mode option and select Enable.

   Your database is created!

9. Return to Xcode.
10. In the Project navigator, click on the project folder Jive Factory.
11. We didn’t add the Firebase Analytics framework, but if we choose to in the future, we would need an Apple-provided framework, just like the MapKit. Let’s put it in for the future, under Linked Frameworks and Libraries (at the bottom), click the Add items button .
12. In the Search field start typing AdSupport.
13. In the results, double–click on AdSupport.framework to add it.
14. We should now be connected to Firebase. We’ll run this test.
15. Make sure iPhone 13 Pro is your active scheme, then click the Run button .

16. In Xcode, make sure the console is showing, and note how it now says near the top, -> Optional(Firebase Data)

    This shows you that some data was returned from Firebase.

17. Just to double-check, go back to Firebase in your browser.
18. Click off of Database onto Authentication.

19. Click back on Database.

    Now you’ll see the message: “Firebase Data” next to your app’s unique identifier (something like jive-factory-d1ce2). We know the text has been added to the database and that the app is working!

20. Hover your mouse over the message and press the X button that appears.
21. In the dialog that pops up, click Delete. We’re not going to keep the test data.
22. Return to Xcode.

23. In BandsTableViewController.swift, select all the test code we just added.

    FirebaseApp.configure()
     let myRootRef = Database.database().reference()
    
     // Write data to Firebase
     myRootRef.setValue("Firebase Data")
    
     myRootRef.observe(.value, with: {
        snapshot in
        print("\(snapshot.key) -> \(string(describing: snapshot.value))")
     })

24. Delete the selected code. It’s not needed—it was just there to make sure everything was connected.

25. Save the file and leave the Xcode project open. We’ll continue to work on it in the next exercise.