DEV Community

Jainil Chavda
Jainil Chavda

Posted on

I Built StudyBuddy AI for a Friend Who Was Tired of Turning Notes Into Study Material ๐Ÿ“š๐Ÿค–

Hacktoberfest Weekend Challenge: Build for a Friend Submission ๐Ÿค

I Built StudyBuddy AI for a Friend Who Was Tired of Turning Notes Into Study Material ๐Ÿ“š๐Ÿค–

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

Build something with open-source AI at its core.

Instead of building another generic AI chatbot, I wanted to build something practical for a student.

So I built StudyBuddy AI โ€” an AI-powered study assistant that turns raw study notes into a structured study pack with summaries, key takeaways, practice questions, answers, and explanations.


๐Ÿ‘‹ The Problem

A friend of mine often has the same problem before exams:

They already have the notes.

But then comes the difficult part:

  • What should I actually remember?
  • What are the important points?
  • What questions could be asked?
  • Can I test myself?
  • Do I really understand the topic?

Turning a large set of notes into useful revision material can take a lot of time.

I wanted to build something that could take those notes and immediately turn them into something that is actually useful for studying.

That's how StudyBuddy AI started.


๐ŸŽ“ What Is StudyBuddy AI?

StudyBuddy AI takes a student's study notes and transforms them into a structured Study Pack.

The student provides their notes, and the application generates:

  • ๐Ÿ“ Summary
  • ๐Ÿ”‘ Key Takeaways
  • โ“ Practice Questions
  • โœ… Answers
  • ๐Ÿ’ก Explanations

The goal is simple:

Paste your notes โ†’ Generate a study pack โ†’ Revise โ†’ Test yourself


The demo shows the complete flow:

  1. Enter study notes
  2. Select an available AI model
  3. Generate the study pack
  4. Read the summary and key takeaways
  5. Practice with generated questions
  6. Reveal answers and explanations

๐Ÿš€ Try the Project

GitHub Repository:

https://github.com/Jainil26/hacktoberfest-weekend-2026


๐Ÿง  How It Works

The architecture is intentionally simple.


text
Student
   โ†“
React Frontend
   โ†“
Express.js Backend
   โ†“
Hugging Face Router
   โ†“
Open-Weight AI Model
   โ†“
Structured Study Pack
   โ†“
React Interface


1. Student Input

The student pastes their study notes into the application.

2. Backend Processing

The React frontend sends the notes to the Express.js backend.

3. AI Processing

The backend creates a structured prompt based on the student's notes.

The prompt is then sent to the Hugging Face Router.

4. Model Generation

An available open-weight AI model processes the notes and generates:

Summary
Key takeaways
Practice questions
Answers
Explanations
5. Study Pack

The generated content is returned to the React application and displayed in an organized interface.

๐Ÿค– Model Selection

The default model used by StudyBuddy AI is:

Qwen/Qwen2.5-72B-Instruct

But I didn't want to hard-code the application around a single model.

StudyBuddy AI also includes a dynamic model selector.

It discovers compatible models currently available through Hugging Face's inference providers and allows the application to work with available models.

This is useful because model availability through hosted inference can change.

Instead of presenting users with models that may not currently work with the configured inference service, the application can discover compatible options dynamically.

๐Ÿ’ก Why Open-Weight AI?

Open-weight AI was an important part of this project.

StudyBuddy AI uses open-weight models through Hugging Face inference providers.

This approach provides several interesting possibilities:

๐Ÿ”„ Flexibility

The application isn't conceptually locked to one model.

Compatible models can be swapped depending on availability and requirements.

๐Ÿ’ป Deployment Options

When hardware allows, compatible open-weight models can potentially be deployed locally instead of relying entirely on hosted inference.

๐Ÿ› ๏ธ Developer Control

Developers have more control over the model and deployment environment.

๐Ÿงช Experimentation

Open-weight models make it easier to experiment with different models and AI application architectures.

๐Ÿ’ฐ Cost Flexibility

Developers can choose between hosted inference and self-hosted deployment depending on their requirements.

For StudyBuddy AI, this means the AI layer can evolve independently from the rest of the application.

๐Ÿ› ๏ธ Tech Stack
Frontend
React 18
Vite
Vanilla CSS3
Lucide Icons
Canvas Confetti
Backend
Node.js
Express.js
CORS
Dotenv
AI
Hugging Face Router
Hugging Face Inference Providers
Qwen/Qwen2.5-72B-Instruct
๐Ÿ“‚ Project Structure
hacktoberfest-weekend-2026/
โ”‚
โ”œโ”€โ”€ client/
โ”‚   โ”œโ”€โ”€ public/
โ”‚   โ”‚   โ””โ”€โ”€ logo.jpg
โ”‚   โ”‚
โ”‚   โ””โ”€โ”€ src/
โ”‚       โ”œโ”€โ”€ components/
โ”‚       โ”‚   โ”œโ”€โ”€ AboutModal.jsx
โ”‚       โ”‚   โ”œโ”€โ”€ FlashcardQuiz.jsx
โ”‚       โ”‚   โ”œโ”€โ”€ ModelSelector.jsx
โ”‚       โ”‚   โ”œโ”€โ”€ NoteInput.jsx
โ”‚       โ”‚   โ””โ”€โ”€ StudyPackView.jsx
โ”‚       โ”‚
โ”‚       โ”œโ”€โ”€ App.jsx
โ”‚       โ”œโ”€โ”€ App.css
โ”‚       โ””โ”€โ”€ main.jsx
โ”‚
โ”œโ”€โ”€ server/
โ”‚   โ”œโ”€โ”€ aiService.js
โ”‚   โ”œโ”€โ”€ index.js
โ”‚   โ””โ”€โ”€ sampleNotes.js
โ”‚
โ”œโ”€โ”€ .env.example
โ”œโ”€โ”€ .gitignore
โ”œโ”€โ”€ package.json
โ”œโ”€โ”€ package-lock.json
โ”œโ”€โ”€ README.md
โ””โ”€โ”€ ...
๐Ÿงช Example

Imagine a student has these notes:

TCP is a connection-oriented transport layer protocol.
It provides reliable and ordered delivery of data.
TCP uses acknowledgements, sequence numbers and retransmission
to ensure reliable communication between devices.

Instead of manually converting those notes into revision material, StudyBuddy AI can generate a structured study pack.

๐Ÿ“Œ Summary

A concise explanation of TCP and its purpose.

๐Ÿ”‘ Key Takeaways
TCP operates at the transport layer.
TCP provides reliable data delivery.
TCP maintains ordered communication.
TCP uses acknowledgements and sequence numbers.
Lost data can be retransmitted.
โ“ Practice Questions

The application generates questions based on the submitted study material.

โœ… Answers & Explanations

Students can reveal the answers and explanations to check their understanding.

The idea is not simply to give the student an AI-generated summary.

It is to create a small revision + self-testing workflow from the material they already have.

๐Ÿ” Security

The Hugging Face API token is stored using environment variables.

Sensitive information should never be committed to the repository.

.env
API keys
Access tokens
Passwords
Private credentials

The .gitignore file is configured to exclude environment files and dependency directories.

๐Ÿ”ฎ What's Next?

There are several features I would like to add in future versions:

๐Ÿ“„ PDF and document upload
๐Ÿง  Multiple study modes
๐Ÿ—‚๏ธ Dedicated flashcard generation
๐ŸŽš๏ธ Difficulty selection
๐Ÿ“– Detailed topic explanations
๐Ÿ’ป Local model support
๐Ÿค– More Hugging Face models
๐Ÿ“Š Study history
๐Ÿ“ˆ Progress tracking
๐Ÿ” Spaced-repetition support

The current version intentionally keeps the core workflow simple.

โค๏ธ Why I Built It

One thing I like about building AI applications is that the best ideas don't always need to be huge.

Sometimes the problem is simple:

"I have my notes. I just need a better way to study them."

StudyBuddy AI is my attempt to solve exactly that.

It combines a normal full-stack web application with open-weight AI to create something that can actually be used during everyday studying.

๐Ÿง‘โ€๐Ÿ’ป What I Learned

Building StudyBuddy AI gave me hands-on experience with:

Integrating AI models into a full-stack application
Working with Hugging Face inference
Building structured prompts
Dynamically discovering available AI models
Connecting React with an Express backend
Handling environment variables securely
Designing an AI-powered user workflow
Thinking about model flexibility instead of hard-coding a single model
๐ŸŽฏ Hacktoberfest 2026

This project was built for the Hacktoberfest 2026 Weekend Challenge: Build for a Friend.

The challenge focuses on building something with open-source AI at its core that solves a real problem for a friend or someone you care about.

For me, that problem was studying.

Instead of building a complicated AI system just for the sake of using AI, I wanted to build a small application where the AI component directly contributes to solving the problem.


๐Ÿ™Œ Feedback Welcome

I'd love to hear what you think about StudyBuddy AI.

If you are a student, what feature would make a tool like this more useful for your study workflow?

And if you're a developer, I'd especially love feedback on the architecture, AI integration, and model-selection approach.

Built with โค๏ธ and open-weight AI for Hacktoberfest 2026.

![ ](https://dev-to-uploads.s3.us-east-2.amazonaws.com/uploads/articles/z1abbsvg5iv2q89pphpb.jpg)
![ ](https://dev-to-uploads.s3.us-east-2.amazonaws.com/uploads/articles/a5t6snmnsjg9l0m754mi.jpg)
![ ](https://dev-to-uploads.s3.us-east-2.amazonaws.com/uploads/articles/9ixr3kc516b4sd3m4sgl.jpg)
![ ](https://dev-to-uploads.s3.us-east-2.amazonaws.com/uploads/articles/8668w5r31jccoddi57mv.jpg)
Enter fullscreen mode Exit fullscreen mode

Top comments (0)