Getting Started

This guide shows you how to set up a project. If you are coming from any of the samples, note that (most of) these steps have already been done ahead of time.

Add an App Backend

If you don't have an account on Kinvey yet, please signup before continuing.

In the Kinvey console, create a new app backend. If you are currently viewing another app backend, click the app's name in the left navigation, and the select "New App" in the menu.

On the app dashboard page, you will find your App Key and App Secret in the top right. You’ll need those to configure your app.

Platform Compatibility

  • Angular2

    • Angular2 (>= 2.0.0)
  • Browsers

    • Chrome - version 50 and above
    • FireFox - version 45 and above
    • IE - version 11 and Edge
    • Safari - version 10 and above

Project Set Up

You can add the Kinvey Angular2 SDK to your project in one of two ways - using NPM or using the source code.

Using the Library

Install the kinvey-angular2-sdk package with NPM. This will inlcude the type definitions necessary to integrate with a typescript project.

npm install kinvey-angular2-sdk@latest --save

Using Source Code

Kinvey Javascript SDKs are now open source. If you prefer to compile your app against the SDK source code, you can follow the instructions on our github repo to set up the SDK.

Configure Your App

To use the library, you need to initialize it with your App Key and App Secret. The returned promise fulfills with the active user.

import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
import { Kinvey } from 'kinvey-angular2-sdk';
import { AppModule } from './app/app.module';

Kinvey.initialize({
  appKey: '<appKey>',
  appSecret: '<appSecret>'
})
  .then((activeUser?: Kinvey.User) => {
    platformBrowserDynamic().bootstrapModule(AppModule);
  });

Kinvey.initialize also accepts the following options when initializing the library:

OptionDescription
appVersionSet a version for your app that will be sent as the header X-Kinvey-Client-App-Version on every network request.
defaultTimeoutSet the default timeout used for all requests. The value must be in milliseconds. The default value is 60000 ms.

Dedicated Kinvey customers, you'll need to set the API host name for the library to your dedicated Kinvey host name. You can find this host name on the dashboard of the console, next to your App Key and App Secret:

import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
import { Kinvey } from 'kinvey-angular2-sdk';
import { AppModule } from './app/app.module';

Kinvey.initialize({
  apiHostname: '<my-subdomain>.kinvey.com',
  micHostname: '<my-subdomain>-auth.kinvey.com',
  appKey: '<appKey>',
  appSecret: '<appSecret>'
})
  .then((activeUser?: Kinvey.User) => {
    platformBrowserDynamic().bootstrapModule(AppModule);
  });

Never use the Master Secret in client-side code.

Verify Set Up

Your app is now connected to Kinvey. The ping method, as shown below, will contact the backend and verify that the library can communicate with your app.

import { Kinvey } from 'kinvey-angular2-sdk';

Kinvey.ping();
  .then(function(response: {}) {
    console.log('Kinvey Ping Success. Kinvey Service is alive, version: ' + response.version + ', response: ' + response.kinvey);
  }).catch(function(error) {
    console.log('Kinvey Ping Failed. Response: ' + error.description);
  });

If the response just yields hello instead of hello app-name, please make sure you have configured your app. If the error yields This app backend not found, the app key and app secret you entered are incorrect.

Every App has an Active User

Your app will be used by a real-life human being. This person is represented by the Active User. This user object must explicitly be created, either with a username and password, OAuth sign-on (such as Facebook, Google+, LinkedIn, etc.), or Mobile Identity Connect. See the User Guide for more information.

What's next

You are now ready to start building your awesome apps! Next we recommend diving into the User Guide or Data Store Guide to learn more about our service, or explore the sample apps to go straight to working projects.

Got a question?