Starting Your First App
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
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
AngularJS
- AngularJS (>= 1.2.1)
- Ionic (v1.x)
PhoneGap
- The AngularJS library is compatible with PhoneGap.
Browsers
- Chrome - version 50 and above
- FireFox - version 45 and above
- IE - version 11 and Edge
- Safari - version 10 and above
Add Kinvey SDK
You can add the Kinvey SDK to your project in one of two ways - using the package we ship, or using the source code.
Add the following line of code after loading AngularJS.
<script src="//da189i1jfloii.cloudfront.net/js/kinvey-angular-sdk-3.12.4.min.js"></script>
index.html
.
Configure Your App
To use the SDK, you need to initialize it with your App Key and App Secret.
$kinvey
as part of an AngularJS module. Depending on your use case, you can also use $kinvey
inside services, factories, and controllers. See the AngularJS documentation on how to inject dependencies.
var app = angular.module('myApp', ['kinvey']);
app.config(['$kinveyProvider', function($kinveyProvider) {
$kinveyProvider.init({
appKey: '<appKey>',
appSecret: '<appSecret>'
});
}]);
The initialization function accepts the following options when initializing the library:
Option | Description |
---|---|
appVersion | Set a version for your app that will be sent as the header X-Kinvey-Client-App-Version on every network request. |
defaultTimeout | Set the default request timeout (in milliseconds). The default value is 60,000 ms. |
storage | Selects a storage provider. Possible values: Kinvey.StorageProvider.WebSQL (default in SDK versions older than 7.0.0 1), Kinvey.StorageProvider.LocalStorage , Kinvey.StorageProvider.IndexedDB , Kinvey.StorageProvider.SessionStorage , Kinvey.StorageProvider.Memory . |
Notes:
1 The setting may not work in all web browsers that you target with your app. You may need to choose a local storage provider depending on your requirements.
instanceId
to the ID of their dedicated Kinvey instance to correctly setup the backend and Mobile Identity Connect API URLs for the library.
You can find your Instance ID on the dashboard of the Kinvey Console, next to your App Key and App Secret.
var app = angular.module('myApp', ['kinvey']);
app.config(['$kinveyProvider', function($kinveyProvider) {
$kinveyProvider.init({
appKey: '<Your App Key>',
appSecret: '<Your App Secret>',
instanceId: '<Your Instance ID>'
});
}]);
Example of an instanceId
would be:
instanceId: 'kvy-us2'
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 SDK can communicate with your app.
var app = angular.module('myApp', ['kinvey']);
app.run(['$kinvey', function($kinvey) {
// ...
$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);
});
}]);
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.
How to use in a PhoneGap app
- Refer to the Set Up a PhoneGap Environment Guide to get starterd.
- Add the Kinvey AngularJS library script tag to the generated
www/index.html
.<script src="//da189i1jfloii.cloudfront.net/js/kinvey-angular-sdk-3.12.4.min.js"></script>
- Refer to Configure Your App on how to get started using the Kinvey AngularJS library with your PhoneGap app.
How to use in an Ionic app
Note - Check out our starter app in the Ionic Marketplace or on GitHub.
- Follow the Ionic Getting Started Guide to setup your Ionic environment.
- Add the Kinvey AngularJS library script tag to the generated
www/index.html
.<script src="//da189i1jfloii.cloudfront.net/js/kinvey-angular-sdk-3.12.4.min.js"></script>
- Refer to Configure Your App on how to get started using the Kinvey AngularJS library with your Ionic app.
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.