What if your iPhone could talk to your own MCP servers anywhere? That is exactly what I built with MCP iOS app MCP Connect, a native mobile client for the Model Context Protocol. In this article, I explain how I designed, shipped, and deployed it, and why this approach matters if you want real AI tools on mobile.
Was ist MCP Connect?
MCP Connect ist meine MCP-iOS-App zum Verbinden mit MCP-Servern über HTTP, zum Durchsuchen von Tools und zum Chatten mit KI – unterwegs. Ich habe sie in Swift und SwiftUI gebaut, damit sie sich auf dem iPhone nativer, schnell und stabil anfühlt.
Die App ermöglicht dir:
Ich wollte, dass sich die App hochwertig anfühlt – nicht wie ein Wrapper. Deshalb habe ich sie mit einem Dark-Cinema-Style entworfen, mit Glassmorphism, Spring-Animationen und haptischem Feedback. Diese Designentscheidung ist wichtig, weil mobile KI-Tools sich schnell und klar anfühlen müssen – besonders dann, wenn Nutzer zwischen Chats und Servern wechseln.
Warum ich eine MCP-iOS-App gebaut habe
Ich habe diese MCP-iOS-App gebaut, weil ich direkten Zugriff auf meine eigenen Tools von meinem Telefon aus wollte. Workflows, die nur am Desktop funktionieren, bremsen dich aus, wenn du nicht an deinem Schreibtisch bist. Auf dem iPhone wollte ich die gleiche Kontrolle, die ich bereits im Browser und auf meinem Mac habe.
Aus meiner Erfahrung beim Entwickeln von Produkten in Göteborg gilt: Die besten Mobile Apps lösen ein schmerzhaftes, enges Problem besonders gut. MCP Connect macht das für mich. Es gibt mir sicheren Zugriff auf meine MCP-Server – und zwar ohne eine weitere komplizierte Schicht hinzuzufügen.
Das passt auch zur Ausrichtung des Model Context Protocol selbst. Anthropics MCP-Spezifikation ist um ein sauberes Client-Server-Modell herum gebaut, was es zu einer starken Grundlage für Mobile Apps macht, die strukturierten Tool-Zugriff benötigen. Ich habe die Implementierung an dieser Idee ausgerichtet, damit die App wartbar bleibt, während sich das Protokoll weiterentwickelt.
Das Nutzerproblem, das ich gelöst habe
Die meisten KI-Tools gehen noch immer davon aus, dass man am Desktop sitzt. Das bricht, wenn du unterwegs einen Server prüfen, ein Tool auslösen oder ein Ergebnis inspizieren musst. Mit MCP Connect habe ich diese Reibung reduziert.
Das Ergebnis ist simpel: Ich kann die App öffnen, einen Server auswählen und in Sekunden mit meinen Tools interagieren. Genau darum geht es bei der MCP-iOS-App.
Der Tech-Stack hinter der MCP-iOS-App
Ich habe den Stack bewusst fokussiert und modern gehalten. Ich wollte keine aufgeblähte Architektur oder unnötige Abhängigkeiten.
| Layer | Technologie |
|---|---|
| --- | --- |
| Platform | iOS 17+, Swift 6, SwiftUI |
| Architektur | MVVM + Coordinators |
| Backend | Supabase (Auth, PostgreSQL, Realtime) |
| MCP Transport | JSON-RPC über HTTP |
| Persistence | SwiftData |
| IAP | StoreKit 2 |
| i18n | String Catalogs (EN + SV) |
| Deployment | Xcode + XcodeGen |
Dieser Stack gab mir eine starke Basis für die MCP-iOS-App. SwiftUI hat die Oberfläche gut gelöst, SwiftData unterstützt Offline-First-Storage, und Supabase liefert Authentifizierung und Sync ohne zusätzlichen Backend-Overhead.
Ich habe außerdem vertraute Production-Tools genutzt – etwa Keychain für Secrets und StoreKit 2 für Abos. So blieb die App auf Produktqualität fokussiert, statt auf Infrastruktur-Rauschen.
Schritt 1: Ich habe zuerst das System entworfen
Ich starte immer mit dem Designsystem, weil es später Zeit spart. In diesem Projekt habe ich die Tokens und gemeinsam genutzten Komponenten gebaut, bevor ich Feature-Code geschrieben habe.
Die Dark-Cinema-Palette nutzt tiefe Schwarztöne, subtil erhöhte Oberflächen und einen Indigo-Akzent. Jede Oberfläche verwendet eine Glassmorphism-Behandlung mit `.ultraThinMaterial` und einem dünnen Rand, sodass die UI geschichtet wirkt, aber nicht schwer.
Das System umfasst:
Ich habe wiederverwendbare Komponenten wie `GlassCard`, `AccentButton`, `StatusBadge`, `ShimmerLoader` und `GlassTextField` gebaut. Das machte die MCP-iOS-App leichter skalierbar, weil neue Screens die gleiche visuelle Sprache übernahmen.
Schritt 2: Ich habe Modelle von Persistence getrennt
Ich habe Domain-Modelle von SwiftData-Persistence-Modellen getrennt. So blieb die Business-Logik sauber und testbar.
Die wichtigsten Modelle sind:
Diese Trennung war wichtiger als es klingt. Sie gab mir Raum, Storage-Details zu ändern, ohne die App-Logik neu zu schreiben. Für eine MCP-iOS-App macht diese Art von Boundary zukünftige Features leichter lieferbar.
Sicherheitsentscheidung: Keychain nur für API-Keys
Ich habe eine Regel festgelegt, die ich nicht brechen würde: API-Keys berühren niemals Supabase. Ich speichere nur einen `apiKeyRef` in der Datenbank, während der eigentliche Key in der iOS Keychain lebt.
Das bedeutet: Ein Datenbank-Leak legt keine Credentials offen. Der Tradeoff ist, dass Keys nicht automatisch über Geräte hinweg synchronisiert werden. Nutzer müssen sie auf einem neuen Telefon erneut eingeben, aber das dauert nur Sekunden und entfernt ein ernstes Sicherheitsrisiko.
Schritt 3: Ich habe den MCP-Client gebaut
Der Client nutzt JSON-RPC über HTTP, was dem Streamable-HTTP-Transport in der MCP-Spezifikation entspricht. Jede Anfrage geht als standardmäßiges HTTP-POST mit einem JSON-RPC-Body raus.
Die App unterstützt vier zentrale Operationen:
Ich lade Authorization-Tokens zur Anfragezeit aus der Keychain. Das hält die MCP-iOS-App sicher und vermeidet, Secrets länger als nötig im Speicher zu halten.
Ich habe das gegen meine eigenen Server getestet, bis der Request-Flow sich unter realer Nutzung stabil anfühlte. Das Ergebnis waren vorhersehbare Latenzen und eine deutlich bessere Mobile Experience, als ich am Anfang erwartet hatte.
Schritt 4: Ich habe Supabase angebunden
Ich habe Supabase für Auth und Sync genutzt, weil es mir einen schnellen Weg in Richtung Production gibt. Das Backend hat vier Tabellen:
Jede Tabelle hat Row Level Security. Das bedeutet: Nutzer können nur auf ihre eigenen Datensätze zugreifen. Außerdem habe ich einen Datenbank-Trigger hinzugefügt, der automatisch ein Profil nach dem Signup erstellt.
Auth unterstützt Sign in with Apple und email/password. Das gab mir einen sauberen Signup-Flow, ohne Nutzer in eine Login-Methode zu zwingen. Für eine MCP-iOS-App hilft diese Flexibilität bei der Akzeptanz.
Schritt 5: Ich habe die wichtigsten Features gebaut
Die App hat drei zentrale Bereiche: Chat, Serververwaltung und Einstellungen. Ich habe jeden davon fokussiert gehalten, damit die Experience auf dem Telefon schnell bleibt.
Chat-Interface
Der Chat nutzt eine State Machine: `idle` → `sending` → `streaming` → `toolCalling` → `idle`. Tool-Calls erscheinen inline als ausklappbare Cards mit dem Tool-Namen, den Argumenten, dem Ergebnis und der Ausführungszeit.
Diese UI ist wichtig, weil sie Nutzern hilft, dem zu vertrauen, was die KI tut. Sie sehen jeden Schritt, statt zu raten.
Serververwaltung
Nutzer können Server hinzufügen, bearbeiten und löschen. Ich habe URL-Validierung, Wisch-zum-Löschen und Bestätigungsdialoge ergänzt, damit sich Serveränderungen sicher und bewusst anfühlen.
Jede Server-Detailansicht zeigt Gesundheitsdaten, Latenz-Charts mit Swift Charts und einen Tool Explorer, der die verfügbaren Tools sowie Parameter-Schemas auflistet. So wurde die MCP-iOS-App nützlicher als eine reine Chat-Frontend.
Navigation und Einstellungen
Ich habe ein Drei-Tab-Layout mit `NavigationStack` und typgesicherten Routen verwendet. Deep Linking funktioniert über das `mcpconnect://` URL-Schema.
Die Einstellungen umfassen:
Schritt 6: Ich habe den MCP-Server-Endpoint deployed
Der schwierigste Teil war, einen stdio-basierten MCP-Server von Mobile aus erreichbar zu machen. Mein persönlicher Site-MCP-Server lief ursprünglich als lokaler Node.js-Prozess mit `StdioServerTransport`.
Um ihn für die MCP-iOS-App zugänglich zu machen, habe ich eine API-Route zu meiner Next.js-Site auf Vercel hinzugefügt. Die Route nutzt das MCP SDK `InMemoryTransport`, um JSON-RPC-Requests in die lokale Server-Implementierung zu überbrücken.
Jede Anfrage erstellt ein frisches Server/Client-Paar mit `createLinkedPair()`, führt die Operation aus und gibt die Response zurück. Dieser Ansatz passt gut zu serverless Infrastruktur, weil er keine lang laufenden Verbindungen vermeidet.
Der Endpoint liegt unter `https://uygarduzgun.com/api/mcp` und stellt 15 Tools bereit, die ich von jedem MCP-Client aus aufrufen kann. So wurde ein lokaler Tool-Server zu einem Mobile-ready Service, ohne das komplette Backend neu zu designen.
Warum diese Architektur funktioniert
In der Praxis funktioniert es, weil jede Anfrage zustandslos und isoliert ist. Das reduziert das operative Risiko und macht Skalierung deutlich einfacher. Wenn du eine MCP-iOS-App baust, lohnt sich dieses Muster für serverless Deployments.
Schritt 7: IAP und Monetarisierung
Ich habe StoreKit 2 für ein simples Free/Pro-Modell genutzt. Der Free-Tarif ist nutzbar, aber der Pro-Tarif entfernt die Limits, auf die Power-User am schnellsten stoßen.
| Feature | Free | Pro ($4.99/mo) |
|---|---|---|
| --- | ---: | ---: |
| Servers | 2 | Unlimited |
| Conversations | 50 | Unlimited |
| History | 30 Tage | Unlimited |
| Themes | Dark + Light | + custom accent |
| Search | Aktueller Chat | Full-text all |
Ich mag dieses Modell, weil es Casual-Nutzer nicht bestraft. Es gibt genug Wert direkt am Anfang, und erweitert sich dann natürlich, wenn die App Teil eines echten Workflows wird.
Projektstatistiken und Ergebnisse
Der Build wurde am Ende größer als erwartet, aber die Struktur blieb sauber.
Diese Zahlen sind wichtig, weil sie zeigen, dass die App production-ready ist – nicht nur ein Prototyp. Ich wollte eine echte MCP-iOS-App, und ich habe eine ausgeliefert.
Bilder, die ich für diesen Artikel hinzufügen würde
Wenn ich diesen Post veröffentliche, würde ich Screenshots mit beschreibendem Alt-Text einfügen, um Lesern zu helfen und SEO zu verbessern.
Kernaussagen
MCP Connect zeigt, dass die MCP-iOS-App-Idee praktisch, sicher und bereit für den echten Einsatz ist. Wenn du mobile KI-Tools baust, kann diese Architektur dir Zeit sparen und das Risiko reduzieren. Lies den verwandten Post zu audio signal levels explained oder hinterlasse einen Kommentar, wenn du möchtest, dass ich als Nächstes den Server-Code aufschlüssele.