kentico-cloud-delivery
Version:
Official Kentico Cloud Delivery SDK
233 lines (179 loc) • 8.9 kB
Markdown
[](https://www.npmjs.com/package/kentico-cloud-delivery)
[](https://travis-ci.com/Kentico/kentico-cloud-js)
[](https://circleci.com/gh/Kentico/kentico-cloud-js/tree/master)
[](https://www.npmjs.com/package/kentico-cloud-delivery)
[](https://forums.kenticocloud.com)
[](https://snyk.io/test/github/kentico/kentico-cloud-js)
[](https://github.com/Kentico/kentico-cloud-js)
[](https://www.jsdelivr.com/package/npm/kentico-cloud-delivery)
A client library for retrieving content from [Kentico Cloud](https://kenticocloud.com/) written in TypeScript and published in following formats: `UMD`, `ES2015` and `CommonJs`. Works both in browser & node.
| Resources
|---|
| [Full Documentation](https://github.com/Kentico/kentico-cloud-js/tree/master/packages/delivery/DOCS.md) |
| [Example apps](https://github.com/Kentico/kentico-cloud-js/tree/master/examples) |
| [API Reference](https://kentico.github.io/kentico-cloud-js/delivery/) |
| [Upgrade guide](https://github.com/Kentico/kentico-cloud-js/blob/master/packages/delivery/UPGRADE.md) |
You can install this library using `npm` or you can use global CDNs such `jsdelivr` directly. In both cases, you will also need to include `rxjs` as its listed as peer dependency.
```
npm i rxjs --save
npm i kentico-cloud-delivery --save
```
When using UMD bundle and including this library in `script` tag on your `html` page, you can find it under the `kenticoCloudDelivery` global variable.
Bundles are distributed in `_bundles` folder and there are several options that you can choose from.
- Use `kentico-cloud-delivery-sdk.browser.legacy.umd.min` if you need to support legacy browsers (IE9, IE10, IE11)
- Use `kentico-cloud-delivery-sdk.browser.umd.min` if you intend to use SDK only in browsers (strips code specific to Node.js = smaller bundle)
- Use `kentico-cloud-delivery-sdk.umd.min` if you need to use it in Node.js
#### CDN
##### kentico-cloud-delivery-sdk.browser.legacy.umd.min
```
https://cdn.jsdelivr.net/npm/kentico-cloud-delivery/_bundles/kentico-cloud-delivery-sdk.browser.legacy.umd.min.js
```
##### kentico-cloud-delivery-sdk.browser.umd.min
```
https://cdn.jsdelivr.net/npm/kentico-cloud-delivery/_bundles/kentico-cloud-delivery-sdk.browser.umd.min.js
```
##### kentico-cloud-delivery-sdk.umd.min
```
https://cdn.jsdelivr.net/npm/kentico-cloud-delivery/_bundles/kentico-cloud-delivery-sdk.umd.min.js
```
## TypeScript & ES6
```typescript
import {
ContentItem,
Elements,
TypeResolver,
DeliveryClient
} from 'kentico-cloud-delivery';
/**
* This is optional, but it is considered a best practice to define your models
* so you can leverage intellisense and so that you can extend your models with
* additional properties / methods.
*/
export class Movie extends ContentItem {
public title: Elements.TextElement;
}
const deliveryClient = new DeliveryClient({
projectId: 'xxx',
typeResolvers: [
new TypeResolver('movie', () => new Movie()),
]
});
/** Getting items from Kentico Cloud as Promise */
deliveryClient.items<Movie>()
.type('movie')
.toPromise()
.then(response => {
const movieText = response.items[0].title.value;
)
});
/** Getting items from Kentico Cloud as Observable */
deliveryClient.items<Movie>()
.type('movie')
.toObservable()
.subscribe(response => {
const movieText = response.items[0].title.value;
)
});
/**
* Get data without having custom models
*/
deliveryClient.items<ContentItem>()
.type('movie')
.get()
.subscribe(response => {
// you can access properties same way as with strongly typed models, but note
// that you don't get any intellisense and the underlying object
// instance is of 'ContentItem' type
console.log(response.items[0].title.value);
});
```
```javascript
const KenticoCloud = require('kentico-cloud-delivery');
class Movie extends KenticoCloud.ContentItem {
constructor() {
super();
}
}
const deliveryClient = new KenticoCloud.DeliveryClient({
projectId: 'xxx',
typeResolvers: [
new KenticoCloud.TypeResolver('movie', () => new Movie()),
]
});
/** Getting items from Kentico Cloud as Promise */
deliveryClient.items()
.type('movie')
.toPromise()
.then(response => {
const movieText = response.items[0].title.value;
)
});
/** Getting items from Kentico Cloud as Observable */
const subscription = deliveryClient.items()
.type('movie')
.toObservable()
.subscribe(response => {
const movieText = response.items[0].title.value;
});
/*
Don't forget to unsubscribe from your Observables. You can use 'takeUntil' or 'unsubscribe' method for this purpose. Unsubsription is usually done when you no longer need to process the result of Observable. (Example: 'ngOnDestroy' event in Angular app)
*/
subscription.unsubscribe();
/**
* Fetch all items of 'movie' type and given parameters from Kentico Cloud.
* Important note: SDK will convert items to your type if you registered it. For example,
* in this case the objects will be of 'Movie' type we defined above.
* If you don't use custom models, 'ContentItem' object instances will be returned.
*/
deliveryClient.items()
.type('movie')
.toObservable()
.subscribe(response => console.log(response));
```
Bundles are distributed in `_bundles` folder and there are several options that you can choose from.
- Use `kentico-cloud-delivery-sdk.browser.legacy.umd.min` if you need to support legacy browsers (IE9, IE10, IE11)
- Use `kentico-cloud-delivery-sdk.browser.umd.min` if you intend to use SDK only in browsers (strips code specific to Node.js = smaller bundle)
- Use `kentico-cloud-delivery-sdk.umd.min` if you need to use it in Node.js
```html
<!DOCTYPE html>
<html>
<head>
<title>Kentico Cloud SDK - Html sample</title>
<script type="text/javascript" src="https://unpkg.com/rxjs@6.4.0/bundles/rxjs.umd.min.js"></script>
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/kentico-cloud-delivery/_bundles/kentico-cloud-delivery-sdk.browser.umd.min.js"></script>
</head>
<body>
<script type="text/javascript">
var Kc = window['kenticoCloudDelivery'];
var deliveryClient = new Kc.DeliveryClient({
projectId: 'da5abe9f-fdad-4168-97cd-b3464be2ccb9'
});
deliveryClient.items()
.type('movie')
.toPromise()
.then(response => console.log(response));
</script>
<h1>See console</h1>
</body>
</html>
```
Note: You need to have `Chrome` installed in order to run tests via Karma.
- `npm run test:browser` Runs tests in Chrome
- `npm run test:node` Runs tests in node.js
- `npm run test:dev` Runs developer tests (useful for testing functionality)
- `npm run test:travis` Runs browser tests that are executed by travis
> If you want to mock http responses, it is possible to use [external implementation of configurable Http Service](../core/README.md#testing) as a part of the [delivery client configuration](DOCS.md#client-configuration).
## Feedback & Contribution
Feedback & Contributions are welcomed. Feel free to take/start an issue & submit PR.
