👍
Check our Reference Materials for more details about MediaStore SDK.

Welcome to MediaStore SDK Quickstart! This guide will show you how to install the purchase flow and set up offers in the dashboard to start building your frictionless checkout experience in less than ten minutes.

Step 1: Create a Cleeng account

Create a Cleeng account for your production setup and Cleeng sandbox account for testing.

Your sandbox account will be useful to control and test your integration. For example, if you register a customer, check if he/she is in the customer list in the Dashboard.
Cleeng account is for collecting real data from your production version of the app.

Step 2: Create your API Key

Create your API key in the Admin & Tools section > API Keys

Step 3: Obtain Publisher Token

Once you click the Create new API Key button, a pop-up window will appear where you need to provide a name (title) for the newly created API key.

When you type it and click the Submit button you will see your publisherIdpublisherId - Publisher identification in Cleeng. This value can be exposed to public, it will not allow sensitive data access. and publisherTokenpublisherToken - publisherToken is used to merchant authentication by most of the Cleeng API. Publisher token is used to create and update offers, as well as gives access to other e-commerce functions (like reporting). Never expose your publisherToken to the public. It will allow price updates and other sensitive data access. as shown in the screenshot below. You will need it later.

Step 4: Create an Offer

Create an offer using the dashboard in the Offers & Coupons section > Subscription Offers.

If you want to create an offer through API, please refer to Cleeng's API.

MediaStore supports subscriptions, season passes, PPV, and VOD offers.

Step 5: Offer ID

When you click the Save button to save your offer, in the next screen that appears, click the Code button (marked with "1" in the screen below).
This will display a pop-up with your offerIdofferId - Offer identification in Cleeng. Each offer (subscription, season pass, VOD, live event) has its own offerId. for the created subscription (marked with "2" in the screen below).
You will need offerID later.

Step 6: Create your app

By now, you have completed the basic configuration.

Go ahead, and start creating your own app. You can choose from two options for MediaStore SDK:

1. Use the MediaStore SDK Components Library - our recommended option with ready-to-use components and faster integration. See the Components Library section for an overview. Please note that this solution is React JS-only.

If you go for MediaStore SDK Components Library, make sure you have the following as per MediaStore SDK Package documentation:

Prerequisites:
- Node v14.15.0
- React
- NPM or Yarn
You have downloaded the package.
If you have the package downloaded locally and you want to begin to use it, it is recommended that you start the configuration by setting the broadcaster settings as specified in MediaStore SDK Package documentation

2. Build your own application from scratch using our MediaStore API - see our reference application github MediaStore repository. Integrating via API is an advanced option as it requires more coding knowledge.

Step 7: Setting up the recurring billing

You are almost there to process your first payment transaction.

If you want to sell subscriptions, in order to receive and process the payments, you need to configure the below settings to get the recurring billing in place.

Please set up both topics respectively to complete the requirements for a frictionless checkout experience.

Up Next

Congratulations, with completing the 7 steps, we are fully configured to start building the checkout experience.