From cbb5ca0ab252e14624079f6e54ed3bbfb4e8281c Mon Sep 17 00:00:00 2001 From: Bo Li Date: Fri, 29 Aug 2025 07:27:27 -0700 Subject: [PATCH] Change to ask me anything MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude --- CLAUDE.md | 84 +++++++++++++++++++++++++++++++++++++++++++++ frontend/index.html | 2 +- frontend/style.css | 36 +++++++++---------- 3 files changed, 103 insertions(+), 19 deletions(-) create mode 100644 CLAUDE.md diff --git a/CLAUDE.md b/CLAUDE.md new file mode 100644 index 00000000..78e63b9b --- /dev/null +++ b/CLAUDE.md @@ -0,0 +1,84 @@ +# CLAUDE.md + +This file provides guidance to Claude Code (claude.ai/code) when working with code in this repository. + +## Project Overview + +This is a Course Materials RAG (Retrieval-Augmented Generation) system - a full-stack web application that enables semantic search and AI-powered question answering over course documents. The system uses ChromaDB for vector storage, Anthropic's Claude for generation, and serves a web interface for user interaction. + +## Essential Commands + +### Running the Application +```bash +# Quick start (recommended) +./run.sh + +# Manual start +cd backend && uv run uvicorn app:app --reload --port 8000 + +# Development with different port (if 8000 is occupied) +cd backend && uv run uvicorn app:app --reload --port 8001 +``` + +### Setup Commands +```bash +# Install dependencies +uv sync + +# Create environment file (required) +cp .env.example .env +# Then edit .env with your ANTHROPIC_API_KEY +``` + +## Architecture + +### Core Components + +The system follows a modular RAG architecture with clear separation of concerns: + +**RAGSystem (backend/rag_system.py)** - Main orchestrator that coordinates all components: +- DocumentProcessor: Chunks course documents into searchable segments +- VectorStore: Manages ChromaDB for semantic search using sentence transformers +- AIGenerator: Handles Anthropic Claude API calls for response generation +- SessionManager: Maintains conversation context and history +- ToolManager: Coordinates search tools for enhanced retrieval + +**Data Models (backend/models.py)**: +- `Course`: Contains title, instructor, lessons, and course metadata +- `Lesson`: Individual lessons with titles and links +- `CourseChunk`: Text segments with course/lesson context for vector storage + +**Frontend Architecture**: +- Vanilla HTML/CSS/JS with pink-themed UI (frontend/style.css) +- JavaScript handles API communication and UI updates (frontend/script.js) +- FastAPI serves both static files and API endpoints + +### Key Configuration (backend/config.py) + +- Uses Claude Sonnet 4 model (`claude-sonnet-4-20250514`) +- Embedding model: `all-MiniLM-L6-v2` +- Document chunks: 800 characters with 100 character overlap +- Conversation history: 2 messages retained +- ChromaDB path: `./chroma_db` + +### API Endpoints + +- `POST /api/query`: Submit questions, returns AI response with sources +- `GET /api/courses`: Retrieve course statistics and titles +- `/`: Static file serving for frontend + +### Document Processing Flow + +1. Course documents (`.txt` files) placed in `docs/` folder +2. DocumentProcessor extracts course metadata and lessons from structured text +3. Content is chunked and stored in ChromaDB with course/lesson context +4. User queries trigger semantic search + Claude generation with retrieved context +5. Session manager maintains conversation history for follow-up questions + +### Development Notes + +- Uses `uv` for Python dependency management +- FastAPI with auto-reload for backend development +- Frontend styling uses CSS custom properties for theming +- ChromaDB persists to local filesystem for data retention +- Requires ANTHROPIC_API_KEY environment variable \ No newline at end of file diff --git a/frontend/index.html b/frontend/index.html index f8e25a62..1615db5d 100644 --- a/frontend/index.html +++ b/frontend/index.html @@ -40,7 +40,7 @@

Course Materials Assistant

- Try asking: + Ask me anything:
diff --git a/frontend/style.css b/frontend/style.css index 825d0367..931b905f 100644 --- a/frontend/style.css +++ b/frontend/style.css @@ -7,21 +7,21 @@ /* CSS Variables */ :root { - --primary-color: #2563eb; - --primary-hover: #1d4ed8; - --background: #0f172a; - --surface: #1e293b; - --surface-hover: #334155; - --text-primary: #f1f5f9; - --text-secondary: #94a3b8; - --border-color: #334155; - --user-message: #2563eb; - --assistant-message: #374151; - --shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.3); + --primary-color: #ec4899; + --primary-hover: #db2777; + --background: #fdf2f8; + --surface: #fce7f3; + --surface-hover: #fbcfe8; + --text-primary: #831843; + --text-secondary: #a8467a; + --border-color: #f9a8d4; + --user-message: #ec4899; + --assistant-message: #fce7f3; + --shadow: 0 4px 6px -1px rgba(236, 72, 153, 0.15); --radius: 12px; - --focus-ring: rgba(37, 99, 235, 0.2); - --welcome-bg: #1e3a5f; - --welcome-border: #2563eb; + --focus-ring: rgba(236, 72, 153, 0.2); + --welcome-bg: #fdf2f8; + --welcome-border: #ec4899; } /* Base Styles */ @@ -54,7 +54,7 @@ header { header h1 { font-size: 1.75rem; font-weight: 700; - background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); + background: linear-gradient(135deg, #ec4899 0%, #db2777 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; @@ -277,7 +277,7 @@ header h1 { } .message-content code { - background-color: rgba(0, 0, 0, 0.2); + background-color: rgba(236, 72, 153, 0.1); padding: 0.125rem 0.25rem; border-radius: 3px; font-family: 'Fira Code', 'Consolas', monospace; @@ -285,7 +285,7 @@ header h1 { } .message-content pre { - background-color: rgba(0, 0, 0, 0.2); + background-color: rgba(236, 72, 153, 0.1); padding: 0.75rem; border-radius: 4px; overflow-x: auto; @@ -298,7 +298,7 @@ header h1 { } .message-content blockquote { - border-left: 3px solid var(--primary); + border-left: 3px solid var(--primary-color); padding-left: 1rem; margin: 0.5rem 0; color: var(--text-secondary);