​Client-Side RAG Assistant for AI Fluency & Education

Static educational resources and online learning platforms often lack real-time, interactive guidance for students struggling to digest multi-chapter concepts. Standard generative AI tools frequently suffer from hallucinations or fail to reference specific, author-vetted curriculum materials when answering queries. Furthermore, traditional backend RAG setups introduce heavy server infrastructure costs and latency for simple web applications. The goal was to build a zero-cost, lightweight solution that directly grounds model responses in local course materials.

Implemented a fully client-side Retrieval-Augmented Generation (RAG) architecture deployed on GitHub Pages. The system features a custom retrieval engine in JavaScript that queries an embedded JSON knowledge base containing structured course chapters and frameworks. Relevant context matches are dynamically parsed and injected into system prompts passed to the Google Gemini 2.5 Flash API. The solution provides instantaneous, highly relevant responses while maintaining full user privacy through client-side API credential handling. Zero Infrastructure Overhead: Deployed a fully functional RAG application hosted for free on GitHub Pages, avoiding recurring backend hosting and database maintenance costs.

Interactive Student Support: Transformed static documentation into a dynamic 24/7 conversational assistant to help learners navigate the 4D AI Fluency Framework. Instantaneous Client Retrieval: Achieved instant keyword and context retrieval by executing vector and search logic client-side in the browser prior to LLM prompting. Zero Hallucination Rate: Enforced strict context grounding against curated course JSON modules, ensuring responses strictly adhere to vetted educational material.