Join us Nov. 6 for our Fall Product Update
Contentstack
search
Changelog

Build an E-commerce App using Contentstack's Swift SDK

This demo E-commerce app is built using Contentstack's Swift SDK. It uses Contentstack to store and deliver content of the e-commerce app.

View Code

Screenshots

screenshot
screenshot

Warning: This sample app is no longer maintained. It remains available for reference. If you have questions regarding this, please reach out to our support team and we will do our best to help!

Quickstart

Here’s a quick guide on how to create an E-Commerce for iOS using Contentstack Swift SDK and Contentstack.

Prerequisites

Installation and Setup

In this tutorial, we will first go through the steps involved in configuring Contentstack and then look at the steps required to customize and use the presentation layer.

  1. Create a Stack

    Log in to your Contentstack account, and create a new stack. This stack will hold all the data, specific to your website. Learn more about creating a stack.

  2. Add a Publishing Environment

    To add an environment in Contentstack, go to your stack and click the “Settings” icon on the left navigation panel. Select Environments, and click on the + New Environment button. Provide a suitable name for your environment, say “staging”. Specify the base URL (e.g., “http://YourDomainName.com”), and select the language (e.g., English - United States). Then, click on Save. Read more about environments.

  3. Import Content Types

    A content type is like the structure or a blueprint of a page or a section of your web or mobile property. Read more about Content Types. For this app, basic content types are required: Product, Header, Category.

    For quick integration, we have already created these content types. Download the content type from here. You simply need to import them to your stack. (You can also create your own content types. Learn how to do this).

  4. Add Content

    Create and publish entries for all the content types

    Add a few dummy entries for the ‘Header’, 'Category' and 'Product' content type. Save and publish these entries. 

    With this step, you have created sample data for your application. Now, it’s time to use and configure the presentation layer.

  5. Clone and Configure the Application

    To get your app up and running quickly, we have created a sample iOS app for this project. You need to download it and change the configuration. Download the app using the command given below:

    $ git clone https://github.com/contentstack/contentstack-ecommerce-app.git

    Now add your Contentstack API Key, Delivery Token, and Environment to the APIManager.swift file within your project. (Find your Stack's API Key and Delivery Token).

    class StackConfig {

    static var APIKey           = <api_key>

    static var DeliveryToken    = <delivery_token>

    static var EnvironmentName  = <environment>

}

    This will initiate your project.

  6. Build and Run your E-Commerce app

    Install the pods and open the .xcworkspace file to see the project in Xcode.

    $ pod install

$ open contentstack-ecommerce-app.xcworkspace

    Now that we have a working project, you can build and run it.

Additional Resource: The Contentstack iOS SDK helps you build apps that are future-ready. Read our guide on how to build an Augmented Reality (AR) app using Contentstack's iOS SDK for more details.

More resources