After long time finally with new post, this time with easy and practical explanation of how to write api clients for applications. In this tutorial we will use Alamofire framework and we will implement simple api client for the open source bookmark service BookmarkIN.

There are many ways for writting api clients, in some examples we can find implemented api call inside the controller or in some examples delegate design pattern is used for executing protocol methods. In this example we will use blocks for returning the result from the api client in the controller where api client is used.

Before we start with our simple project where we will cover implementation of block based api client if you haven’t read previous posts for successful implementation first please check posts listed bellow:

Using UINavigationController component into your iOS App Part One
Using UINavigationController component into your iOS App Part Two
Using UIAlertController component into your iOS App
UITableView Basics Part One
UITableView Basics Part Two

Let’s start.

In Xcode IDE we are starting with creating new Single View Application and also naming our application and setting basic application configuration.

 

 

Your project should look like this after finishing previous step:

 

Because we will use famous networking framework Alamofire first we are initialize Cocoa Pods.

 

In Podsfile we are defining which frameworks and libraries we’ll use, in our case we are using networking framework Alamofire, loading hud dialog SVProgressHUD and JSON manipulation framework SwiftyJSON.

 

After saving the Podsfile configuration we are executing command pod install for installing dependencies in our project.

 

When command pod install finish with execution if everything went ok we’ll see which version form each framework is installed.

 

We open the project by using BookamrkIN.xcworkspace file generated from the Cocoa Pods. In our storyboard we have only one view for autocreated controller ViewController which at the beginning is set as initial view controller.

 

From the Object Library we are taking one Navigation Controller which came connected with one UITableViewController as root view controller.

 

In our example we will delete view connected to our Navigation Controller as root view controller and w’ll connect Navigation Controller with previous View Controller where the View Controller will be connected as root view controller to the Navigation Controller.

 

Because our View Controller will be the first that will be displayed we want to develop one simple login form so we start with dragging components form the Object Library.

First we are starting with UITextField for entering the username.

 

Second component is also UITextField for entering the password and we are checking the box Secure Text Entry. After inserting first two components we will insert also two UIButton components, one for Login operation and one for Register operation.

 

 

 

For each component we are creating IBOutlet.

 

 

And for each button we are creating action that will trigger event Touch Up Inside.

 

 

 

Next from the Object Library we are dragging new ViewController.

 

For our new View Controller we are creating new class with name BookmarksListViewController.

 

 

 

After creating the new class we are setting Identity Inspector custom class name, the name of the class we created.

 

From Object Library we are dragging UITableView in our new View Controller where we’ll list bookmarked items.

 

In Connections Inspector we are connecting components data source and delegate with the View Controller where the component will be used.

 

Next component that we’ll drag from the Object Library is UIButton which we use for displaying UIAlertController with input field for URL entry.

 

For the UITableView and for the UIButton we are creating IBOutlet-s but also for the button we are creating one empty action.

 

The complete storyboard should look like on the image bellow.

 

In our UITableView we’ll drag one prototype UITableViewCell and we’ll configure cell identifier and UITableViewCell Style to Subtitle.

 

 

 

After creating all the views for the application finally we are creating new NSObject class with name ApiConnector which will be our api client.

 

Our simple API Client for the open source bookmarking project BookmarkIN will import networking framework Alamofire and JSON manipulation framework SwiftyJSON. We are defining as static to be Singleton.  Next we define api endpoints as constants. Here we’ll display only one method which is implemented in out client and the rest of the methods which are implemented are in the project on the GitHub.

 

Because endpoints are using Post method we will implement simple method that will send username and password as parameters in dictionary and will return resposne as JSON object.

The first method implemented we will use in our first View Controller with the login form. In this method we can also see how we use loading hud dialog while we are waiting for the API response.

 

The following methods are implemented in the View Controller where we have implemented UITableView for displaying bookmarked items. The first method method is used for calling the api endpoint for creating the bookmark and is triggered on touching the button Add and executing the event Touch Up Inside . In this method we see that we have used UIAlertController with input field for URL entry.

 

For reloading bookmarked items from the backend we are implementing one method that after receiving the bookmarked items as array of dictionaries we are setting in one global array used by the UITableView.

 

If everything is correctly implemented as in example we should see the application running. Assuming that the service is already running we will use default account with username: root and password: root.

 

 

 

Complete source code can be found on my GitHub ready for testing.

Print Friendly

Leave a Comment

Your email address will not be published. Required fields are marked *