convoy-app.js
v0.2.8
Published
Convoy App Portal SDK
Downloads
19
Readme
Convoy App Portal JS SDK
This SDK enables you to you to extend visibility from your Convoy dashboard to your customer platform, enabling them to view their subscriptions, create new subscriptions, view events and deliveries, debug event delivery requests and responses, replay events, e.t.c.
Below are examples of to get started.
Installation
You can install convoy-app.js by running the following command:
npm i convoy-app.jsOr preferrably through a CDN from jsDelivr
https://cdn.jsdelivr.net/npm/[email protected]/dist/bundle.jsUsage
Convoy-app.js is compatible with all javascript frameworks and libraries. See instructions below.
Import/link convoy-app to project
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/bundle.js"></script>Or
import * as Convoy from 'convoy-app.js';Or
<script src="node_modules/convoy-app.js/dist/bundle.js"></script>Now you need to initialize the convoy-app by providing your Convoy instance URL and app portal token (from your backend, reference here).
Javascript
const convoy = new Convoy({ uri: 'convoy instance url', api_key: 'app token from your backend' });Typescript
declare const Convoy: any;
export class ConvoyExample {
convoy: any;
constructor() {
this.convoy = new Convoy({ uri: 'convoy instance url', api_key: 'app token from your backend' });
}
}Now you can use convoy-app to render Convoy App Portal
convoy.initAppPortal();
// You can optionally pass a DOM selector string, convoy-app uses #convoy-app by default
convoy.initAppPortal('#convoy-app');
// You can also use convoy app to prompt user to create a subscription alone
convoy.createSubscription();
// You can optionally pass a DOM selector string, convoy-app uses #convoy-create-sub by default
convoy.createSubscription('#convoy-create-sub');Lastly, you need to add the repective selector elements to your HTML
<!-- For app portal -->
<div id="convoy-app"></div>
<!-- For create subscription modal -->
<div id="convoy-create-sub"></div>Complete examples
Vanilla Javascript
<head>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/bundle.js"></script>
<!-- or -->
<script src="node_modules/convoy-app.js/dist/bundle.js"></script>
</head>
<body>
<!-- For app portal -->
<div id="convoy-app"></div>
<!-- For create subscription modal -->
<div id="convoy-create-sub"></div>
<body>
<script>
const convoy = new Convoy({ uri: 'convoy instance url', api_key: 'app token from your backend' });
convoy.initAppPortal();
convoy.createSubscription();
</script>
</body>
</body>Typescript Project
<head>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/bundle.js"></script>
<!-- or -->
<script src="node_modules/convoy-app.js/dist/bundle.js"></script>
</head>
<body>
<!-- For app portal -->
<div id="convoy-app"></div>
<!-- For create subscription modal -->
<div id="convoy-create-sub"></div>
<body></body>
</body>Your .ts file
declare const Convoy: any;
export class ConvoyExample {
convoy: any;
constructor() {
this.convoy = new Convoy({ uri: 'convoy instance url', api_key: 'app token from your backend' });
convoy.initAppPortal();
convoy.createSubscription();
}
}Contributing
Please see CONTRIBUTING for details.
Credits
License
The MIT License (MIT). Please see License File for more information.