Communitygithub.com

BIGboss248/nextjs-wordpress

Orchestrez l'automatisation parallèle de navigateurs en utilisant plusieurs instances MCP Chrome DevTools. À utiliser lorsqu'une tâche nécessite d'effectuer la même action de navigateur sur plusieurs cibles simultanément (par exemple, soumettre des formulaires de contact, remplir des candidatures, scraper des pages nécessitant le rendu JS). Démarrez 1 à 5 agents Chrome en parallèle.

Qu'est-ce que nextjs-wordpress ?

Cette compétence permet de coordonner plusieurs agents Claude Code, chacun avec son propre navigateur Chrome, pour exécuter des tâches de navigation simultanément. Elle est idéale pour les tâches répétitives comme la soumission de formulaires de contact, le remplissage de candidatures ou le scraping de pages nécessitant un rendu JavaScript, où une exécution séquentielle serait trop lente. La compétence repose sur l'outil Chrome DevTools MCP et utilise une architecture de dossier partagé (`chat.md`) pour la coordination entre les agents. Le processus comprend le lancement d'instances Chrome sur des ports distincts (9223-9227), l'assignation de tâches via un fichier de chat central, l'exécution par chaque agent de ses tâches assignées, et le suivi des progrès via des balises (`[WORKING]`, `[DONE]`, `[ERROR]`, `[WAITING]`). Un mécanisme de nettoyage (`kill_chrome.sh`) permet de fermer toutes les instances Chrome une fois le travail terminé. Des cas particuliers comme les CAPTCHA, les limitations de débit ou l'authentification sont traités.

Compatible avec✓Claude Code~Codex CLI~Cursor
npx skills add https://github.com/BIGboss248/nextjs-wordpress/tree/HEAD/.agents/skills/multi-agent-chrome

Demander à votre IA préférée

Ouvre une nouvelle conversation avec cette compétence d'agent déjà préchargée.

Documentation

Orchestrateur Multi-Agent Chrome

Lancez 1 à 5 agents Claude Code en parallèle, chacun avec son propre navigateur Chrome, pour effectuer des tâches de navigation simultanément.

Quand l'utiliser

  • Soumettre des formulaires de contact sur une liste de sites Web
  • Remplir des candidatures sur plusieurs plateformes
  • Scraper des pages rendues par JS qui nécessitent une interaction réelle avec le navigateur
  • Toute tâche de navigation répétitive où l'exécution séquentielle est trop lente

Architecture

Business workspace (orchestrateur)
├── active/multi-chrome-agent/
│   ├── chat.md                    # Fichier de coordination partagé
│   ├── launch_chrome.sh           # Génère des instances Chrome sur les ports 9223-9227
│   ├── kill_chrome.sh             # Détruit toutes les instances Chrome
│   ├── chrome-agent-1/            # Espace de travail pour l'Agent 1
│   │   ├── .mcp.json              # Chrome DevTools sur le port 9223
│   │   └── CLAUDE.md              # Instructions de comportement de l'agent
│   ├── chrome-agent-2/            # Port 9224
│   ├── chrome-agent-3/            # Port 9225
│   ├── chrome-agent-4/            # Port 9226
│   └── chrome-agent-5/            # Port 9227

Orchestration étape par étape

1. Déterminez le nombre d'agents nécessaires

Examinez la tâche. S'il y a 10 formulaires de contact à remplir, 3 à 5 agents suffisent. S'il y en a 3, utilisez 2 à 3. Ne sur-allouez pas.

2. Lancez les instances Chrome

bash /Users/nicksaraev/Business/active/multi-chrome-agent/launch_chrome.sh [NOMBRE]

Cela génère NOMBRE instances Chrome sur les ports 9223+. Attendez la confirmation "PRÊT" pour chacune.

3. Réinitialisez le fichier de chat

Effacez le fichier de chat et écrivez les affectations de tâches :

# Chat Multi-Agent Chrome

## Orchestrateur
[2026-03-05 14:30] Lancement de 3 agents pour la soumission de formulaires de contact.

### Tâches de l'Agent 1
1. Aller sur https://example1.com/contact -> remplir nom : "Nick Saraev", email : "[email protected]", message : "Bonjour, je suis intéressé par..."
2. Aller sur https://example2.com/contact -> même remplissage de formulaire

### Tâches de l'Agent 2
1. Aller sur https://example3.com/contact -> remplir le formulaire
2. Aller sur https://example4.com/contact -> remplir le formulaire

### Tâches de l'Agent 3
1. Aller sur https://example5.com/contact -> remplir le formulaire
2. Aller sur https://example6.com/contact -> remplir le formulaire

## Agent 1

## Agent 2

## Agent 3

4. Générez les agents Claude Code

Pour chaque agent, ouvrez un nouveau terminal et exécutez :

cd /Users/nicksaraev/Business/active/multi-chrome-agent/chrome-agent-N && claude

Où N est 1 à 5. Chaque agent va :

  • Récupérer son CLAUDE.md (instructions de travail du navigateur)
  • Se connecter à son instance Chrome via son .mcp.json local
  • Lire chat.md pour ses affectations de tâches
  • Exécuter les tâches et signaler l'état dans chat.md

Lancement programmatique via osascript : Claude Code bloque les sessions imbriquées via la variable d'environnement CLAUDECODE. Pour lancer des agents programmatiquement depuis une session existante, utilisez osascript avec env -u pour supprimer les variables d'environnement bloquantes :

for i in 1 2 3 4 5; do
    osascript -e "tell application \"Terminal\" to do script \"cd /Users/nicksaraev/Business/active/multi-chrome-agent/chrome-agent-$i && env -u CLAUDECODE -u CLAUDE_CODE_ENTRYPOINT -u CLAUDE_AGENT_SDK_VERSION -u CLAUDE_CODE_ENABLE_SDK_FILE_CHECKPOINTING -u CLAUDE_CODE_EXPERIMENTAL_AGENT_TEAMS claude --dangerously-skip-permissions -p 'Vous êtes l\"Agent $i. Lisez /Users/nicksaraev/Business/active/multi-chrome-agent/chat.md, trouvez vos tâches sous Agent $i et exécutez-les. Utilisez Chrome DevTools MCP pour parcourir les sites Web, rechercher des listes et collecter des données. Écrivez vos résultats sous forme de tableau Markdown dans chat.md sous la section Agent $i. Marquez-vous comme [WORKING] pendant l\"activité et [DONE] une fois terminé.'\""
    sleep 2
done

Cela ouvre des fenêtres Terminal.app séparées, chacune exécutant une session Claude Code indépendante avec son propre Chrome DevTools MCP.

Solution de repli manuelle : Si osascript ne fonctionne pas, dites à l'utilisateur d'ouvrir N onglets de terminal :

Onglet 1 : cd ~/Business/active/multi-chrome-agent/chrome-agent-1 && claude
Onglet 2 : cd ~/Business/active/multi-chrome-agent/chrome-agent-2 && claude
...

5. Surveillez la progression

Lisez périodiquement le fichier de chat pour vérifier l'état des agents :

cat /Users/nicksaraev/Business/active/multi-chrome-agent/chat.md

Recherchez les balises [DONE], [ERROR] ou [WORKING] de chaque agent.

6. Nettoyage

Lorsque tous les agents signalent [DONE] :

bash /Users/nicksaraev/Business/active/multi-chrome-agent/kill_chrome.sh

Protocole de Chat

Les agents communiquent via le fichier partagé chat.md :

BaliseSignification
[WORKING]L'agent est en train de traiter activement une tâche
[DONE]L'agent a terminé toutes les tâches assignées
[ERROR]L'agent a rencontré un obstacle (CAPTCHA, timeout, etc.)
[WAITING]L'agent est inactif, en attente de nouvelles tâches

Tableau des Ports

AgentPort ChromeEspace de travail
19223chrome-agent-1/
29224chrome-agent-2/
39225chrome-agent-3/
49226chrome-agent-4/
59227chrome-agent-5/

Le port 9222 est réservé au Chrome DevTools MCP principal (non parallèle).

Cas particuliers

  • CAPTCHA : L'agent signale [ERROR] CAPTCHA sur https://... dans le chat. L'orchestrateur peut réassigner ou ignorer.
  • Limitation de débit : Si un site bloque après N requêtes, répartissez les URL sur plus d'agents afin que chacun atteigne le site moins de fois.
  • Connexion requise : Pré-authentifiez dans chaque instance Chrome avant d'assigner des tâches, ou incluez les étapes de connexion dans la liste des tâches.
  • Tâches longues : Les agents vérifient chat.md toutes les 30 secondes. Si l'orchestrateur doit annuler, écrivez [ABORT] dans la section Orchestrateur.

Individual skills in this repo

This repo contains 20 individual skills — each has its own dedicated page.

BIGboss248/nextjs-wordpress

Create, configure, manage, and validate Google Antigravity customizations including skills, rules, MCP servers, lifecycle hooks, plugins, and custom JSON configs. Use when adding new capabilities to Antigravity, configuring MCP servers, writing rules, creating skills, setting up hooks, or modernizing legacy workflows.

BIGboss248/nextjs-wordpress

Spawn multiple agents into a shared conversation where they debate, disagree, and converge on a solution via a shared chat.json file. Use for architecture decisions, code review debates, design trade-offs, or any problem that benefits from adversarial reasoning. Triggers on "chatroom", "agent debate", "have agents discuss", "agent chatroom", "debate this", or /agent-chatrooms. Also triggers on phrases like "have 3 agents argue about", "multi-agent discussion", or "let them debate".

BIGboss248/nextjs-wordpress

Always-active code intelligence, search, and navigation skill utilizing the codebase-memory MCP server. Enforces an index-first protocol (verifying and refreshing the knowledge graph via index_repository or index_status before searching, required because background auto_watch is disabled to eliminate editor stutter and system lag), followed by graph-first exploration (search_graph, trace_path, get_code_snippet, query_graph, get_architecture, detect_changes) instead of naive text grep or full-file reads. Always activate before searching the codebase, inspecting unknown architecture, finding symbols, or tracing callers/callees.

BIGboss248/nextjs-wordpress

>- Discover, interview, and craft comprehensive UX/UI design specifications (design-spec.md) and design tokens for web components. Triggers on "/component-design", "design component", "design section", "design UI", "wireframe component", or "create design spec".

BIGboss248/nextjs-wordpress

>- Configure and query WooCommerce APIs including WPGraphQL, WooGraphQL, and JWT auth for headless frontends. Use when connecting Next.js to WooCommerce or fetching store catalog data.

BIGboss248/nextjs-wordpress

Workflow for spawning an independent subagent to conduct unbiased code reviews and inject adversarial edge-case tests ([ComponentName].edge.test.tsx).

BIGboss248/nextjs-wordpress

>- Build Next.js App Router React components with Suspense skeletons, semantic OKLCH tokens, Jest + RTL unit tests, Playwright visual/hydration checks, and Tailwind logical styling. Triggers on "/nextjs-component-dev", "create component", "new component", "build component", or "develop component".

BIGboss248/nextjs-wordpress

>- Bootstrap, configure, and verify the complete Next.js App Router development environment, developer tooling, testing suites, MCP servers, Docker containerization, and CI/CD. Triggers on "/nextjs-dev-setup", "setup nextjs dev environment", "start a nextjs project", or "containerize nextjs app".

BIGboss248/nextjs-wordpress

>- Configure production health monitoring endpoints (/api/health), Docker Compose probes, and runtime metrics in Next.js App Router applications. Use when asked to "setup health check", "add health endpoint", "docker compose healthcheck nextjs", "configure health monitor", or "/nextjs-healthcheck".

BIGboss248/nextjs-wordpress

Bootstrap, configure, and verify next-intl App Router internationalization (proxy.ts/middleware.ts, next/root-params, [locale] layout, routing). Triggers on "/nextjs-i18n-setup", "setup i18n", "install next-intl", "configure next-intl", "add internationalization", "setup locale routing", "migrate to [locale]".

BIGboss248/nextjs-wordpress

Read/write translation dictionaries (messages/[locale].json), next-intl hooks (getTranslations/useTranslations), providers (Storybook/tests/subtrees), and BiDi styling. Triggers on "/nextjs-i18n-usage", "i18n dictionary", "use translations", "read dictionary", "i18n provider", "next-intl hooks", "storybook i18n", "test i18n", "add translation keys", "localize component", "create a component", "update a component".

BIGboss248/nextjs-wordpress

>- Configure, test, and verify OpenTelemetry (OTel) observability in Next.js App Router applications. Triggers on "/nextjs-otel", "setup otel", "configure opentelemetry", "test otel", or "verify opentelemetry".

BIGboss248/nextjs-wordpress

Step-by-step workflow for designing and building Next.js App Router pages (RSC page.tsx, loading skeleton, metadata, JSON-LD schema, and dynamic static params). Triggers on "/nextjs-page-dev", "create page", "new page", "develop page", "build route", or "implement page".

BIGboss248/nextjs-wordpress

>- Orchestrate end-to-end planning for Next.js App Router projects, generating canonical specifications, design systems, and a 7-phase modular implementation roadmap in docs/plan/. Triggers on "/nextjs-plan", "plan a nextjs project", "plan nextjs app", "create nextjs project plan", "outline nextjs architecture", or "generate plan".

BIGboss248/nextjs-wordpress

Workflow and engineering standards for crafting co-located Storybook CSF3 stories ([ComponentName].stories.tsx) with interactive controls, action spies, and 4 canonical theme variants.

BIGboss248/nextjs-wordpress

>- Build Next.js e-commerce frontends backed by WooCommerce APIs, handling ISR catalogs, cart sessions, and JWT authentication. Use when building or querying Next.js stores with WooCommerce.

BIGboss248/nextjs-wordpress

Self-correcting rules engine and feedback loop that learns from user corrections, mistakes, and project-specific constraints by maintaining a persistent autofix ruleset. Scans learned rules before starting any task, resolves conflicts, and automatically appends new rules upon corrections. Triggers on user corrections ("no, do it this way", "never do X", "always use Y"), /learn, "self repair", "add rule", "update rules", or when diagnosing assumptions and bugs. CRITICAL ALWAYS-ACTIVE LIFECYCLE SKILL. Must always be kept in context, loaded at session start, and consulted before starting ANY task to read and apply active constraints from autofix.json. MUST ALWAYS be triggered immediately whenever the user provides ANY correction, preference, criticism, rejection of an approach, or adjustment ("no", "don't do X", "use Y", "remember", "prefer"), or when any mistake/bug is identified. Automatically and immediately formulates and appends the new imperative rule to the project's autofix.json ruleset file.

BIGboss248/nextjs-wordpress

Setup, automate, and execute SEO audits, CI/CD pre-push/pre-deploy checks, and ranking optimizations using the seo CLI and MCP server.

BIGboss248/nextjs-wordpress

End-to-end repository onboarding and development environment setup skill. Scans repository structure, configures project metadata (docs/project.json), sets up the codebase-memory-mcp code intelligence knowledge graph server (in workspace mcp.json and globally for AGY only), configures git hooks with Husky and Commitlint, establishes multi-stage production Docker containerization, and automates credit-optimized Release Please CI/CD with multi-arch (AMD64 & ARM64) GHCR package deployment. Triggers on "/setup-repository", "setup repository", "setup repo", "initialize repository", "new repo setup", or when preparing any repository for development and AI agent workflows.

BIGboss248/nextjs-wordpress

AI screen scaffolding, layout generation, and variant exploration workflow powered by Google Stitch (StitchMCP). Consumes a component design specification (docs/design/components/[page name]/[component name]/design-spec.md), verifies and reuses the central Stitch project in docs/project.json (or creates/persists one if absent), seeds the project's design system into Stitch, synthesizes layout prompts to generate a screen and create one variant of the given design spec file, downloads and saves Stitch JPG screenshots and HTML code files directly into docs/design/components/[page name]/[component name]/stitch/ using binary-safe PowerShell Invoke-WebRequest, outputs image prompts to the user if visual assets are needed (without calling generate_image to conserve tokens), updates design-spec.md with Stitch layout benchmarks, and audits asset download integrity with an independent subagent. Triggers on "/stitch-design", "generate stitch screen", "create stitch variant", "scaffold screen with stitch", or "stitch...

Skills associés