Que fait trigger-realtime ?
Abonnez-vous aux exécutions de tâches Trigger.dev en temps réel depuis votre frontend et backend. Utilisez-le pour construire des indicateurs de progression, des tableaux de bord en direct, des réponses streaming d'IA/LLM, ou des composants React affichant l'état des tâches.
Aperçu
Ce skill vous permet de suivre en temps réel l'état de vos tâches Trigger.dev. Cela signifie que vous pouvez afficher des mises à jour en direct sur vos interfaces utilisateur sans avoir à interroger périodiquement l'API.
Cas d'utilisation
- Indicateurs de progression : Affichez la progression des tâches longues (téléchargements de fichiers, traitements par lots).
- Tableaux de bord en direct : Créez des tableaux de bord qui se mettent à jour automatiquement lorsque les tâches se terminent.
- Streaming IA/LLM : Diffusez en continu les réponses des modèles de langage (LLM) au fur et à mesure de leur génération.
- Composants React : Construisez des composants React qui réagissent aux changements d'état des tâches.
Plateformes supportées
- Frontend : JavaScript, React, Vue.js, tout framework web moderne.
- Backend : Node.js, Python, Go, tout environnement supportant les WebSockets.
- Trigger.dev : Version 3.0 ou supérieure recommandée.
Comment ça marche
- Installation : Installez le package @trigger.dev/realtime via npm ou yarn.
- Configuration : Générez une clé API Trigger.dev et configurez-la dans votre application.
- Abonnement : Utilisez l'API pour vous abonner à des tâches spécifiques ou à toutes les tâches de votre projet.
- Réception des événements : Recevez les événements en temps réel (début, progression, succès, échec) et mettez à jour votre UI en conséquence.
Exemple de code
import { createClient } from '@trigger.dev/realtime';
const client = createClient({
apiKey: process.env.TRIGGER_API_KEY,
});
const runKey = 'mon-task-run-id';
const unsubscribe = client.subscribe(runKey, (event) => {
console.log('Nouvel événement :', event);
// Mettez à jour l'interface utilisateur ici
if (event.status === 'succeeded') {
alert('Tâche terminée avec succès !');
}
});
En savoir plus
Pour plus de détails, consultez la documentation officielle sur le site de Trigger.dev.