๐Ÿ“š StudyStream: Your AI Learning Companion That Actually Gets You!

This is a submission for the Algolia Agent Studio Challenge: Consumer-Facing Non-Conversational Experiences

Hello, Lifelong Learners! ๐ŸŒŸ

Let me tell you a story. Last month, I was trying to learn TypeScript (ironic, right?). I had 47 browser tabs open, three different courses bookmarked, and absolutely NO idea where I left off. Sound familiar?

That frustration led me to build StudyStream – a learning companion that actually remembers where you are in your journey! ๐Ÿš€

studystream-ten.vercel.app

๐Ÿ’ก So What’s StudyStream All About?

Think of it as your personal study buddy who:

  • ๐Ÿ“ Knows exactly what you’re learning
  • ๐ŸŽฏ Suggests what to study next
  • ๐Ÿ† Celebrates your wins (with actual confetti!)
  • ๐Ÿ“Š Tracks your progress so you don’t have to

It’s NOT another boring e-learning platform. It’s designed to make studying feel like a game you actually want to play!

GitHub logo

aniruddhaadak80
/
studystream

๐Ÿ“š StudyStream – AI-Powered Learning Assistant

Next.js
TypeScript
Tailwind
Algolia

Master programming with AI-powered proactive learning! StudyStream is a non-conversational AI assistant that proactively suggests what to learn next based on your progress and context.

โœจ Features

๐Ÿง  Proactive AI Learning

  • Context-Aware Suggestions – AI recommends topics based on what you’re studying
  • Smart Quiz Selection – Questions matched to your current skill level
  • Adaptive Difficulty – Content adjusts to your performance

๐ŸŽฎ Gamification

  • Progress Tracking – Track completion across all topics
  • Achievement Badges – Unlock badges for milestones
  • Streak Counter – Build daily learning habits
  • XP System – Earn points for completing quizzes

๐Ÿ“– Rich Content

  • 10 Study Topics across JavaScript, Python, React, TypeScript, CSS
  • 30+ Practice Questions with explanations
  • Code Examples with syntax highlighting
  • Key Terms for each section

๐ŸŽจ Beautiful UI

  • Focus Mode Design – Distraction-free learning environment
  • Dark Theme – Easy on the eyes for long study sessions
  • Smooth Animations -โ€ฆ
View on GitHub

โœจ Features That’ll Make You Go “Ooh!”

๐Ÿ” Smart Search That Reads Your Mind

Type “JavaScript closures” or “how to center a div” (we’ve all been there ๐Ÿ˜‚) and get instant, relevant content.

Image deription

๐Ÿ“ˆ Progress Tracking

Visual progress bars, streaks, and statistics. Because seeing how far you’ve come is incredibly motivating!

Imagescription

๐ŸŽฎ Gamification Done Right

  • XP System: Earn points for completing topics
  • Streak Counter: Keep that fire burning! ๐Ÿ”ฅ
  • Achievement Badges: Collect ’em all
  • Confetti Explosions: Because you deserve to celebrate!

Image ription

Image deiption

๐Ÿ’ญ AI-Powered Suggestions

Based on what you’re learning, StudyStream suggests related topics. Learning React? Here’s some TypeScript to go with that!

๐Ÿ“ Interactive Quizzes

Test your knowledge with practice questions. Immediate feedback helps you learn faster!

Image dription

๐ŸŒ™ Gorgeous Dark Mode

Easy on the eyes during those late-night study sessions.

๐Ÿ› ๏ธ Under the Hood (Tech Stack)

Here’s what’s powering this learning machine:

Technology Purpose
Next.js 16 The backbone – SSR, app router, everything!
TypeScript Type safety = fewer bugs = happy developer
Algolia Blazing-fast search across all content
Framer Motion Those satisfying animations
Tailwind CSS Styling at the speed of thought

The Algolia Integration ๐Ÿ”ฎ

This is where the non-conversational AI magic happens. Algolia handles:

import { algoliasearch } from 'algoliasearch';

// Search across topics and questions
export async function searchTopics(query: string, filters?: SearchFilters) {
  const results = await searchClient.searchSingleIndex({
    indexName: 'study_topics',
    searchParams: {
      query,
      filters: filterString,
      hitsPerPage: 20,
    }
  });

  return results.hits as StudyTopicRecord[];
}

Why Non-Conversational AI? ๐Ÿค”

Unlike chatbots, StudyStream uses AI in the background. It’s:

  • Analyzing content to suggest related topics
  • Predicting difficulty based on your progress
  • Optimizing search to surface the most relevant content

You don’t see it, but it’s always working for you!

๐Ÿ“š What Can You Learn?

Currently featuring topics in:

  • JavaScript – From basics to async/await
  • Python – Data structures, algorithms, and more
  • React – Components, hooks, and best practices
  • TypeScript – Types, interfaces, generics
  • CSS – Flexbox, Grid, and modern layouts

And I’m constantly adding more!

๐ŸŽฏ The Learning Experience

Here’s how a typical session looks:

  1. Pick a topic that interests you
  2. Read through the beautifully formatted content
  3. Take a quiz to test understanding
  4. Earn XP and watch your progress grow
  5. Get suggestions for what to learn next
  6. Repeat and keep that streak alive! ๐Ÿ”ฅ

๐Ÿš€ Impact & Learnings

Building StudyStream was itself a learning experience! I discovered:

  • Gamification psychology: Small rewards create big motivation
  • Content structure: How to organize information for learning
  • Algolia’s power: Not just for e-commerce – perfect for educational content!
  • Progressive enhancement: Works without JavaScript, amazing with it

๐Ÿ”ฎ Future Plans

This is just the beginning! Coming soon:

  • [ ] More programming languages (Rust, Go, etc.)
  • [ ] Spaced repetition algorithm
  • [ ] Social features – study with friends!
  • [ ] Mobile app version
  • [ ] AI-generated practice problems

๐ŸŽ‰ Try It Yourself!

I’d love for you to take StudyStream for a spin! Pick a topic, complete a quiz, and let me know how it feels.

studystream-ten.vercel.app

Your feedback means the world to me! โญ

Built with ๐Ÿ’œ for the Algolia Agent Studio Challenge

*P.S. – Complete 5 quizzes correctly and you’ll unlock a special achievement. What is it?

You’ll have to find out! ๐Ÿ†*