AppContext MCP

officiel

AppContext donne à votre agent de codage IA un aperçu visuel instantané de ce que vous développez, afin qu'il puisse corriger les problèmes, affiner l'interface utilisateur et accélérer votre flux de développement en temps réel.

Que pouvez-vous faire avec App Context MCP ?

  • Capturer des captures d'écran du simulateur iOS — Demandez à votre IA de voir l'écran actuel de votre application en utilisant capture_simulator_screenshot pour un retour visuel en temps réel.
  • Diffuser les logs du bundler Metro — Laissez votre IA lire la sortie de construction React Native en direct via get_metro_logs pour diagnostiquer les erreurs de bundling sans copier-coller manuel.
  • Capturer des captures d'écran du navigateur web — Permettez à votre IA d'inspecter l'interface utilisateur rendue de votre application web avec capture_web_screenshot pour identifier les problèmes de mise en page ou de style.
  • Récupérer les logs de la console du navigateur — Demandez à votre IA de récupérer les erreurs et avertissements d'exécution en utilisant get_console_logs pour un débogage plus rapide.

Documentation

AppContext - Donnez des yeux à votre IA.

AppContext offre à votre agent de codage IA un aperçu visuel instantané de vos applications iOS et web, afin qu'il puisse corriger les problèmes, peaufiner l'interface utilisateur et accélérer votre flux de développement en temps réel. Réduisez le gaspillage de tokens grâce à moins d'allers-retours dans les invites.

Support des plateformes

Prise en charge complète des simulateurs iOS et des navigateurs web aujourd'hui. Android et bien plus à venir prochainement.

Disponible maintenant

  • Simulateurs iOS (Retour visuel en temps réel)

  • React Native / Expo (Streaming des logs du bundler Metro)

  • Applications Web (Captures d'écran et logs de console via Chrome DevTools)

À venir prochainement

  • Émulateurs Android (Contexte visuel et logs pour Android)

  • Applications de bureau (Surveillance d'applications Electron)

  • Appareils physiques (Tests sur du matériel réel)

Fonctionne parfaitement avec vos outils préférés

AppContext s'intègre automatiquement avec les éditeurs de code IA et les frameworks de développement via le Model Context Protocol (MCP)

  • Cursor
  • Claude Code
  • Windsurf
  • Expo

Comment ça marche

S'exécute dans votre barre de menus. Capture les visuels et les logs. Les fournit à votre IA.

Capturer

Diffuse des vues en direct des simulateurs iOS et des navigateurs web, ainsi que les logs d'exécution de Metro et des consoles de navigateur.

Servir

Publie le contexte localement via MCP. Fonctionne avec Cursor, Claude Code et Windsurf. S'exécute 100 % hors ligne sur votre machine.

Corriger

Votre IA voit l'état réel de votre application. Corrige les erreurs et peaufine l'interface utilisateur en temps réel. Pas d'explications, pas de conjectures.

S'exécute discrètement dans votre barre de menus. Mises à jour automatiques. Toujours prêt. Téléchargez une fois, connectez-vous une fois, c'est fait.

Tarification simple

Choisissez le forfait qui vous convient.

Mensuel

Paiement mensuel, annulez à tout moment

9,99 $/mois

  • Flux de contexte continu (temps réel)
  • Logs en direct du bundler Metro
  • Jeton de licence hors ligne (30 jours)
  • Annulez à tout moment

Annuel

Facturation annuelle, économisez 17 %

99 $/an

  • Flux de contexte continu (temps réel)
  • Logs en direct du bundler Metro
  • Jeton de licence hors ligne (30 jours)
  • 17 % d'économies par rapport au mensuel

Installation d'AppContext

Suivez ces étapes pour faire fonctionner AppContext avec votre environnement de développement

  1. Télécharger et installer (macOS 13+)

    Processus d'installation simple :
    Télécharger pour Mac
    1. Cliquez sur "Télécharger pour Mac" → Ouvrez le fichier .dmg
    2. Faites glisser AppContext dans votre dossier Applications
    3. Lancez AppContext - il apparaît sous forme d'icône dans votre barre de menus
  2. S'abonner à AppContext Pro

    AppContext nécessite un abonnement Pro pour capturer les vues en direct et les logs.
    • Ce site web : Faites défiler jusqu'à la tarification ci-dessous afin d'être déjà authentifié lorsque vous vous connecterez à l'application de bureau
    • Application de bureau : Cliquez sur l'icône de la barre de menus → "S'abonner à Pro" → Choisissez votre forfait
      Activation instantanée — aucune clé de licence nécessaire. Fonctionne hors ligne une fois activé pour une intégration LLM locale sans exposition du code.
  3. Connectez-vous avec votre email

    Cliquez sur l'icône de la barre de menus et connectez-vous :
    1. Sélectionnez "Connexion" → Entrez votre email
    2. Vérifiez votre email et cliquez sur le lien magique pour vous authentifier
      Si vous vous êtes d'abord abonné via le site web, vous êtes déjà authentifié et prêt à démarrer !
  4. Connectez-vous à votre éditeur IA

    Une fois connecté, votre IA verra les vues en direct de vos simulateurs iOS et navigateurs web, lira les logs du bundler Metro et de la console, et cessera de vous demander de coller des captures d'écran ou des messages d'erreur.

Pour les utilisateurs de Claude Code :

claude mcp add --transport sse appcontext http://localhost:7777/sse

Exécutez cette commande dans votre terminal, puis redémarrez Claude Code pour l'activer.

Pour les utilisateurs de Cursor : Installation en un clic

Ajouter à Cursor

Pour les autres plateformes (Windsurf, Continue, etc.)

  1. Ouvrez les paramètres MCP de votre éditeur IA
  2. Ajoutez un nouveau serveur MCP
  3. Utilisez cette configuration :
{
  "appcontext": {
    "url": "http://localhost:7777/sse",
    "type": "sse"
  }
}