Tracking To-Dos in VS Code

Let’s talk about tracking tasks while you knock them out

At all the most productive points in my life–during most of which I had to be that productive, lose a job, or suffer some other consequence–I’ve used a good ol’ To-Do list. I’ve hinted at this when discussing bullet journaling and the GTD system here on the site (which I’ll probably discuss further one day), but you don’t have to organize your life by any fancy system to reap the benefits of simply listing tasks as you think of them and doing them one-by-one as you’re able.

Weirdly, I haven’t always been great about carrying this over into my software projects. I’ve definitely worked with Trello and other Kanban boards, notecards on a manager’s wall, and all the other occasionally mandatory systems any professional developer is likely to run into on the job. I think, though, I’ve often been guilty of thinking so “big picture” with my own dev work that I neglect simple steps until I’m too overwhelmed to continue. Once again, it’s been the mighty To-Do list to the rescue.

The usual disclaimers will apply here: I’m currently working on MonoGame projects using Visual Studio Code, though a similar approach can be taken just about anywhere. Conversely, even if you’re doing exactly the same kind of work I am right now, there are limitless other approaches you can take. Some are probably better, and I’m hoping you’ll bring them to my attention. More than anything, if you’re not doing some version of this, and you could benefit from a return to small, simple tasks, I’m hoping to encourage you to try it.

The quest for functional checkboxes

As I mention in the post I linked in the first paragraph, I started using the Obsidian notes app late last year, and quickly writing and formatting using Markdown has greatly improved my life. When you’re handy with Markdown syntax, WordPress, Google Docs, GitHub documentation, and loads of other writing tasks get much faster and easier. When I tried out Obsidian’s Sync service, I found that Obsidian supported functional checklists I could use to start a to-do list, click or tap it on any of my devices during the day, and it would mark the item out for me.

I wanted to bring that kind of convenience into my code projects. I thought it would be great to start a to-do Markdown file which could live in the project files and I could work with it directly in the editor. VS Code let me try this easily, but that’s when I realized something about my Obsidian checkboxes.

In short, that’s very specific, custom functionality. It makes sense that when you see a checkbox in any editor’s Markdown preview mode, you can’t really expect it to do anything just by clicking on it. Preview mode wouldn’t change the underlying file under typical circumstances. This was a problem for me because I was addicted.

I tried several extensions from the Visual Studio Marketplace that directly promised to fix this. To be honest, none of them did. I shan’t besmirch any extension developers here today because it’s quite possible and even likely that they do what I’m looking for in Visual Studio proper–I’m working in VS Code, and that means I’m agreeing to take what I can get.

Thankfully, one of them did something for me that I like just as much. Maybe more!

To-Do checkboxes in Visual Studio Code

The extension I’ve been using so happily for most of a month is called Markdown Checkbox by Philipp Kief. It’s highly customizable and includes features like timestamping when you complete something, modifying the formatting for your checkbox items, and more. The real magic for me has been the keyboard shortcuts.

As I mentioned, nothing I tried resulted in preview mode checkboxes that I was able to check permanently by clicking. With Markdown Checkbox, however, I’m able to access my file in edit mode beside my code and press Ctrl+Shift+C to insert a new checklist item. When I’m done, putting my cursor on the line and pressing Ctrl+Shift+Enter will put an X in the brackets (or however I’ve configured it to look) and put the date I closed the item out at the end of the line.

Timestamping the items as I close them out was something that oddly never occurred to me before, and doing so has created the added benefit of seeing how the project has progressed over time and given me a very realistic sense of pacing as I work.

How I maintain my To-Do list

If you’re curious about how I work with that list, it’s a blend of basic bullet journaling principles with a touch of the Getting Things Done methodology approach and very light project management mentality.

First and foremost, I suggest using this list as your second brain for the project. Every time you dream up a feature, notice a change worth making, or identify an issue that needs to be fixed, add it to the list. In every major productivity system I’ve tried (and as you can see, I’m kinda That Guy), one of the core concepts is to get everything out of your brain and stored on paper or in a file somewhere so you can commit yourself completely to the work you’re doing in the moment. While I’m not a practitioner of the system officially known as Getting Things Done based on David Allen’s book of the same name, I fully believe that approach is not just a one-way ticket to better work, but done well, it can make you more present when away from your work as well.

After I was good about keeping up this list, I made another change that helped me further discipline my mind during development time. For big changes on my list that tend to send me into another dimension of thought where I try to predict everything for the rest of time, I started making nested lists of steps (each with its own checkbox) needed to complete that task. To complete and check off the top-level task, I have to complete and check all of its subtasks. Only you know what your brain needs in these situations. I’m finding myself getting pretty granular. As a result, I’m knocking out small additions and improvements to my project regularly and my work sessions feel more like I’m playing a puzzle game with short satisfying levels.

Finally, and this is fairly recent, I’ve started using Markdown’s convenient header system to split up my to-dos under Major, Minor, and Fix headings, similar to the Major/Minor/Patch versioning system. There’s plenty of room to argue the value of doing this step, but I think it’s kind of nice seeing at a glance where I’ve spent my time, where there’s the most left to do, and it’s definitely helpful to be clear and honest with yourself about where a change actually belongs when you’re first capturing it on your list.

Here’s an example for a project I’m working on with my son.

# To Do


## Major
- [X] *Feature: create squares* [2023-10-18]
    - [X] *move a dot in draw mode* [2023-10-18]
    - [X] *When button pushed, create minimum rectangle* [2023-10-18]
    - [X] *Method: draw straight lines* [2023-10-18]
    - [X] *draw rectangle edges* [2023-10-18]
- [X] *Add an instruction label* [2023-10-21]
    - [X] *Add font to the project* [2023-10-21]
    - [X] *Add instructions to be displayed* [2023-10-21]
- [ ] Feature: Create labelled rooms
- [ ] Feature: Add props to rooms
- [ ] Feature: modify layout squares

## Minor
- [X] *Resize window* [2023-10-18]
- [X] *Set BG color* [2023-10-18]
- [ ] Restrict foundation drawing zones
- [X] *Allow player to cancel foundation draw by hitting esc or something else* 

## Fix
- [X] *fix draw when mouse is on left side of or above anchor point* [2023-10-18]
- [ ] Rectangle drawing isn't displaying correctly when starting from bottom right

In preview mode this looks fancier, but again, you don’t strictly need preview mode for this method at all.

Needless to say, one of the biggest benefits of this method is that, when I inevitably get pulled away from this project for 2 months soon, I’ll have a very clear picture of what was going on when I come back.

Don’t be shy if you have another method for tracking to-dos we need to hear about!