[Dev log – DotnetGTD] Rewriting my task management app

I toyed with this idea for a while, my old task management app that I wrote in a few days had some limitations

  • It sends the whole database in JSON format every time something is changed.
  • The whole database is stored in memory of the browser, all the time.
  • There was no automated tests, and implementing new features was very difficult and easy to break things.
  • As a bonus, it is difficult to write tests for the app, since it was not designed to be testable from the start.

Because of those design decisions, there are a lot of consequences.

  • It’s hard to write tests to prevent regression.
  • That leads to it being hard to add new features or fix existing bugs without breaking something.
  • The whole database being stored in memory and sent to server every time something changes does not scale well with many tasks and projects (like 100s of thousands).

So I finally decided to rewrite the whole app using

  • Vite React for frontend.
  • Tailwind CSS for UI and UX development.
  • Vitest for frontend unit tests.
  • ASP.NET for REST WebAPI backend.
  • Entity Framework Core for Database ORM.
  • Azure SQL Server for database.
  • xUnit framework for backend unit tests.
  • Github Actions for CI/CD pipelines.
  • Docker for deployment.
  • Personal home server for hosting.
  • Cloudflare tunnels to give access over the Internet.

The project has been worked on for 5 months since June, it’s fully Test Driven Development and make use of the knowledge and experiences I have acquired from work and books.

This is actually the third time I have written a task management project, the first version was written back in 2018 and no longer compiles (you can read about it here).

The second version was written 2 years ago in 2023 and had all those limitations (there is a blog post here)

I decided that this version would be the last, as it is built as well as possible for easy maintenance and feature implementation. My experience in the past 5 months has been great. Finally the project is ready to use and I have migrated all my data from my previous task manager to the new one.

From this

To this

Yes, I use it to manage development of itself.

So far it is missing some small features from the previous version, but the main big features are there and ready to use to make me productive. I will add back some of the quality-of-life features back over time.

Rewriting the app is also a very good chance to apply all the knowledge I have learned from work and books, to add it to my portfolio and at the same time add value to both my professional and personal life.

I have found that it’s much more productive to focus on one project at a time to get one done and move on to the next, rather than trying to do a few projects at the same time and make tiny progress at each one. Now that I’m done with this, I may move on to the next project, it might be another full-stack application, a mobile app, or another video game project.

[Dev log – ReactGTD] Home style Continuous Delivery

Today I added a new feature to my React based GTD app. It was basically so that the web app remembers the last task view I was browsing so when I reopen it next time, it automatically opens the last view.

So for example, if I was last opening the Study view, the app would remember that, the next time I visit the app’s URL, it will automatically switch to Study view.

I wrote the whole thing using TDD and never ran the app once, and surprisingly after automatic deployment, it works the first time <3. Automation is beautiful.

I would like to blog a bit on my home style continuous delivery. Basically the app is hosted in a cheap second hand NUC mentioned in another blog post.

The server

The server

Once the code is pushed to a remote branch on Github, a PR is created and a Github workflow runs and execute the tests.

Then when the PR is merged to main, another Github workflow runs. The workflow builds the docker image and push to DockerHub registry.

Now the home style Continuous Delivery part: the home server has a cron job that runs every hour, the cronjob changes to the directory of the docker-compose file of the app, and then simply run

docker compose pull

docker compose up -d

It works, and it’s stupid simple xD. I remember the first time I wrote the app, I built and deployed the image manually many times, sometimes incorrectly because of some accidental changes to the files in the source code.

Now I just merge the pull request and wait until the app updates itself from the server.

[Dev log] Getting Things Done (GTD) app with React and Redux

During some public holidays, I decided to rewrite BruceTodo – a GTD/Task management application I wrote in 2019, because BTD was written using multiple libraries that have had drastic changes since 2019, I couldn’t even build the old project anymore.

BTD was written as a way for me to learn React and Redux, I was new to the uni directional data flow design of React back then, so the code has some design decisions that make it less robust and more buggy.

I have not been very satisfied with many of the task management apps in the market as they are not tailored exactly to my needs, and work and life has been very chaotic with many things to keep track of. Some of the apps can provide 70% of the features, the rest requires more manual work to maintain.

Rewriting BTD will be useful to me to manage my work and life, it’s created to fit exactly my needs and I can also enhance it as needed.

Some decisions were made to improve the app and simplify maintenance:

  1. Instead of using a UI libraries/framework, use only plain HTML and Bootstrap.
    • Antd was changed drastically in later version, so it would be really troublesome for me to maintain and keep updating the app so it does not become unusable.
  2. Data are stored in a single JSON document instead of few tables in relational DB.
    • This drastically reduces the amount of backend code, and makes data updates much much simpler.
    • Data backup is also a matter of copying the JSON document from the server and store somewhere.
  3. The application is containerized in a single container with a volume to persist user data, similar to the cooking plan project.
    • This allows quick deployment by just pulling the latest Docker image and recreate the container.

The UI is very similar to the old one, it is designed for me so it’s most efficient and effective for me to allow me to quickly organize my tasks and projects. It’s for power users so no need to be super user friendly.

You have three separate views for tasks, projects and tags.

You can easily filter projects and tasks by the completion status, or whether the tasks and projects are current or to be done later. Tasks can also be filtered based on tags or projects. Since it’s React and everything is loaded into memory, filtering is super fast.

It’s also just a single click to mark a task as completed, or convert it to later or current task, you can also quickly set the project the task belongs to.

Each task can have multiple tags, so if a task can be done both at work and at home, you can add both tags to the same tag, and filter by the appropriate tag based on your current context.

Both projects and tasks can be quickly marked as Later, or make current by unchecking later. This allows me to quickly reorganize my current work depending on prioritization and workload.

The application has been deployed for personal use and so far it’s great, I will blog more about it in future posts on technical aspects.