Skill de création de chatbots pour React
Une interface de chat React qui diffuse les tokens un par un, résiste à une actualisation et ne place jamais votre clé API dans le bundle du navigateur.
Fichier de prompt téléchargement immédiatchatbot-builder-react.txt
Ce contenu (skill) et 2 500+ autres
$9/mois ou $59 par an
Prendre Library · $9/moisPrendre LibraryRien n’est débité. 2 jours avant la fin de l’essai, vous recevez un code −30 % pour votre premier paiement.
Seulement ce fichier (skill) ?
Un fichier, payé une fois. Sans mises à jour, sans connecteur.
Coûte à peu près autant que 2 mois de Library.
Inclus dans votre plan
Demandez-le par son nom à votre IA ou choisissez-le dans votre tableau de bord. Inutile d’acheter le fichier.
L’utiliser dans votre IAPayez une fois, gardez-le pour toujoursTéléchargement immédiatSatisfait ou remboursé 30 jours
Paiement sécurisé par Stripe
Marques de leurs propriétaires respectifs. KissMySkills n’est ni affilié à eux ni approuvé par eux.
Comment ça marche
Ask it something hard.
Ou tous les skills, directement dans votre IA.
Des questions avant d’acheter ? Une personne répond, souvent le jour même : hello@kissmyskills.com
// le fichier lui-même
Les premières lignes du fichier que votre IA lira, exactement telles que livrées. Rien n'est réécrit pour la page.
Vous êtes un créateur d’interfaces de chat React, et le développeur exécute l’éditeur pendant que vous expliquez chaque élément avant de l’écrire. Vous avez été activé pour déployer un chat qui diffuse les jetons un par un et résiste à une actualisation.
// ce qu'il contient
Un développeur React qui doit livrer une interface de chat cette semaine et qui a besoin qu’elle tienne le coup face à de vrais utilisateurs, plutôt que seulement sur une capture d’écran.
// deux façons de l'obtenir
$9/mois résiliable à tout moment, ou $59 par an
$19 paiement unique
Déjà abonné à Library ou Both ? Celui-ci est inclus, inutile d'acheter le fichier.
La plupart des tutoriels de chatbots React s'arrêtent à une démonstration. La réponse arrive d'un seul bloc après huit secondes, l'intégralité du fil est renvoyée au modèle à chaque échange, et la clé se retrouve dans une variable NEXT_PUBLIC_ que Next intègre directement au bundle du navigateur. Cela semble fonctionner sur une capture d'écran, mais s'effondre dès la première semaine d'utilisation réelle.
Il s'agit d'un guide de développement, pas d'un prompt système. Déposez le fichier dans votre projet, ouvrez-le avec Claude Code ou Cursor, et il vous accompagne dans la conception de l'architecture : streaming avec le lecteur Fetch ReadableStream, un AbortController connecté à l'arrêt, un message utilisateur optimiste auquel les tokens sont ajoutés, une liste qui ne réaffiche pas chaque bulle à chaque token, un défilement automatique qui cesse de lutter contre un lecteur remonté dans la conversation, le markdown et les blocs de code, la clé derrière un gestionnaire de route, l'historique dans localStorage puis dans un véritable backend, ainsi qu'un budget de tokens pour le jour où le fil s'allonge.
Achetez-le une fois et il vous appartient définitivement. Aucun abonnement, aucune dépendance à l'exécution, et rien ne vous empêche de le réutiliser sur votre prochain projet ou de le modifier à mesure que votre base de code évolue.
Après l'achat, le lien de téléchargement arrive dans votre boîte mail. Enregistrez le fichier .txt où vous voulez sur votre appareil.
N’importe quel chat IA que vous utilisez déjà : Claude, ChatGPT, Gemini, Grok, Copilot ou un autre.
Ouvrez le fichier .txt, copiez la partie prompt et collez-la dans Claude ou ChatGPT, ou ajoutez-la à un projet pour l'avoir toujours sous la main.
Votre AI est maintenant configurée comme spécialiste. Posez-lui n’importe quelle question relevant de son domaine.
Aucune connaissance technique requise.
Avec Library, rien à télécharger. Connectez votre IA une fois, puis demandez n’importe quel skill par son nom.
Les deux. Il vous demande lequel vous utilisez dans les premières questions, car la réponse détermine où se trouve la clé. Avec le routeur d'application Next, vous obtenez un gestionnaire de route qui renvoie une Response en flux continu. Avec Vite, il n'y a pas du tout de serveur : le guide vous explique donc comment mettre en place un petit endpoint Express ou serverless, et pourquoi une variable d'environnement Vite ne constitue pas un endroit sûr pour la dissimuler.
Cela fonctionne avec vous dans votre éditeur. Chargé dans Claude Code ou Cursor, il lit votre projet, vous interroge sur vos versions, propose l'architecture et écrit les fichiers avec vous, mais vous examinez chaque diff, l'exécutez et assumez le résultat. C'est un binôme senior, pas un générateur qu'il suffit de lancer une fois. Attendez-vous à saisir du code, à tester et à effectuer vous-même les mises en production.
Non. L'architecture repose sur des primitives de plateforme, fetch, ReadableStream et AbortController, et fonctionne donc avec le fournisseur que vous appelez. Lorsqu'un SDK fournisseur apporte réellement une valeur ajoutée, le guide vous le précise, et il vous demande quelle version est installée avant de nommer une méthode, car la forme de ces bibliothèques change entre les versions majeures plus souvent que ne le laissent entendre les documentations.
D'abord Claude Code et Cursor, puisque tous deux peuvent lire votre projet et écrire des fichiers avec vous. Cela fonctionne également si vous collez le contenu dans Claude, ChatGPT, Gemini ou Copilot en décrivant plutôt votre projet. Tout assistant qui accepte un long fichier d'instructions saura le suivre.
Celui-ci et 2 500+ autres, dans Claude, ChatGPT, Claude Code, Codex ou Cursor. Résiliable à tout moment.
