Checkboxying

Checkboxying

Checkboxying is a minimalist progress tracker I built to solve a very specific friction in my daily organization. I felt that traditional project management tools and habit trackers were often too heavy, requiring too many metadata fields and complex configurations just to record a simple recurring task.

I needed a tool that focused entirely on visual feedback. Instead of managing deadlines or complex statistics, Checkboxying is designed to provide an immediate sense of progress through a reactive grid. It is just a visual dashboard that tells me how close I am to filling a specific goal, while the deeper information remains managed elsewhere.

Features

• Board Organization: Categorization of goals into default tabs (Daily, Weekly, Monthly, Yearly) or custom-created boards.
• Checkbox Collections: Marking structures available in two formats:
  • Discrete: Sets of fixed steps for simple counting tasks.
  • Continuous: Goals based on total numerical values with proportional filling. The system automatically calculates the partial filling of each block according to the current progress.
• Rapid Interaction: Support for filling entire blocks via direct click or fine-tuning values through dedicated controls.
• Local Persistence: All data is stored directly in the browser's LocalStorage, ensuring privacy and offline functionality without the need for a database server.

Technical Choice: Why Svelte 5?

I chose Svelte 5 because I wanted a lightweight, high-performance solution that felt instantaneous.

One of my main requirements was that this tool should live on my computer as a simple, portable file. I didn't want to rely on a hosted service or a local server just to track my habits.

• Single File Compilation: Using a specific build pipeline, the entire application (Logic, Style, and Structure) is compiled into a single index.html file.
• Local Storage Persistence: Even when running as a local file via the file:// protocol, the app uses the browser's LocalStorage. This means my goals and progress stay on my machine, exactly where I left them, without needing an external database.

Getting Started

To run the project in a development environment:

1. Install dependencies:

   npm install
   

2. Start the local server:

   npm run dev
   

Build and Portable Version

To generate the standalone portable file:

1. Run the build command:

   npm run build
   

2. Open the resulting dist/index.html file in any modern browser. You can move this file anywhere on your system and it will continue to function as a self-contained utility.