DEV Community

Mohd Ashab
Mohd Ashab

Posted on

StudyBuddy AI: A Local AI Study Companion Powered by Gemma 3 4B

This is a submission for the Hacktoberfest Weekend Challenge: Build for a Friend

What I Built

I built StudyBuddy AI, a local-first AI study companion designed for a fellow college student who struggles with understanding difficult topics and organizing exam preparation.

The problem I wanted to solve was bigger than simply getting an answer from an AI.

When studying a difficult topic, a student usually needs to:

Understand → Practice → Test → Revise → Plan

StudyBuddy AI turns that workflow into one application.

A student can enter a topic and ask StudyBuddy to explain it, then immediately:

  • Ask for a simpler explanation
  • Get an analogy
  • Practice the concept
  • Take an interactive quiz
  • Review mistakes
  • Generate an exam-focused revision sheet
  • Create a multi-day study plan
  • Save useful explanations, quizzes, revisions, and plans

The goal is to make AI useful as a learning companion, rather than just another chatbot.

The project is intentionally local-first. The AI runs on the user's machine using Ollama and Gemma 3 4B, without requiring OpenAI, Gemini, Claude, or another cloud AI API.


Demo

GitHub Repository:
https://github.com/ashab683/studybudy-ai

The demo shows the complete learning workflow:

Explanation → Follow-up → Quiz → Revision → Study Plan → Saved Resources


Code

The complete source code is available here:

https://github.com/ashab683/studybudy-ai

The repository contains the React frontend, Express backend, Ollama integration, prompts, validation, local storage utilities, and setup instructions.


How I Built It

The core architecture is:

React + Vite + Tailwind
          ↓
      Express API
          ↓
    Ollama Local Runtime
          ↓
       Gemma 3 4B
          ↓
       Express API
          ↓
        React UI
Enter fullscreen mode Exit fullscreen mode

Tech Stack

Frontend

  • React
  • Vite
  • JavaScript
  • Tailwind CSS

Backend

  • Node.js
  • Express
  • REST API

AI

  • Ollama
  • Gemma 3 4B

Storage

  • Browser localStorage

The most important part of the project is the local AI pipeline.

The frontend sends requests to the Express backend. The backend validates the request, builds a task-specific prompt, and sends it to the local Ollama API. Ollama runs Gemma 3 4B locally and returns the generated response to the backend, which then sends it back to the React application.

Interactive Quiz Mode

StudyBuddy can generate structured multiple-choice quizzes using Gemma.

The quiz system supports:

  • Easy, medium, and hard difficulty
  • 3–10 questions
  • Progress tracking
  • Immediate feedback
  • Score calculation
  • Answer explanations
  • Mistake review
  • Bookmarking

The backend requests structured JSON from the model instead of treating the response as plain text.

Conceptually, the generated data looks like:

{
  "title": "Stack in Data Structures",
  "questions": [
    {
      "id": 1,
      "question": "What principle does a stack follow?",
      "options": [
        "FIFO",
        "LIFO",
        "Random access",
        "Priority order"
      ],
      "correctIndex": 1,
      "explanation": "A stack follows the Last In, First Out principle."
    }
  ]
}
Enter fullscreen mode Exit fullscreen mode

Because local models can sometimes return JSON wrapped in markdown or slightly malformed structures, I added parsing, validation, and normalization so the application can handle model output more reliably.

Exam Revision Mode

The revision workflow generates a concise exam-focused study sheet containing:

  • Core definitions
  • Important rules and formulas
  • Key differences
  • Common exam traps
  • Important revision questions

Students can copy or save the generated revision material and directly create a quiz on the same topic.

Study Plan Generator

Students can provide:

  • Subject
  • Syllabus topics
  • Hours available per day
  • Number of days until their exam

StudyBuddy then generates a multi-day schedule.

The frontend turns that response into interactive daily tasks with completion tracking and revision tips.

Contextual Follow-ups

Instead of ending after an explanation, StudyBuddy provides contextual actions such as:

  • Give me an analogy
  • Explain more simply
  • Take a Quiz on this
  • Create Revision Sheet
  • Line-by-line code breakdown

This creates a continuous learning flow instead of a single question-and-answer interaction.

Saved Resources and History

I intentionally avoided adding a database to the MVP.

StudyBuddy uses browser localStorage to persist:

  • Saved explanations
  • Quizzes
  • Revision sheets
  • Study plans
  • Recent sessions
  • Theme preference

This keeps the application simple while still allowing users to continue their study workflow after refreshing the browser.

Dark Mode

The application also includes a persistent dark mode designed for longer study sessions.

The theme is saved locally and applied across the complete interface.


Why Does Open Innovation Matter?

Using open-weight AI and local inference changed what I could build.

StudyBuddy does not depend on a proprietary AI API or a paid API key.

Instead, the AI layer runs locally:

StudyBuddy AI
      ↓
    Ollama
      ↓
  Gemma 3 4B
      ↓
Local inference
Enter fullscreen mode Exit fullscreen mode

This provides several advantages.

Privacy

Study questions and learning material can remain on the student's own machine instead of automatically being sent to a third-party AI service.

No API Key

A student can run the application without creating an account with a cloud AI provider or managing an API key.

No Per-request Cloud Cost

Once Ollama and the model are installed, the application does not need a paid cloud AI API for its core AI functionality.

Control and Experimentation

The AI model is configurable through the application's environment.

This allowed me to experiment with prompts, structured outputs, different learning modes, and error handling while keeping the architecture simple.

There is also an important trade-off.

Local inference can be slower than cloud APIs depending on the user's hardware. During development, some Gemma 3 4B requests took around a minute or more.

That trade-off was an important part of the project:

Local AI provides more control and privacy, but performance depends heavily on the user's hardware.

Open innovation made it possible for me to build the AI layer as an actual part of the application instead of simply consuming a proprietary AI service.


What I Learned

One of my biggest lessons from building StudyBuddy AI was that integrating AI into an application is much more than writing a prompt.

The surrounding engineering matters just as much.

I learned about:

  • Running open-weight models locally with Ollama
  • Designing prompts for different learning workflows
  • Structured AI output
  • Defensive JSON parsing
  • API validation
  • React state management
  • Persistent browser storage
  • Loading and error states
  • Building responsive interfaces around asynchronous AI operations
  • Designing an AI product around a real user problem

The most important lesson was:

AI should be treated as a component of the product, not the entire product.

The value comes from what you build around the model.


Challenges

The biggest technical challenge was dealing with the unpredictable nature of local AI responses.

For normal explanations, plain text was enough.

But quizzes required reliable structured data.

The model could sometimes return:

  • JSON inside markdown code blocks
  • Unexpected fields
  • Incomplete structures
  • Formatting that wasn't directly usable by React

Instead of assuming the model would always behave perfectly, I added a parsing and validation layer between Ollama and the frontend.

Another challenge was response time.

Because Gemma 3 4B runs locally, generation speed depends on the hardware. This made loading states and error handling important parts of the user experience.


What's Next?

StudyBuddy AI is currently an MVP, but there are several improvements I would like to make:

  • Streaming local model responses
  • Faster inference and improved loading UX
  • Support for additional Ollama models
  • Flashcards
  • Spaced repetition
  • Coding practice
  • Better personalization based on quiz mistakes
  • Long-term study progress tracking

The next major improvement would be streaming responses so users can start reading an AI response while Gemma is still generating it.


My Agent Session

Prize Categories

Best Use of Gemma

StudyBuddy AI uses Gemma 3 4B as the core AI model powering explanations, quizzes, revision sheets, follow-up learning, and study-plan generation.

The model runs locally through Ollama, making Gemma an actual part of the application's core architecture rather than an optional feature.


Final Thoughts

StudyBuddy AI started with a simple question:

What if an AI study assistant didn't just answer a student's question, but helped them actually learn the topic?

That question led me to build a workflow around:

Understand → Practice → Quiz → Revise → Plan

Using Ollama and Gemma 3 4B made it possible to build that workflow around local AI instead of relying on a paid cloud API.

The project is still an MVP, and there is plenty I want to improve, especially response speed and personalization.

But I'm happy with what it has become: a working local-first learning companion built around a real student problem.

Instead of building another chatbot, I wanted to build something that helps a student move from:

"I don't understand this."

to:

"I understand it, I practiced it, I tested myself, and I know what to revise next."

That's what StudyBuddy AI is trying to accomplish.


GitHub: https://github.com/ashab683/studybudy-ai

devchallenge #weekendchallenge #hf26challenge

Top comments (0)