An open API service indexing awesome lists of open source software.

https://github.com/peerigon/telemetrydeck-vue

A library for using TelemetryDeck in your Vue 3 app
https://github.com/peerigon/telemetrydeck-vue

Last synced: 6 months ago
JSON representation

A library for using TelemetryDeck in your Vue 3 app

Awesome Lists containing this project

README

          

# telemetrydeck-vue

A library for using TelemetryDeck in your React app.

[![semantic-release: angular](https://img.shields.io/badge/semantic--release-angular-e10079?logo=semantic-release)](https://github.com/semantic-release/semantic-release)

[![Test and 🚀 Release](https://github.com/peerigon/telemetrydeck-vue/actions/workflows/test_and_release.yml/badge.svg)](https://github.com/peerigon/telemetrydeck-vue/actions/workflows/test_and_release.yml)

## Installation

```shell
npm i @peerigon/telemetrydeck-vue --save
```

## Setup

Set up the plugin in your application setup:

```javascript
import TelemetryDeckPlugin from '@peerigon/telemetrydeck-vue';

const app = createApp(App);
app.use(TelemetryDeckPlugin, {
appID: "{your telemetrydeck appID}",
testMode: true, // optional - defaults to false
clientUser: 'Guest' // optional - defaults to 'Guest'
});

app.mount('#app');
```

## Basic Usage

```vue

import { useTelemetryDeck } from "@peerigon/telemetrydeck-vue";
const { signal, queue, setClientUser } = useTelemetryDeck();

const changeClientUserClick = () => {
setClientUser('user' + Math.floor(Math.random() * 1000));
};

const buttonSignalClick = () => {
signal('example_signal_event_name', {
custom_data: 'other_data', // any custom data as required
});
};

const buttonQueueClick = () => {
queue('example_queue_event_name', {
custom_data: 'other_data', // any custom data as required
});
};

const buttonSignalClickWithOptions = () => {
signal('example_signal_event_name_with_options', {
custom_data: 'other_data', // any custom data as required
}, {
testMode: true,
clientUser: 'other_user',
appID: 'other_app_id',
}); // telemetryDeck options (optional)
};

const buttonQueueClickWithOptions = () => {
queue('example_queue_event_name_with_options', {
custom_data: 'other_data', // any custom data as required
}, {
testMode: true,
clientUser: 'other_user',
appID: 'other_app_id',
}); // telemetryDeck options (optional)
};



Log a click with signal
Log a click with queue
Change user


Log a click with signal with Options
Log a click with queue with Options

```

## Contributions

### Local Development

To run the plugin locally for development:

1. Install Node.js v20
2. Run `npm i`
3. create .env file from .env.example and add your test telemetryDeck appID. Create an account here: [telemetrydeck.com](https://telemetrydeck.com/)
3. Run `npm run dev`
4. Navigate to [http://localhost:5173/](http://localhost:5173/) for the test page

### Tests

Run the tests with:

```shell
npm run test
```