In the next four chapters, you will create an application named Photorama that reads in a list of interesting photos from Flickr. This chapter will lay the foundation and focus on implementing the web service requests responsible for fetching the metadata for interesting photos as well as downloading the image data for a specific photo. In Chapter 21, you will display all of the interesting photos in a grid layout. Figure 20.1 shows Photorama at the end of this chapter.

Figure 20.1  Photorama

Your web browser uses HTTP to communicate with a web server. In the simplest interaction, the browser sends a request to the server specifying a URL. The server responds by sending back the requested page (typically HTML and images), which the browser formats and displays.

In more complex interactions, browser requests include other parameters, such as form data. The server processes these parameters and returns a customized, or dynamic, web page.

Web browsers are widely used and have been around for a long time, so the technologies surrounding HTTP are stable and well developed: HTTP traffic passes neatly through most firewalls, web servers are very secure and have great performance, and web application development tools have become easy to use.

You can write a client application for iOS that leverages the HTTP infrastructure to talk to a web-enabled server. The server side of this application is a web service. Your client application and the web service can exchange requests and responses via HTTP.

Because HTTP does not care what data it transports, these exchanges can contain complex data. This data is typically in JSON (JavaScript Object Notation) or XML format. If you control the web server as well as the client, you can use any format you like. If not, you have to build your application to use whatever the server supports.

Photorama will make a web service request to get interesting photos from Flickr. The web service is hosted at https://api.flickr.com/services/rest. The data that is returned will be JSON that describes the photos.

Starting the Photorama Application

Create a new Single View Application for the Universal device family. Name this application Photorama, as shown in Figure 20.2.

Figure 20.2  Creating a single view application

Let’s knock out the basic UI before focusing on web services. Create a new Swift file named PhotosViewController. In PhotosViewController.swift, define the PhotosViewController class and give it an imageView property.

import Foundation
import UIKit

class PhotosViewController: UIViewController {

    @IBOutlet var imageView: UIImageView!

}

In the project navigator, delete the existing ViewController.swift.

Open Main.storyboard and select the View Controller. Open its identity inspector and change the Class to PhotosViewController. With the Photos View Controller still selected, select the Editor menu and choose Embed In → Navigation Controller.

Select the Navigation Controller and open its attributes inspector. Under the View Controller heading, make sure the box for Is Initial View Controller is checked.

Drag an Image View onto the canvas for PhotosViewController and add constraints to pin it to all edges of the superview. Connect the image view to the imageView outlet on PhotosViewController. Open the attributes inspector for the image view and change the Content Mode to Aspect Fill.

Finally, double-click on the center of the navigation bar for the Photos View Controller and give it a title of “Photorama.” Your interface will look like Figure 20.3.

Figure 20.3  Initial Photorama interface

Build and run the application to make sure there are no errors.