Building a LangGraph RAG Agent from Scratch — with a Live UI That Shows Every Step

I built a learning project that teaches LangChain and LangGraph step by step — starting from a raw LLM call and ending with a full ReAct agent backed by RAG, streamed over SSE to a React UI that visualises every node in the agent loop in real time.

This post walks through the whole thing: what each concept does, how it connects to the next, and how the live pipeline view works.

What we're building

frontend/ ← React + Vite chat UI (live agent loop visualisation)

backend/ ← FastAPI server wrapping the RAG agent