V
Loading the workshop…
progress, tracked →
Project Showcase

GreenGrid

A GitHub-connected platform that helps developers track their DSA progress, stay consistent, and turn daily problem solving into a journey they can actually see.

StatusCompleted
PlatformWeb
Year2026
RoleFull-Stack Developer
Inspired by GitHub's idea of making progress visible, GreenGrid is a place to document your DSA journey from the very first problem and not just celebrate the hundredth.

Why I Built It

GreenGrid started as a random thought before I seriously began practicing DSA. I wanted one place where I could log every problem I solved, organize them by topic, and watch my progress grow over time. Rather than trying to remember what I'd practiced, I wanted a simple system that could grow alongside me.

What Makes It Different

Instead of creating another username and password, GreenGrid uses GitHub as your identity. A short onboarding flow personalizes the experience, while the dashboard focuses on streaks, topic coverage, and overall progress - making it easy to see how your learning evolves over time.

Challenges Along the Way

  • Building my first complete Spring Boot REST API
  • Implementing GitHub OAuth across the full application
  • Designing a database to track problems, tags, and progress
  • Creating responsive search and filtering features
  • Containerizing the backend with Docker
  • Deploying the frontend and backend independently

What I Learned

  • Planning the backend first makes frontend development smoother
  • OAuth involves far more edge cases than it first appears
  • Good dashboards highlight progress, not just statistics
  • Docker creates a more reliable development workflow
  • Small design decisions can make tracking feel more rewarding
Platform Walkthrough

Explore the Experience

Nine screens that tell the complete story—from first visit to daily practice, in a premium desktop preview.

greengrid.app
Previous
greengrid.html
Landing Page
greengrid.html
Next
01 — Landing

Landing Page

The first impression of GreenGrid—an overview of what the platform tracks and why it helps.

01 / 09
Key Features

How GreenGrid Helps

Everything is designed to make tracking DSA practice simple, organized, and motivating from day one.

DSA Progress Tracking

Keep every solved problem in one place and see your progress grow over time. Problems are organized by topic and difficulty, making it easy to spot strengths, identify gaps, and stay consistent.

GitHub OAuth Authentication

Sign in with your GitHub account instead of creating another username and password. The experience is quick, familiar, and keeps the focus on solving problems rather than managing accounts.

Personalized Onboarding

A short onboarding flow captures your goals and experience level, helping GreenGrid present a dashboard that's relevant from the moment you get started.

Problem Library

Save problems with tags, difficulty levels, notes, and links so they're always easy to revisit when reviewing a topic or preparing for your next practice session.

Search & Filters

Quickly find any saved problem using filters for topics, difficulty, tags, or completion status, making review sessions faster and more organized.

Streaks & Insights

Track your consistency through daily streaks, solved problems, and progress trends that make it easier to stay motivated and see how far you've come.

Built With

Technologies

HTML5 CSS3 Bootstrap 5 JavaScript(Vanilla) Java JWT Spring Boot Flyway Supabase GitHub OAuth GitHub Pages(Deployment) Render Docker

Explore the Project

Browse the source code, explore the project structure, or try the live demo to see GreenGrid in action.

Roadmap

What is Next

More Work

You May Also Like