When I set out to build CodeMaster, I wasn't just trying to create another problem tracker. I wanted to build something that would actually help me learn and retain what I was studying.

Here's what I built and why each feature matters.

1. The Leitner System for Spaced Repetition

The core of CodeMaster is the Leitner system—a proven method for spaced repetition that helps you retain information long-term.

Here's how it works:

Problems move through different "boxes" based on how well you know them.

  • Box 1: Problems you just learned or struggled with (reviewed frequently)
  • Box 2: Problems you're getting better at (reviewed less often)
  • Box 3: Problems you've mastered (reviewed infrequently)

If you solve a problem correctly, it moves to the next box. If you struggle, it moves back down. This means you spend more time on what you don't know and less time on what you've already mastered.

Why this matters:

The Leitner system ensures I'm actually learning, not just checking boxes. It also has cooldown logic—problems don't come back immediately. They space out over time based on which box they're in. This prevents burnout and mimics how our brains actually retain information.

2. Pattern Ladders: Learning by Progression

One of the biggest challenges with LeetCode is knowing what to practice next. There are thousands of problems, and it's easy to feel lost.

That's why I built pattern ladders.

Pattern ladders guide your progression through algorithm types with tag-aware difficulty scaling.

Instead of jumping randomly between topics, CodeMaster helps you:

  • Start with easier problems in a pattern (like Arrays or Two Pointers)
  • Gradually increase difficulty as you improve
  • Move to the next pattern when you're ready

This gives structure to your learning. You're not just solving random problems—you're building mastery step by step.

Why this matters:

When I was practicing without structure, I would avoid the hard topics. Pattern ladders force me to confront what I'm weak at, but in a way that feels manageable.

3. Adaptive Sessions

CodeMaster doesn't just give you random problems. It adapts based on your performance.

Adaptive sessions adjust based on:

  • Your tag performance: If you're struggling with dynamic programming, you'll see more of it
  • Session results: If you failed a problem, it comes back sooner
  • Recent inactivity: If you haven't practiced a topic in a while, it gets prioritized

This means every study session is tailored to what you need most right now.

Why this matters:

Adaptive sessions make sure I'm using my time efficiently—working on what will actually move the needle.

4. Dashboard Analytics

CodeMaster includes a dashboard with visual analytics powered by Recharts.

You can see:

  • Tag mastery: Which algorithm patterns you've mastered and which need work
  • Box distribution: How many problems are in each Leitner box
  • Session trends: Your progress over time
  • Problem activity: Which problems you've solved and when

Why this matters:

Progress can feel invisible when you're learning algorithms. The dashboard makes it tangible. I can look at it and see: "I've moved 15 problems to Box 3. I'm getting better at arrays. I need to work on graphs."

That visibility keeps me motivated.

5. Extension Architecture: How It All Works Together

The extension architecture was one of the trickiest parts to build. Chrome extensions have three main components that need to communicate:

  • Content script: Reads LeetCode's page and extracts problem information
  • Popup UI: Where you interact with CodeMaster (built with React)
  • Background service worker: Manages data and coordinates between components

Getting them to sync state without conflicts required building a custom message-passing system and careful IndexedDB management.

The technical challenges:

The biggest hurdle was state management. When you mark a problem as complete in the popup, that needs to update IndexedDB, refresh the dashboard, and notify the content script—all while handling race conditions and keeping data consistent.

I built a custom React hook (useChromeMessage) that handles all the message passing between components. It ensures that state updates flow smoothly and data doesn't get out of sync.

Why this matters:

Building the extension forced me to learn browser APIs deeply—something I wouldn't have gotten from a web app. Managing asynchronous state across multiple contexts taught me more about JavaScript than any tutorial could.

6. Tag Mastery Engine

CodeMaster tracks tag mastery behind the scenes using a scoring algorithm that weighs three factors:

  • Recency: When you last practiced a tag (older = lower score)
  • Accuracy: Your success rate with that pattern (lower accuracy = lower score)
  • Coverage: How many problems you've solved in that pattern (fewer problems = lower score)

Tags with low scores get prioritized in your next session. It's like having a coach who knows exactly where your weak spots are.

How it works in practice:

Let's say you've mastered Arrays (high accuracy, recent practice, good coverage) but you've been avoiding Dynamic Programming (low accuracy, not practiced in weeks, few problems solved). The tag mastery engine will surface more DP problems in your adaptive sessions until your scores balance out.

The algorithm constantly adjusts based on your performance. If you ace a DP problem, its priority drops. If you struggle with an Array problem, Arrays get bumped back up.

Why this matters:

This automatic prioritization means you don't have to think about what to practice next. The system handles it for you based on your actual performance data, not your feelings about what you should work on.

What I Learned Building These Features

That's the thing about building something real. You have an idea of what it should be, and then you have to actually make it work.

Building CodeMaster taught me:

  • Spaced repetition isn't just theory—it actually works when you implement it right
  • Adaptive algorithms are hard—figuring out how to prioritize problems took multiple iterations
  • UI/UX matters—if the dashboard is confusing, people won't use it
  • Chrome extensions have constraints—working with IndexedDB and message passing was a learning curve

The features work. They help me learn. And that's what matters.

The Result

CodeMaster is a personalized learning and productivity Chrome Extension that helps developers master data structures and algorithms through a smart, pattern-based spaced repetition system.

It's not perfect. But it's real. And it's helping me get better at algorithms every day.

In the next post, I'll share what I learned shipping CodeMaster—the challenges, the surprises, and what I'd do differently.