Getting Started

Das Overlay SDK ist eine Vanilla-JavaScript-Bibliothek für Custom Widgets: HTML, CSS und JS, die du selbst im Editor schreibst. Es gibt deinem Code einfachen Zugriff auf Twitch-Events, State und Settings, ohne dass du dich um Verbindungen oder Auth kümmern musst.

pixls vorgefertigte Widgets (Counter, Timer, ...) brauchen das SDK nicht, die funktionieren ohne Code.

Ein minimales Custom Widget

<div id="count">0</div>

const overlay = new Pixl({ token: '__TOKEN__' });

overlay.state('counter.deaths', (value) => {
  document.querySelector('#count').textContent = value;
});

overlay.on('twitch.follow', (data) => {
  console.log(`${data.username} folgt jetzt!`);
});

Mehr braucht es nicht: In Produktion injiziert pixl das SDK automatisch, Pixl steht global zur Verfügung.