Creating a New iOS Social Project
In this article, by Giuseppe Macri, author of Integrating Facebook iOS SDK with Your Application, we will learn about:
With this article, we start our coding journey. We are going to build our social application from the group up.
In this article we will learn about:
- Creating a Facebook App ID: It is a key used with our APIs to communicate with the Facebook Platform.
- Downloading the Facebook SDK: iOS SDK can be downloaded from two different channels. We will look into both of them.
- Creating a new XCode Project: I will give a brief introduction on how to create a new XCode project and description of the IDE environment.
- Importing Facebook iOS SDK into our XCode project: I will go through the import of the Facebook SDK into our XCode project step-by-step.
- Getting familiar with Storyboard to build a better interface: This is a brief introduction on the Apple tool to build our application interface.
Creating a Facebook App ID
In order to communicate with the Facebook Platform using their SDK, we need an identifier for our application. This identifier, also known as Facebook App ID, will give access to the Platform; at the same time, we will be able to collect a lot of information about its usage, impressions, and ads.
To obtain a Facebook App ID, we need a Facebook account. If you don’t have one, you can create a Facebook account via the following page at https://www.facebook.com:
The previous screenshot shows the new Facebook account sign up form. Fill out all the fields and you will be able to access the Facebook Developer Portal.
Once we are logged into Facebook, we need to visit the Developer Portal. You can find it at https://developers.facebook.com/. I already mentioned the important role of Developer Portal in developing our social application.
The previous screenshot shows the Facebook Developer Portal. The main section, the top part, is dedicated to the current SDKs. On the top-blue bar, click on the Apps link, and it will redirect us to the Facebook App Dashboard.
The previous screenshot shows the Facebook App Dashboard. To the left, we have a list of apps; on the center of the page, we can see the details of the currently selected app from our list. The page shows the application’s setting and analytics (Insights).
In order to create a new Facebook App ID, you can click on Create New App on the top-right part of the App Dashboard.
The previous screenshot shows the first step in order to create a Facebook App ID. When providing the App Name, be sure the name does not already exist or violate any copyright laws; otherwise, Facebook will remove your app. App Namespace is something that we need if we want to define custom objects and/or actions in the Open Graph structure. The App Namespace topic is not part of this book. Web hosting is really useful when creating a social web application. Facebook, in partnership with other providers, can create a web hosting for us if needed. This part is not going to be discussed in this book; therefore, do not check this option for your application.
Once all the information is provided, we can move on to the next step. Please fill out the form, and move forward to the next one.
On the top of the page, we can see both App ID and App Secret. These are the most important pieces of information about our new social applicaton. App ID is a piece of information that we can share unlike App Secret.
At the center of our new Facebook Application Page, we have basic information fields. Do not worry about Namespace, App Domains, and Hosting URL; these fields are for web applications. Sandbox Mode only allows developers to use the current application. Developers are specified through the Developer Roles link on the left side bar.
Moving down, select the type of app. For our goal, select Native iOS App. You can select multiple types and create multiplatform social applications.
Once you have checked Native iOS App, you will be prompted with the following form:
The only field we need to provide for now is the Bundle ID. The Bundle ID is something related to XCode settings. Be sure that the Facebook Bundle ID will match our XCode Social App Bundle Identifier. The format for the bundle identifier is always something like com.MyCompany.MyApp.
iPhone/iPad App Store IDs are the App Store identifiers of your application if you have published your app in the App Store. If you didn’t provide any of them after you saved your changes, you will receive a warning message; however, don’t worry, our new App ID is now ready to be used.
Save your changes and get ready to start our developing journey.
Downloading the Facebook iOS SDK
The iOS Facebook SDK can be downloaded through two different channels:
- Facebook Developer Portal: For downloading the installation package
- GitHub: For downloading the SDK source code
Using Facebook Developer Portal, we can download the iOS SDK as the installation package. Visit https://developers.facebook.com/ios/ as shown in the following screenshot and click on Download the SDK to download the installation package.
The package, once installed, will create a new FacebookSDK folder within our Documents folder.
The previous screenshot shows the content of the iOS SDK installation package. Here, we can see four elements:
- FacebookSDK.framework: This is the framework that we will import in our XCode social project
- LICENSE: It contains information about licensing and usage of the framework
- README: It contains all the necessary information about the framework installation
- Samples: It contains a useful set of sample projects that uses the iOS framework’s features
With the installation package, we only have the compiled files to use, with no original source code.
It is possible to download the source code using the GitHub channel. To clone git repo, you will need a Git client, either Terminal or GUI. The iOS SDK framework git repo is located at https://github.com/facebook/facebook-ios-sdk.git. I prefer the Terminal client that I am using in the following command:
git clone https://github.com/facebook/facebook-ios-sdk.git
After we have cloned the repo, the target folder will look as the following screenshot:
The previous picture shows the content of the iOS SDK GitHub repo. Two new elements are present in this repo: src and scripts. src contains the framework source code that needs to be compiled. The scripts folder has all the necessary scripts needed to compile the source code.
Using the GitHub version allows us to keep the framework in our social application always up-to-date, but for the scope of this book, we will be using the installation package.
Creating a new XCode project
We created a Facebook App ID and downloaded the iOS Facebook SDK. It’s time for us to start our social application using XCode.
- The application will prompt the welcome dialog if Show this window when XCode launches is enabled.
- Choose the Create a new XCode project option. If the welcome dialog is disabled, navigate to File | New | Project….
- Choosing the type of project to work with is the next step as shown in the following screenshot:
- The bar to the left defines whether the project is targeting a desktop or a mobile device. Navigate to iOS | Application and choose the Single View Application project type.
The previous screenshot shows our new project’s details. Provide the following information for your new project:
- Product Name: This is the name of our application
- Organization Name: I will strongly recommend filling out this part even if you don’t belong to an organization because this field will be part of our Bundle Identifier
- Company Identifier: It is still optional, but we should definitely fill it out to respect the best-practice format for Bundle Identifier
- Class Prefix: This prefix will be prepended to every class we are going to create in our project
- Devices: We can select the target device of our application; in this case, it is an iPhone but we could also have chosen iPad or Universal
- Use Storyboards: We are going to use storyboards to create the user interface for our application
- Use Automatic Reference Counting: This feature enables reference counting in the Objective C Garbage Collector
- Include Unit Tests: If it is selected, XCode will also create a separate project target to unit-test our app; this is not part of this book
Save the new project. I will strongly recommend checking the Create a local git repository for this project option in order to keep track of changes. Once the project is under version control, we can also decide to use GitHub as the remote host to store our source code.
