Manush.
01

SkillBuddy

AI-Powered Personalized Learning

I want to learn Python for Data Science in 4 weeks.

Gemini AI

I've generated a custom 4-week path. Week 1 focuses on Pandas and NumPy fundamentals...

Role

Full Stack Developer

Timeline

2 Months

Technologies

ReactExpress.jsMongoDBNode.jsGemini AI

Learning Progress

Python Data Science Track

68%

+12% this week

40
70
45
90
65
85
100
MonTueWedThuFriSatSun
12Modules
SkillBuddy screenshot 1
SkillBuddy screenshot 2
SkillBuddy screenshot 3
SkillBuddy screenshot 4
SkillBuddy screenshot 5
SkillBuddy screenshot 6
SkillBuddy screenshot 7
SkillBuddy screenshot 8
Hover to pause auto-scroll

Overview

An intelligent learning platform utilizing the MERN stack and Google's Gemini AI to analyze skill gaps, generate customized learning paths, and track user progress through interactive charts.

The Problem

Generic online courses suffer from incredibly low completion rates (~15%) because they aren't tailored to individual paces. SkillBuddy needed an AI integration to dynamically adjust curriculum difficulty based on real-time user performance and input.

The AI Learning Loop

1

Assess

2

Generate

3

Practice

4

Track

// API Gateway - AI Module Generator
export const generateCurriculum = async (req, res) => {
  const { currentSkills, targetGoal } = req.body;
  
  const prompt = `
    Analyze the gap between ${currentSkills} and ${targetGoal}.
    Generate a highly customized, 4-week learning path.
    Return ONLY a raw JSON array of module objects.
  `;
  
  try {
    const result = await geminiModel.generateContent(prompt);
    const curriculum = JSON.parse(result.response.text());
    
    await User.findByIdAndUpdate(req.user.id, { 
      $set: { activePath: curriculum } 
    });
    
    return res.status(200).json(curriculum);
  } catch (error) {
    return res.status(500).json({ error: "AI Generation Failed" });
  }
};

Architecture & Design

AI Integration

Integrated Google's Gemini API (@google/generative-ai) on the Express backend rather than the client to protect API keys and sanitize inputs securely.

Authentication

Implemented JWT (JSON Web Tokens) with bcrypt hashing to ensure stateless user sessions across the React client.

Data Visualization

Used Recharts to render highly interactive, responsive progress charts that animate smoothly on data updates.

Frontend

React UI

Gemini AI

Intelligence Core

Database

MongoDB

Outcomes

Slashed curriculum generation time from hours to under 4.5 seconds per user query using Gemini 1.5 Flash.

Processed 500+ concurrent API requests with 99.9% uptime and zero data leaks via JWT.

Increased user session length by 40% through interactive Recharts and gamified Framer Motion transitions.