Navigation

Building an iOS To-Do Client

Deployment Type:
Client:

    Author: MongoDB Documentation Team

    This tutorial walks you through building an iOS app that uses Stitch for the backend, and enables users to create and maintain to-do lists.

    Time required: 20 minutes

    What You’ll Need

    If you have not yet built the To-do backend app, follow the steps in this guide.

    Check Your Environment

    Check to see if your environment has everything it needs:

    • MacOS 10.13 (High Sierra) or later.
    • Xcode 10.0+ and Swift 4.2+.

    Procedure

    A. Download the Application Source Code

    Estimated Time to Complete: ~2 minutes

    1

    Download the code.

    Clone the Stitch github example repository, or download the zip file for the repo and unzip it.

    The source code for the To-Do iOS application can be found in the todo-ios-1 directory.

    2

    Install the pods.

    This project uses CocoaPods to manage dependencies, which means you need to install the pods before building the project. To do so, follow these steps:

    1. In a terminal window, navigate to the todo/ios directory.
    2. Run pod install to install the project dependencies.

    Update your Pod repo

    If you experience problems installing pods or building the app, you may need to update your pod repo by running pod repo update, and then running pod update.

    3

    Open the project.

    Open the workspace file ToDoSync.xcworkspace:

    open ToDoSync.xcworkspace
    

    B. Configure the Application

    1

    Initialize the App Client

    You will now add the code needed to initialize the StitchAppClient. The StitchAppClient class provides all of the functionality for your app to communicate with the Stitch backend, including accessing the Authentication providers and Atlas service.

    To initialize the StitchAppClient, you will call the initializeAppClient() function and pass in the ID of your Stitch backend app. In the TodoSync/appDelegate.swift file, uncomment line 9 and add the code to instantiate a StitchAppClient object that points to your Stitch app.

    When complete, your code should look like the following:

    import UIKit
    import StitchCore
    import StitchRemoteMongoDBService
    
    private let todoListsDatabase = "todo"
    private let todoItemsCollection = "items"
    private let todoListsCollection = "lists"
    
    let stitch = try! Stitch.initializeAppClient(withClientAppID: "my-todo-qwet")
    

    Important

    Be sure to replace <APP_ID> with the ID of ytour Stitch backed ap. In the Stitch console, you can find your App ID at the top of the left side navigation, below the app name.

    2

    Initialize a RemoteMongoClient

    You will now add the code needed to Instantiate a RemoteMongoClient object, which provides connectivity support to Atlas. Do do this, call the serviceClient() method on the mongoClient object, passing in the remoteMongoClientFactory and the name of your MongoDB service.

    Note

    By default, the MongoDB service in Stitch is named “mongodb-atlas”. If you provided a different name when setting up your Stitch backend, be sure to use that name here.

    When complete, your code should look like the following:

    // TODO:
    // 2. Instantiate a RemoteMongoClient
    let mongoClient = try! stitch.serviceClient(fromFactory: remoteMongoClientFactory,
       withName: "mongodb-atlas")
    
    3

    Create a RemoteMongoCollection

    You now need to create a RemoteMongoDatabase object to point to the todo database, and then create a RemoteMongoCollection object that points specificallty to the items collection. Your code will then use the RemoteMongoCollection for all CRUD operations against the collection.

    When complete, your code should look like the following:

    // 3. Set up the items collection
    itemsCollection = mongoClient
       .db(todoDatabase)
       .collection(todoItemsCollection, withCollectionType: TodoItem.self)
    
    4

    Set up Sync

    The Swift SDK enables syncing data changes between MongoDB Mobile and Atlas. Your client code specifies which documents it wants to track and how to handle any conflicts and errors that arise. You specify the ConflictHandler, ErrorListener, and ChangeEventDelegate handlers that Sync will call. Stitch then uses change streams to watch for changes and notify registered clients when a change occurs.

    In the TodoSync/TodoTableViewController.swift file, uncomment lines 193 - 196 to configure Sync on the items collection. Note that we’re using a custom ChangeEventDelegate and ErrorListener:

    // Configure sync to be remote wins on both collections meaning and conflict that occurs should
    // prefer the remote version as the resolution.
    itemsCollection.sync.configure(
       conflictHandler: DefaultConflictHandler<TodoItem>.remoteWins(),
       changeEventDelegate: ItemsCollectionDelegate(self),
       errorListener: self)
    
    5

    Run the todo app

    From the top menu bar, go to Product and select Clean. You can now run the app.

    Summary

    Congratulations! You now have a working to-do app!