A lightweight, privacy-first Retrieval-Augmented Generation (RAG) web application built from first principles using Next.js 15, React 19, Tailwind CSS, and local Ollama models.
This application enables users to upload PDF documents and ask questions grounded strictly in the document context. It handles PDF parsing, fixed-window text chunking, dense vector embeddings, vector similarity search, conversational history resolution, and answer generation with exact page-level citations.
- Automated PDF Indexing: Upload any text-based PDF to automatically parse pages, chunk text, and generate vector embeddings.
- Local & Private Execution: Powered entirely by local models via Ollama (
nomic-embed-textfor vector embeddings andgemma3:4bfor LLM inference). No external API keys or cloud dependencies. - Conversational Memory: Maintains chat history to resolve follow-up questions and pronouns (e.g., "What college did he attend?" followed by "Mention his graduation year").
- Strict Context Grounding: Enforces a Cosine Similarity threshold (
minScore = 0.40). Out-of-scope questions cleanly trigger a fallback refusal message rather than generating hallucinations. - Page Citations: Every response includes verifiable source tags referencing the exact document page numbers.
- Dark Theme Interface: Clean two-column user interface with a drag-and-drop file uploader, document metadata status, and markdown chat rendering.
[ PDF Document ] -> [ 1. Text Parsing ] -> [ 2. Text Chunking ]
(pdf-parse) (600 tokens, 100 overlap)
|
v
[ User Question ] -> [ 4. Cosine Similarity ] <- [ 3. Vector Store ]
| (Top-K=5, minScore=0.40) (nomic-embed-text 768-dim)
v |
[ History Resolution ] ---------> v
(Enrich Query) [ 5. Grounded Prompt ] -> [ 6. LLM Generation ]
(Strict Rules) (gemma3:4b)
- Framework: Next.js 15 (App Router), React 19, TypeScript
- Styling: Tailwind CSS v3, PostCSS, Autoprefixer
- PDF Parser:
pdf-parse - Embedding Model:
nomic-embed-text(768 dimensions via Ollama) - Generative Model:
gemma3:4b(via Ollama)
Install Node.js (v18+) and Ollama.
Pull the required local models:
ollama pull nomic-embed-text
ollama pull gemma3:4bgit clone https://github.com/haritech005/rag-from-scratch.git
cd rag-from-scratch
npm installnpm run devNavigate to http://localhost:3000 in your browser.
| Method | Endpoint | Description |
|---|---|---|
POST |
/api/upload |
Accepts a PDF file (FormData), extracts text, generates vector embeddings, and initializes the document index. |
POST |
/api/chat |
Receives user question and chat history, executes vector search, and returns grounded answer with page citations. |
GET |
/api/document/status |
Returns the current active document status and metadata. |
DELETE |
/api/document |
Clears the current document index and vector store. |
| Parameter | Value | Rationale |
|---|---|---|
| Chunk Size | 600 tokens | Balances semantic context with search precision. |
| Chunk Overlap | 100 tokens | Prevents information cutoff across chunk boundaries. |
| Top-K | 5 | Ensures sufficient context for complex queries. |
| Similarity Threshold | 0.40 | Filters low-confidence noise while accommodating casual query phrasing. |
.
├── src/
│ ├── app/
│ │ ├── api/ # Production API routes (upload, chat, document)
│ │ ├── globals.css # Global styles and Tailwind imports
│ │ ├── layout.tsx # Root layout
│ │ └── page.tsx # Main application page
│ ├── components/
│ │ ├── ChatArea.tsx # Message history and input interface
│ │ ├── Icons.tsx # Bounded SVG icons
│ │ └── Sidebar.tsx # File dropzone and document status panel
│ ├── lib/
│ │ ├── chunker.ts # Text chunking implementation
│ │ ├── ollama.ts # Ollama API client and prompt construction
│ │ ├── pdf.ts # PDF parsing utility
│ │ ├── storage.ts # Local JSON storage handlers
│ │ └── vectorSearch.ts # Cosine similarity search engine
│ └── types/ # TypeScript type definitions
└── package.json
