iOS App Guide

Zesty.io Open Source ATOM Plugin Start Trial
Search…
iOS App Guide
Maintaining an iOS App can be extremely difficult and tricky. App Review times are typically 1-2 days and require excessive developer input (when all that's really being changed is an image or a string). Zesty.io allows developers to write their code once, and let marketers update the content continuously.
In this tutorial I'll be walking you through how to setup your Zesty.io instance and iOS App to allow the iOS App to get data from the Zesty.io instance.
Setting up the Zesty Instance
Creating the Instance
First, we'll need to create an instance (if you haven't already).
Creating the Instance
Any template will work, and in this example we'll be using the Bootstrap Template.
Choosing Zesty Template
Configuring the Content
Once we open up the manager, we'll need to configure the content that we'll load from our iOS App.
Go to Config and create a Set of Content Entries. Call it Coupons
Creating the Set
Next, we'll add a few fields to load in, a Text Field called name, and a TextArea Field called description.
Set Config
While we're here in the Config tab, we'll enable Basic JSON Endpoints by going to Site Settings -> Sitewide Settings -> Developer and clicking the right options.
Instance Settings
After saving, go to Content and we'll add an entry to our Coupons Dataset
Adding a New Entry
Now that our Zesty Instance is created, we can start making our iOS App!
Making the iOS App
In order to make an iOS App, you'll first need to download Xcode, which also means that you'll need a Mac. After installing Xcode, you can move onto the next step, which involves actually creating the app and getting it setup.
Setting up your project and installing libraries
Open up Xcode and Create a New Xcode project (if you don't see this option, ⌘ ⇧N should also work).
For our purposes, we'll just create a Single View App (but you can choose any option you want for your project)
Creating a Single View App
Call it whatever you'd like, and for the Organization Identifier, Apple typically recommends using a reverse domain id, so if your domain is example.com, enter in com.example. This will make sure you have a proper Bundle ID created.
Settings for new App
Hit Next, then create the project wherever you'd like. Additionally, if you'd like to use source control (Git [Github/Bitbucket], etc), make sure to specify that now.
Once you create your project, we're going to install some libraries.
We'll be using Cocoapods, which is an open source package manager for iOS Applications. Cocoapods will make sure that your project works properly, and it will also allow you to use the library that we created to streamline using Zesty in your product.
To do this, we'll need to create a Podfile
Go to File -> New -> File...
Creating a new file
Choose Other -> Empty
File Type
Call it Podfile, and store it at the base of your project directory, alongside your .xcodeproj file
Where to put Podfile
Inside Podfile, paste in this code: (and replace iOS Tutorial App with the name of your Xcode Project Name
source 'https://github.com/CocoaPods/Specs.git'
platform :ios, '10.0'
use_frameworks!
​
target 'iOS Tutorial App' do
​
    use_frameworks!
​
    pod 'ZestySwiftContentEndpointWrapper', '~> 0.2.0'
        pod 'SwiftyJSON', '~> 4.0'
​
  target 'iOS Tutorial AppTests' do
      inherit! :search_paths
      # Pods for testing
  end
​
  target 'iOS Tutorial AppUITests' do
    inherit! :search_paths
    # Pods for testing
  end
​
end
Save it, then close Xcode and open up the Terminal.
We'll now install the pods that we just specified in the Podfile
First, to install cocoapods, open up your terminal (Can be found in Launchpad or Spotlight) and enter in the following commands:
For macOS 10.11 and above (El Capitan+)
sudo gem install -n /usr/local/bin cocoapods --verbose
pod setup --verbose
For macOS 10.10 and below
sudo gem install cocoapods --verbose
pod setup --verbose
Sidenote: the --verbose flag is included so you can see the progress of each command, as these commands usually take a while to run.
Now, after Cocoapods has been installed, we'll navigate to your project's directory.
Note: If you're unfamiliar with terminal commands, simply open up a terminal window , type in cd, then hit space. Then drag the folder from Finder to the terminal and hit enter.
Once you've navigated to the directory, run pod install and sit back and watch all the libraries install. While they install, here's a quick overview what's being installed
ZestySwiftContentEndpointWrapper : This Cocoapod allows easy retrieval of your Zesty data / endpoints without any hassle
Running Pod Install
After running pod install, you may notice that an .xcworkspace file was created. This is now going to be the file that you open up when you want to work on your app. This is how Cocoapods integrates the libraries into your project.
Open up your xcode workspace (just double click on the .xcworkspace file in finder), and Build your project (⌘B). This will complete the setup of your Cocoapods. You may get an error about Code Signing. This is easily fixed, you simply need to add a team in your project settings.
Important: You must use the .xcworkspace file to make use of the Zesty Library!
Pulling Data from Zesty.io
Now that everything has been setup, we can pull our data from Zesty!
We'll start by creating the UI For our Project. Open up Main.storyboard from the side menu, and drag a UITableView object from the objects inspector into the view controller. (For Xcode 10, the inspector is located on the top)
Adding the table view
After adding it, click on the table view, then the Constraints Inspector on the bottom, and set the following Constraints (0 on all edges)
Constraints
After this, hold the control key and drag from the table view to the view controller symbol (2 times). Select Data Source and Delegate.
Linking the table view
Next, we'll need to link the tableview to our view controller. Click the Two Circles Icon on the top right,
Two Circles Icon
and control drag the tableview to create a new outlet. Call it tableView.
Creating an outlet
After all of this, we can close the second window (there should be an X), and open up ViewController.swift
Change the contents of ViewController.swift to look like the below code:
import UIKit
import ZestySwiftContentEndpointWrapper
​
class ViewController: UIViewController, UITableViewDataSource, UITableViewDelegate {
​
    @IBOutlet weak var tableView: UITableView!
    var zesty: ZestySwiftContentEndpointWrapper!
    var items: [[String: String]] = []
​
    override func viewDidLoad() {
        super.viewDidLoad()
        // Do any additional setup after loading the view, typically from a nib.
​
        self.zesty = ZestySwiftContentEndpointWrapper(url: "REPLACE WITH ZESTY PREVIEW DOMAIN")
        self.getData()
    }
​
     /// Call this function whenever you want to look for new data
    func getData() {
        self.zesty.getArray(for: "REPLACE WITH ARRAY ZUID") { (array, error) in
            if error == nil {
                self.items = array
                self.tableView.reloadData()
            }
        }
    }
​
    func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        return self.items.count
    }
​
    func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
        let item = self.items[indexPath.row]
        let cell = UITableViewCell(style: .subtitle, reuseIdentifier: "SubtitleCell")
​
        cell.textLabel?.text = item["name"]
        cell.detailTextLabel?.text = item["description"]
​
        return cell
    }
​
​
}
A few things to note:
When we create the ZestySwiftContentEndpointWrapper, we need to specify a domain. For development purposes, we recommend using the Zesty-Provided Preview Domain.
In our getData() function, we need to specify the array zuid of the dataset we created, Coupons.
We can figure this out by going back to our Content or Config page, and looking at the url when we've selected coupons
Where the zuid is
Other location of the zuid
After filling in those details, run your project on the iOS Simulator (⌘R), and see the magic happen!
The Final Product
Final Product
Next Steps
Now that you know how to use the BasicJSONAPI with iOS / Swift, you can do incredible things!
I recommend checking out the example ZestyBurger iOS App for a more complex example, which uses the getCustomJSONData functions that the library provides.
Swift
React Ruby Build Guide
Last modified 3yr ago
Export as PDF
Copy link
Outline
Setting up the Zesty Instance
Creating the Instance
Configuring the Content
Making the iOS App
Setting up your project and installing libraries
Pulling Data from Zesty.io
The Final Product
Next Steps