Teaching a Computer to Read Your Documents

Building a RAG-powered document Q&A system

Python · React · TypeScript · FastAPI · LangChain · ChromaDB

Kevin Lin 4 min read ·  2026

Have you ever wished you could just ask a document a question and get a real answer, not a keyword search or a list of pages to read, but an actual response that understands what you mean?

That’s exactly what I built with RAG: a Retrieval-Augmented Generation (RAG) system that lets you have a natural conversation with your PDF documents.

The application interface: upload a document, ask a question, read the answer.

The Problem

Reading through dense documents to find one specific piece of information is tedious. Whether it’s a research paper, a technical manual, or a set of lecture notes, the process is always the same: open the file, search for keywords, read surrounding paragraphs, and hope you found what you needed.

This motivated me to build a RAG system where you give it your PDF file and a question in plain English, and get a direct, accurate answer drawn from the contents of the file itself.

How It Works

The system has two main components: document management and the Retrieval-Augmented Generation (RAG) step itself.

Document Management

The user supplies the PDF file.

1. Process the document - the PDF is loaded, split into overlapping chunks, and converted into vector embeddings that capture semantic meaning.

      2. Store the chunks in a vector database - ChromaDB indexes these embeddings so they can be searched efficiently by meaning, not just keywords.

Retrieval-Augmented Generation

The user gives a query to the system.

3. Retrieve relevant chunks - when you ask a question, the system finds the most relevant chunks in the vector database.

4. Augment the prompt - using the contents of the retrieved chunks, the system augments a predefined prompt so that it contains both the query and the context needed to answer it.

5. Generate the answer - the augmented prompt is passed to the language model, orchestrated through LangChain's agent framework, and the model generates a grounded, document-specific response.

What I Built

Document Ingestion Pipeline

The pipeline handles everything from raw PDF to searchable knowledge base: loading the file, splitting it into chunks with configurable overlap, generating embeddings, and indexing them in ChromaDB. The system supports multiple documents, with efficient filtering to query across all of them or within a specific document.

FastAPI Backend

A clean FastAPI backend handles real-time queries, exposing the retrieval-and-generation flow through a simple REST API that any frontend or terminal interface can call.

React + TypeScript Frontend

On top of the backend, I built a React and TypeScript frontend that connects to the FastAPI backend for interactive querying and displays the generated answers in real time. With this frontend, users can directly use the application for their needs.

Tech Stack

Backend

• Python

• FastAPI

• LangChain

• ChromaDB

Frontend

• React

• TypeScript

Concepts

• Retrieval-Augmented Generation (RAG)

• Semantic Search

• Vector Embeddings

• LLM Applications

•  LangChain Agent Framework

What I Learned

Chunking strategy matters more than I expected. Chunks that are too small lose context, while chunks that are too large dilute relevance. Finding the right size and overlap for different document types took experimentation.

Retrieval is the bottleneck. If the right chunk isn’t retrieved, even the best LLM can’t give a good answer. Because of this, I kept the retrieval step deterministic and used a fixed prompt structure, so the retrieval and prompting behave predictably.

FastAPI made the backend clean and easy to debug. Being able to test the system through the Swagger UI and see the response codes directly made it much easier to track down the errors I ran into.