This chapter covers how to set up a Parse project. You will need to write down a few application keys and secrets. To make the process simple, start with a helper class to remember these keys and secrets.

In this chapter you learn how to:

• Keep track of your keys with the EMABConstants helper class
• Create a new Parse app
• Set up payment, transactional e-mails, and Facebook login
• Manage dependencies with Cocoapods
• Implement a progress indicator with SVProgressHud

Keep Track of Your Keys: EMABConstants Class

Continue with the source code from Chapter 2; create a new Cocoa Touch Class file, name it EMABConstants, and make it a subclass of NSObject. One purpose of this class is to keep track of those global accessible NSStrings, such as all keys and secrets. In this case, using “extern NSString *const” is the preferred approach.

In addition, you used EMAB as prefix for each file you created—EMAB stands for “E-commerce Mobile App Development,” but you can name it whatever you want.

Create a New Parse App

If you don’t have a Parse account, now is the time to sign up for one! Open https://parse.com in your favorite browser, then follow the onscreen instructions to sign up for a Parse account. The process is simple. Once you verify the e-mail address you are asked to provide, you can jump right in to create a new app.

Parse only asks for the name of the new app you want to create. In this tutorial, your app name is EcommerceAppBook. Once you confirm the project name, you will see a project overview similar to the one shown in Figure 4-1.

Click the icon part of the summary box, and you will then see a dashboard screen. At this point, you only need to get your application keys. So click the “Settings” tab, which is on top of the dashboard, then click “Keys” in the left column. You will see a couple of application keys: Application ID and Client Key for your iOS app (see Figure 4-2).

Paste these two keys into your EMABConstants.h file:

extern NSString *const kParseApplicationID;
extern NSString *const kParseClientKey;

In EMABConstants.m, implement these two keys’ content:

NSString *const kParseApplicationID = @"YOUR-PARSE-APPLICATION-ID";
NSString *const kParseClientKey = @"YOUR-PARSE-CLIENT-KEY";

Remember to use your real Parse application ID and client key.

Set Up Payment: Stripe

Wikipedia says that Stripe is a company that provides a way for individuals and businesses to accept payments over the Internet. Stripe says about itself: web and mobile payments, built for developers. The most important feature of an e-commerce app is that it accepts payment. In this tutorial, after a user enters a credit card number, you will use Stripe to process the payment. In the end, Stripe will charge the user’s credit card and distribute the money to your bank account, minus a small fee for the service. The amount of the fee is calculated based on your geolocation. For example, at the time of writing, the fee in the United States is 2.4% + 20 cents per successful charge. There are no recurring monthly fees, no refund costs, and no hidden fees. If you haven’t done so already, this would be a good time to sign up with Stripe.

To get started with Stripe, click the Sign Up button on the Stripe home page, https://stripe.com/gb. As with most accounts these days, you will be asked to provide an e-mail address and a password. Stripe will send you a verification e-mail to the e-mail address you provided. Be sure to verify your e-mail before you continue.

Clicking the link in the verification e-mail will bring you back to the Stripe website. Log in with the e-mail and password to activate your account.

Stripe supports multiple accounts within the same user account. From the Your Account menu, select “Create New Account,” and give it an account name, such as your company’s name, then click “Create Account,” as shown in Figure 4-3.

Similar to Parse, you will see a dashboard. Click your account name located at the top right corner, and click “Account Settings” (see Figure 4-4).

Find the “API Keys” tap, and copy and paste the Test Publishable Key and Live Publishable Key to your EMBAConstants class.

In EMABConstants.h:

extern NSString *const kStripeTestPublishableKey;
extern NSString *const kStripeLivePublishableKey;

In EMABConstants.m:

NSString *const kStripeTestPublishableKey = @"YOUR-STRIPE-TEST-PUBLISHABLE-KEY";
NSString *const kStripeLivePublishableKey = @"YOUR-STRIPE-LIVE-PUBLISHABLE-KEY";

You won’t need the Test Secret Key and Live Secret Key in your Xcode project; however, you will need them later on. The Live Secret Key is very important, and you should not share it with others.

Worth mentioning, Stripe will need you to provide more information such as the legal representative’s name, date of birth, and social security number for this account when you turn your project into production. It also needs the legal business name, address, and EIN/Tax ID if there is one. And it requires a bank routing and account number so the money can be transferred into the user’s bank account.

Set Up Transactional E-Mails: Mailgun

For this example, you will use the developer-friendly Mailgun APIs to send transactional e-mails when an order is placed. Mailgun’s pricing is very reasonable The first 10,000 e-mails of the month are free. Alernatively, you can also choose Sendgrid or other services. I chose Mailgun mainly because Parse has a built-in Mailgun cloud module for developers.

Signing up for a Mailgun account is simple. Visit https://mailgun.com/signup, and enter your Company/Account name, personal name, e-mail address and password, and sign up.

Mailgun also requires e-mail verification. Follow the verification e-mail instructions, and you will be brought back to the Mailgun website. Log in with your e-mail and password, and you will be sent to a dashboard screen. Tap the “Domains” tab at the top. You will see a default sandbox domain automatically assigned to you; use this domain in your project. Click this domain to find out the API key (see Figure 4-5).

You won’t need this API key in your Xcode project; but you will use it later in your Parse Cloud code.

Set Up Facebook Login

Since you will use the Facebook Login feature, it’s mandatory to create a Facebook App with Facebook to enable this feature.

Go to https://developers.facebook.com/apps. Click “Add a New App,” and choose iOS. You will see a “Quick Start for iOS” screen. Choose Skip and Create App ID in the top right corner. Facebook will ask you to provide a display name for the app and a category. Enter what describes your business best and click “Create App ID” button. Figure 4-6 shows the screen after you click the button.

You might need to go through another security check screen before you can see the App ID, a 16-digit number. Write down this number; you will use it in our Xcode project.

You can add this key by editing the PLIST file of the Chapter 4 project source code, as shown in Figure 4-7.

1. Create a key called FacebookAppID with a string value, and add the 16-digit number app ID there.
2. Create a key called FacebookDisplayName with a string value, and add the Display Name we have had in the Facebook App Dashboard.
3. Create an array key called URL types with a single array subitem called URL Schemes. Give this a single item with your app ID prefixed with fb; it should look something like fb1235789899153886. Use the default parameter for Document Role: Editor.

Manage Dependencies: Cocoapods

As an iOS developer, you should be familiar with Cocoapods. Cocoapods is the dependency manager for Swift and Objective-C Cocoa projects. It has thousands of libraries and can help you scale your projects elegantly.

If you have not installed Cocoapods on your Mac computer, this is the time to do so; you will use Cocopaods to install all Parse-related SDKs and other libraries.

Install Cocoapods from the Terminal by running the following command:

$ sudo gem install cocoapods

Install the Podfile

Your Podfile consists of a few Parse-related libraries, the core Parse iOS SDK, the Parse UI iOS SDK, the Facebook iOS SDK, and ParseFacebookUtility iOS SDK. This is what your current Podfile looks like.

source 'https://github.com/CocoaPods/Specs.git'
pod 'Parse'
pod 'ParseFacebookUtils'
pod 'Facebook-iOS-SDK'
pod 'ParseUI'

This Podfile comes with Chapter 4 source code. After you have installed Cocoapods, simply run:

pod install

in your project directory. All dependent SDKs will be pulled and added to our project automatically. Remember, from now on, you will use Xcworkspace, which is created during the process of adding dependent SDKs.

When you want to keep up those dependent SDKs with the latest ones, you run the following command in a Terminal window whenever you set a fit:

pod update

Implement a Progress Indicator: SVProgressHud

In iOS development, it’s common to show a pop-up message to tell a user some simple information such as content saved, error occurs, etc. The standard iOS way to handle this case is to use UIAlertController. For instance, to indicate to a user that a saving action is successful, use the following code:

UIAlertController* alert = [UIAlertController alertControllerWithTitle:@"Success"
                                                           message:@"Your data is saved."
                                                preferredStyle:UIAlertControllerStyleAlert];

    UIAlertAction* defaultAction = [UIAlertAction actionWithTitle:@"OK" style:UIAlertActionStyleDefault
                                                     handler:^(UIAlertAction * action) {}];

    [alert addAction:defaultAction];
    [self presentViewController:alert animated:YES completion:nil];

The issue with UIAlertViewController is that a user has to tap the “OK” button to dismiss this alert. Implementation-wise, you have repeatedly written the same code over and over across an app.

To emphasize the implementation of the business logic of an e-commerce iPhone app, try to use dependent libraries as little as possible. However, I do want to introduce the SVProgessHud library. SVProgressHUD is a clean and easy-to-use HUD meant to display the progress of an ongoing task, or just simply display a message. To show a success message:

[SVProgressHUD showSuccessWithStatus:@"Successfully saved"];

To show an error message:

[SVProgressHUD showErrorWithStatus:[error localizedDescription]];

In either case, the SVProgressHud will be automatically dismissed after three seconds.

To show a data loading status and dismiss the status once the data loading is finished, you can use SVProgressHud in this way:

[SVProgressHUD show];
[product saveInBackgroundWithBlock:^(BOOL success, NSError *error) {
        [SVProgressHUD dismiss];
        if (!error) {
            [SVProgressHUD showSuccessWithStatus:@"Saved"];
        } else {
            [SVProgressHUD showErrorWithStatus:[error localizedDescription]];
        }
 }];

Now, you can edit your Podfile and add the SVProgressHud library dependency:

pod 'SVProgressHUD'

And update pods again:

pod update

Summary

In this chapter, I covered how to set up a Parse project on parse.com. I also introduced a custom class to keep track of important keys I obtained from Parse.com, Stripe.com, and Mailgun.com. I also gave a brief overview on how to apply for a Facebook Developer account and then set the Facebook App ID with the proposed app. In the last part of this chapter, I described the Podfile that you will use in this book.