I Build the Frontend Layer for AI Products — MCP, RAG & Agent UIs in Next.js

Berlin-based Full Stack Architect turning LLM and agent backends into production-ready, streaming, stateful frontend experiences.

Context

The two projects below are personal/portfolio builds, not client-commissioned work — they demonstrate the same production AI-frontend integration skills (Azure OpenAI, Vercel AI SDK, RAG, MCP) applied to real, deployed systems rather than demos.

The Problem

Teams build the LLM or RAG backend, but no one owns the frontend that streams responses, manages agent state, and holds up under real user load — so the AI feature stays stuck at demo quality instead of shipping to production.

What Was Built

Shekey RAG Agent

An end-to-end RAG chatbot built on Azure OpenAI and Microsoft Copilot Studio — chunking, embedding, retrieval, and prompt engineering — deployed live on shekeyweb.com as a recruiter-facing touchpoint, not a demo.

Grafana Observability Assistant

A Next.js app on GCP Cloud Run with Prometheus metrics and SLO-based Grafana alerting, plus an on-call AI assistant agent that interprets firing alerts and surfaces remediation steps.

Technical Approach

Streaming UI

Token-by-token response streaming, tool-call visualization, and graceful fallback states.

Agent State Management

Multi-turn conversation and tool-use state that survives reloads, retries, and errors.

MCP & Tool Integration

Wiring MCP servers and external tools into a UI users can actually trust.

Production Hardening

Rate limits, timeouts, cost-aware UX, and load testing before launch — not after.

Result

  • Both systems are live and deployed, not prototypes — the RAG agent runs in production on this site today
  • Demonstrates the same MCP/RAG/agent-state patterns applied to client work: production hardening, not demo-quality UI

Relevant Services

Have an AI Backend Without a Production Frontend?

Let's talk about turning your LLM, RAG, or agent backend into a UI that ships.

Or see the full profile & FAQ.