Back to Work
Mini Progress Tracker
Web Dev

Mini Progress Tracker

Zero-dependency progress-tracking dashboard in a single HTML file — circular progress rings, 31-day habit-streak grids, and persistent localStorage, with no frameworks or build tools.

2025
HTMLCSSJavaScriptlocalStorage

Overview

A minimalist, self-contained progress tracking application for staying accountable with goals, habits, and coursework. Features circular progress visualizations that auto-calculate completion percentages, 31-day interactive habit streak grids, and persistent local storage. Built as a single HTML file with pure CSS and vanilla JavaScript — no frameworks, build tools, or external dependencies required.

Problem Statement & Approach

A lightweight way to stay accountable to goals, habits, and coursework without signing up for a heavyweight app.

Approach: Ship a single self-contained HTML file — pure CSS and vanilla JavaScript with localStorage — so it runs anywhere with zero setup, no frameworks, and no backend.

Key Features

  • Circular progress rings that auto-calculate completion
  • 31-day interactive habit-streak grids
  • Persistent state via browser localStorage
  • Single HTML file with pure CSS and vanilla JS — zero dependencies

Improvements

  • Data export/import for backup across devices
  • Optional cloud sync
  • Configurable habit schedules beyond 31 days
HTMLCSSJavaScriptProductivity