Template — Connecter gratuitement Claude Code à 13 plateformes : guide pas-à-pas + diagramme (FR)

Un plan reproduisible en 3 composants (Collector, Normalizer, Claude Agent) pour récupérer contenus publics et personnels visibles depuis votre compte, transformer en fragments structurés et fournir ces fragments à Claude Code. Inclus : exemples Playwright (Node), requêtes HTTP pour JSON/RSS publics, prompt d'ingestion, prompt d'usage, 13 plates-formes couvertes et recommandations opérationnelles.

Collector (headless Playwright ou HTTP/RSS) → Normalizer (html -> JSON minimal : {source, url, timestamp, author, text, media, metadata}) → Claude Agent (Claude Code reçoit les fragments via prompt/system message). Diagramme suggéré : un seul SVG PNG montrant 3 boîtes en pipeline. Instructions pour générer le diagramme inclues plus bas.

1) Pour chaque plateforme, essayez d'abord un flux public (RSS / JSON public / oEmbed). 2) Si indisponible, chargez la page dans Playwright en utilisant votre session (cookies) pour obtenir le HTML rendu. 3) Extraire les champs clé via selectors CSS / XPath (titre, auteur, date, texte, liens, compteur) et stockez en JSON. 4) Normaliser timestamps et extraire médias (miniatures, transcriptions). 5) Envoyer batches (<= 3-5 éléments) à Claude Code avec métadonnées et instruction claire. 6) Tester avec requêtes de vérification (ex : "Donne-moi les 5 posts récents mentionnant 'bug' et un score de priorité").

Exemple résumé (Node + Playwright). 1) Installez : npm i playwright 2) Script exemple :

const { chromium } = require('playwright');

(async () => {

const browser = await chromium.launch({ headless: true });

const context = await browser.newContext({ storageState: 'state.json' }); // state.json = votre session exportée

const page = await context.newPage();

await page.goto('https://www.reddit.com/r/javascript/');

await page.waitForSelector('div[data-test-id="post-content"]', { timeout: 5000 }).catch(()=>{});

const posts = await page.$$eval('div[data-test-id="post-content"]', nodes => nodes.slice(0,5).map(n=>({

title: n.querySelector('h3')?.innerText || null,

text: n.querySelector('div[data-click-id="text"]')?.innerText || null,

url: n.querySelector('a[data-click-id="body"]')?.href || null

})));

console.log(JSON.stringify(posts, null, 2));

await browser.close();

})();

Remarques : exportez state.json depuis Playwright ou sauvegardez les cookies de votre navigateur afin que l'agent « voie » exactement ce que vous voyez.

Beaucoup de sites offrent des endpoints JSON/RSS publics. Exemple Reddit public : GET https://www.reddit.com/r/<subreddit>/new.json (avec User-Agent). Exemple cURL : curl -A 'MonAgent/1.0' 'https://www.reddit.com/r/javascript/new.json' | jq .data.children[].data | head -n 1

1) LinkedIn — Playwright avec session (scraper de page profil/fil d'actualité). 2) YouTube — yt-dlp pour métadonnées/transcription ou la page vidéo scrappée ; récupérer la transcription via yt-dlp --write-auto-sub. 3) Reddit — JSON public (new.json) ou Playwright. 4) X (Twitter) — préférer Nitter instance publique ou Playwright avec session (X limite l'API). 5) Google Maps — page lieu HTML via Playwright (scraper des avis publics). 6) Facebook — Playwright avec session (beaucoup de protections). 7) Instagram — Playwright ou pages publiques (mobile web) ; attention aux limitations. 8) TikTok — page publique + yt-dlp pour vidéos si besoin. 9) GitHub — API public pour repos publics ou HTML. 10) Product Hunt — pages publiques / RSS. 11) Medium — RSS / JSON public de la publication. 12) Hacker News — API publique (Firebase) ou HTML. 13) Pinterest — Playwright ou endpoints publics. Pour chaque plateforme, commencez avec le canal le moins protégé (RSS/JSON) avant d'automatiser un navigateur.

SYSTEM: Tu es un assistant qui ingère des fragments de contenu web. Attends les objets JSON et réponds par 'INGESTED n' si tout va bien.' USER: Je t'envoie un lot de fragments. Chaque fragment = {source, url, timestamp, author, text, media, metadata}. Tâches : 1) Valide structure. 2) Normalise timestamp en ISO8601. 3) Extrait les 3 mots-clés les plus pertinents. 4) Donne un résumé 1 phrase + niveau de confiance (0-100). RESPOND: retourne JSON array [{id, ok:true/false, normalized, keywords, summary, confidence}].

Exemple d'entrée (à envoyer après le system prompt): [{"source":"reddit","url":"...","timestamp":1670000000,"author":"u/test","text":"Exemple..."}]

Exemples :

Générez une image simple (PNG/SVG) montrant 3 boîtes horizontales : Collector → Normalizer → Claude Code Agent. Sous Collector lister les 13 logos (petits) ou noms ; sous Normalizer montrer fields JSON ; sous Agent montrer 'prompts' et 'actions' (ex : draft reply, create ticket). Si vous utilisez un outil d'image, créez un 1200x600 px, couleurs neutres. Si vous voulez, je peux générer un SVG à fournir séparément.

Tests recommandés : 1) Smoke test : récupérer 3 éléments, ingérer, demander résumé. 2) Robustesse : simuler 100 requêtes en rafale depuis Collector et observer blocages/CAPTCHA. 3) Quality : vérifier pour 50 fragments le taux d'éléments correctement parsés (objectif >= 85%). 4) Sécurité : vérifier que les cookies/session ne fuitent pas hors stockage chiffré.

Planifiez : 1) Jobs quotidiens pour vérifier endpoints publics (OK/KO). 2) Alertes (e-mail/Slack) si un sélecteur CSS commence à échouer. 3) Versioning des extracteurs (documenter date et utilisateur qui a modifié). 4) Re-validation GDPR/CCPA si vous conservez données utilisateurs.