RAG Interactive Module 01 · Basic RAG
Introduction
RAG Interactive · Learn

Learn RAG from the inside out.

See how documents become context, and how context becomes an answer.

Module 01 · Basic RAG

Start learning Explore the Lab
DOC Document
CHK Chunks
VEC Embeddings
SIM Search
CTX Context
GEN Answer
Phase 01FoundationsWhy external knowledge is needed
02

The problem RAG solves

What happens when an LLM needs information it was never trained on?

Without RAG
User

“Quanto custa a consulta na DentCare?”

LLM (Knowledge Cutoff)

“I don't know.” (or presents an invented hallucinated price)

VS
With RAG
Evidence A Consultation price · External evidence provided

“A consulta odontológica inicial custa R$ 250.”

User

“Quanto custa a consulta na DentCare?”

LLM (Augmented with Evidence)

“A consulta odontológica inicial custa R$ 250.”

Core Takeaway: RAG (Retrieval-Augmented Generation) gives the model relevant external information before generation.

03

Documents: The External Knowledge Source

RAG starts with unstructured external information. In this interactive guide, we use a Dental Clinic sample document.

Sample Document: DentCare Clinic Information Plain Text Source

A clínica DentCare funciona de segunda a sexta-feira, das 8h às 18h.

Evidence AA consulta odontológica inicial custa R$ 250.

A Dra. Ana é especialista em ortodontia e atende às terças e quintas.

O Dr. Carlos realiza tratamentos de canal e procedimentos de endodontia.

Cancelamentos devem ser feitos com pelo menos 24 horas de antecedência.

A clínica aceita pagamentos via PIX, cartão de crédito e cartão de débito.

  • RAG starts with external information: PDFs, databases, web pages, or raw text.
  • For this educational walkthrough, we use a simple clean text sample.
In Python Conceptual equivalent python 
document = """
A clínica DentCare funciona de segunda a sexta-feira, das 8h às 18h.
A consulta odontológica inicial custa R$ 250.
A Dra. Ana é especialista em ortodontia e atende às terças e quintas.
O Dr. Carlos realiza tratamentos de canal e procedimentos de endodontia.
Cancelamentos devem ser feitos com pelo menos 24 horas de antecedência.
A clínica aceita pagamentos via PIX, cartão de crédito e cartão de débito.
"""
Phase 02IndexingPrepare knowledge for retrieval
04

Chunking: Splitting Large Documents

Large documents need smaller, manageable pieces to fit into vector search and context windows.

Quick Presets:
140
30

Generated Chunks (0)

Stable evidence identity Evidence A — Consultation price

“A consulta odontológica inicial custa R$ 250.”

Resolving current chunk and retrieval status…
In Python Updated from the controls above python 
chunks = split_text(
    document,
    chunk_size=140,
    overlap=30,
)
05

Embeddings: Converting Meaning into Vectors

This browser lesson uses simulated educational feature vectors to demonstrate the retrieval mechanism. It does not run a real embedding model.

Input units Chunks 01–04 Evidence A travels with its chunk
Simulated output [[0.82, …], [0.34, …], …] One vector per chunk

Illustrative 2D Projection

Illustrative: simulated educational feature vectors. Real embeddings normally have hundreds or thousands of dimensions; this visualization teaches the mechanism and does not reproduce a real embedding model.

Scroll horizontally to inspect the full projection →

Select any point above to inspect its simulated vector and illustrative placement

In Python Conceptual equivalent—not executed here python 
chunk_embeddings = embed(chunks)
Phase 03RetrievalCompare the question with indexed knowledge
06

Query Embedding: Vectorizing the Question

The user's question must be converted into the exact same vector space so we can compare it to document chunks.

Preset Questions:
Query Text “Quanto custa uma consulta?”
↓
Simulated Query Feature Vector (Normalized) [0.78, 0.12, -0.45, 0.88, ...]
In Python Updated when the query is embeddedpython
query_embedding = embed(query)
07

Similarity Search: Comparing Vectors

Which chunks point in a similar direction to the query in the simulated educational vector space?

Cosine Similarity

Cosine similarity measures the cosine of the angle θ between two vectors:

-1.0Opposite 0.0Orthogonal 1.0Same direction
Simulated educational vector engine

Ranked Chunks by Dense Cosine Similarity

Select a row to compare its geometry

Geometric cosine comparison

Query ↔ top-ranked chunk

Explore cos(θ) = (u · v) / (||u|| ||v||)
Unit-circle projection
Angle θ 24.5°
Cosine Similarity cos(θ) 0.910
Directional Alignment Strong Alignment
24.5°

Geometry sandbox only — this control does not change retrieval ranking.

cos(θ) = (q · c) / (||q|| ||c||)
In Python Dense cosine retrieval python 
scores = cosine_similarity(
    query_embedding,
    chunk_embeddings
)
ranked_chunks = sort_by_score(scores)
08

Top-K Retrieval

Top-K selects the highest-ranked dense results that will enter the context.

3
Selected Chunks 3 of 4
Selected Text 0 chars
Estimated Tokens (≈ chars ÷ 4) ≈0 tokens

Retrieved Chunks Selection (Top K = 3)

In Python Updated from Top K python 
results = similarity_search(
    query_embedding,
    chunk_embeddings,
    k=3,
)
Phase 04Augment & GenerateTurn retrieved knowledge into grounded output
09

Context: Assembly of Retrieved Knowledge

Retrieved chunks become context.

Crucial Distinction: The LLM does not search the vector database itself. The Retriever performs the search and places the facts into the Context buffer.

Selected evidence units
Context Buffer Retriever Output
In Python Collect the selected chunk textpython
context = "\n\n".join(
    chunk.text for chunk in results
)
10

Augmented Prompt: Constructing the Payload

Now we augment the prompt by uniting system instructions, retrieved context, and the user's question.

1. SYSTEM INSTRUCTIONS

Answer using only the provided context below. If you don't know, state clearly that information is unavailable.

2. RETRIEVED CONTEXT
3. USER QUESTION

“Quanto custa uma consulta?”

Single payload Augmented Prompt Instructions + evidence + question
In Python Compose one model input python 
prompt = build_prompt(
    context=context,
    query=query,
)
11

Simulated Generation & Grounding

Only now is a deterministic simulated answer produced. It is marked grounded only when its complete canonical evidence is present in the active context.

Prompt→Simulated LLM→Answer
Simulated LLM Output

“A consulta odontológica inicial custa R$ 250.”

Evidence AConsultation price
“A consulta odontológica inicial custa R$ 250.”
Currently in Chunk 02 · Included in context
Source details:
Waiting for complete evidence in the active context.
In Python Generate from the assembled promptpython
answer = llm.generate(prompt)
Phase 05ConnectSee the complete Basic RAG system
12

Complete Basic RAG Pipeline

Now that every concept has been learned individually, see how the Basic RAG components connect.

Scroll horizontally inside a pipeline row when needed →

1. INDEXING (Offline Preparation)
DOC Document Evidence A
→
CHK Chunking Evidence A · Chunk --
→
VEC Simulated Chunk Vectors Evidence A
→
DB Vector Store Evidence A indexed
Vector Store supplies indexed chunk vectors↓
2. RETRIEVAL & GENERATION (Online Query Flow)
Q User Query Question targets Evidence A
→
QV Simulated Query Vector
→
→
→
CTX Context Buffer Evidence A collected
→
P Prompt Builder Evidence A in prompt
→
GEN LLM Generation Answer cites Evidence A
Status: Ready to run pipeline simulation.
RAG Interactive · Lab

You now know the components.

Continue in the Lab to experiment, adjust parameters, break assumptions, and inspect the complete pipeline as a debugger.

Future modules will cover Hybrid Retrieval, Reranking, and Evaluation as separate advanced topics.

Continue in RAG Interactive Lab →

Build it in Python · Coming next