Developer docs

Build with Vigilimate

Three ways to integrate, from the lowest-effort to the most flexible:

1 · Embed

Drop in a single iframe

Best for partner apps that already have logged-in users and want learners to complete training without a second login.

<script src="https://learn.mediatech.group/embed/embed-loader.js"></script>
<mtga-embed
  src="https://learn.mediatech.group/embed/program/your-program?token=<JIT>"
  autoresize>
</mtga-embed>

The token is a short-lived JWT your backend mints — see step 3.

2 · SDK

Use the TypeScript SDK

Typed REST client + React component + token minting. Same iframe under the hood.

import { MTGAClient } from "@mtga/sdk";
import { MTGAEmbed } from "@mtga/sdk/react";

const mtga = new MTGAClient(
  { apiKey: process.env.MTGA_API_KEY! },
  { keyId: ..., secret: ..., partnerIssuer: "your-app" },
);

const url = await mtga.buildEmbedUrl(
  { kind: "program", slug: "compliance-2026" },
  { partnerUserId: "user-42", email, name },
);

// then in your component:
<MTGAEmbed src={url} onProgramComplete={(e) => track(e)} autoresize />

3 · REST API

Drive everything from your backend

Versioned at /api/v1. Authenticate with a server API key (Bearer).

curl https://learn.mediatech.group/api/v1/programs \
  -H "Authorization: Bearer mtga_sk_..."

curl -X POST https://learn.mediatech.group/api/v1/assignments \
  -H "Authorization: Bearer mtga_sk_..." \
  -H "Content-Type: application/json" \
  -d '{"user_id":"...", "program_slug":"compliance-2026"}'

Reference

Quickstart

  1. In Vigilimate, open Admin → Settings → Developer API and create an API key. Tick “Also mint a JIT signing secret”. Copy both values — they’re shown once.
  2. Add the parent origin (e.g. https://partner.example.com) to the Embed origins allowlist.
  3. On your backend, mint a JIT token for the user (see SDK above, or sign HS256 by hand: kid = api_key id, iss = your app id, sub = your user id, aud = “mtga”, exp<= 1h).
  4. Render <mtga-embed src="https://learn.mediatech.group/embed/program/<slug>?token=<jwt>"> on the page.
  5. Listen for the program.completed event to update your own state.