HTML5/Javascript Integration

Pick your integration type

• Plain javascript

  You’re free to build your UI as you prefer. You will use javascript to interact directly with the Feelback API.

• Bring your own UI

  If you don’t want to deal with javascript, but are comfortable to write some HTML markup.

Plain javascript integration

With the standard javascript fetch you can interact directly with the Feelback API.

Creating a feelback

You can create a feelback with a simple API call: a POST request via fetch.

Example: Create feelback

const ENDPOINT = "https://api.feelback.dev/v0";

async function sendFeelback({ contentSetId, key, value }) {
    const response = await fetch(ENDPOINT + "/feelbacks/create", {
        method: "POST",
        headers: { "content-type": "application/json" },
        body: JSON.stringify({
            contentSetId,
            key,
            value
        })
    });

    // returns the feelbackId and, if enabled, a revocable token
    return await response.json();
}

Parameters

To specify the content receiving the feelback you can either set the pair contentSetId+key or the unique contentId. More guidance on the guide to how to specify the target content.

Bring your own UI

Step 1: Load feelback library

Include the current script inside your page to load the feelback library:

<script defer src="https://www.unpkg.com/@feelback/js/dist/browser-auto.js"></script>

Step 2: Define UI markup to receive feelback

<div class="feelback-container" data-feelback-set="id-from-panel">
    <span>Do you like this page?</span>
    <button data-feelback-value="y">Yes</button>
    <button data-feelback-value="n">No</button>
</div>

Attributes you can specify in the container:

Attributes you can specify inside the container on various tag to enable specific logic: