Vom KI-Chatbot zur MCP-App: Erst kommt die KI in die App – dann die App in die KI
Chatbots waren der erste Schritt. Die nächste Stufe ist, Anwendungen so zu bauen, dass sie selbst Teil von KI-Assistenten und Agenten werden. In diesem Workshop untersuchen wir drei verschiedene Szenarien wie wir unsere Applikationen mit KI-Integrationen für unsere Endbenutzer zugänglicher machen können.
Programm
Ausgangslage für den Workshop ist eine bestehende herkömmliche eCommerce Applikation.
Aufbauend auf dieser Applikation implementieren wir folgende drei Szenarios:
- Wir bauen einen Chatbot in unsere App ein um Endbenutzern die Funktionalität über einen Chat-Interface zugänglich zu machen.
- Wir bauen eine MCP-App um unsere App in einen KI-Assistenten (ChatGPT, Claude ...) einzubinden
- Wir erweitern unsere App mit WebMCP um die Funktionalität unsere Web-Applikation für KI-Agenten besser zugänglich zu machen.
Dabei stellen wir etliche Gemeinsamkeiten und Patterns bei den verschiedenen Ansätzen fest.
Die Übungen und Demos sind mit TypeScript realisert. Die Konzepte und Patterns sind aber durchaus in andern Programmiersprachen und Ökosystemen anwendbar.
Für die Übungen müssen die Teilnehmer selbst einen API Key für einen AI Provider (OpenAI, Anthropic oder Google) mitbringen, Instruktionen dazu erfolgen vor dem Workshop.
Kursziel
Sie lernen verschiedene Ansätze und Patterns kennen, wie sie ihre Applikation mit KI integrieren können, um einen Mehrwert für ihre Endbenutzer zu schaffen.
Sie erhalten einen Überblick und eine hands-on Einführung in folgende Technologien:
- Tool Calling als Basis um Applikations-Funktionalität einer KI zugängllich zu machen
- Vercel AI SDK und TanStack AI als Libraries um KI in Applikation einzubetten
- MCP und MCP-Apps als Standard um Funktionalität und Applikationen einem KI-Assistenten (ChatGPT, Claude …) zur Verfügung zu stellen
- WebMCP: ein neuer entstehender Browser-Standard (Preview) welcher es Web Applikationen erlaubt ihre Funktionalität clientseitig für KI Agenten zu exponieren.
Adressaten:
Klassische Applikationsentwickler, Architekten und technologie-affine Product-Owner, welche mögliche "real-world" Anwendungsfälle für AI kennenlernen möchten.
Jonas Bandi ist freiberuflicher Entwickler, Consultant und Trainer mit dem Fokus, moderne Frontend-Entwicklung in Enterprise-Projekte zu bringen. Mit einem Hintergrund in Java & .NET arbeitet er heute primär mit JavaScript, Angular und React.
Er hat Dutzende von In-House-Workshops in der ganzen Schweiz durchgeführt und ist an der Berner Fachhochschule (BFH) verantwortlich für das CAS "Moderne Frontendentwicklung".