Simple X-Effect calendar app that sits in the browser. Tick off checklist items and a big red X will appear on that day; you've completed your stuff.
Shows all months of the current year, with the current month highlighted. You can have a daily checklist of up to five customizable items that you can check off each day. When you check off everything, that day is completed and marked with a red X on the calendar. The idea is that over time, this row of red Xs becomes motivation to keep on going so that you don't break the streak. The calendar uses your browser's local storage to save your progress. This means your completed days and checklist items will be remembered even if you close the browser.
I built this to keep track of writing, exercise and leisure goals after my surgery. So those three are the default. You can change them with the settings button.
The entire application is contained in a single HTML file. It's simple enough that the screenshot above is actually more than 10 times larger than the whole code.
Download the HTML file (x-effect-calendar.html). Double-click the file or drag it into any web browser. That's it! The calendar will load and run immediately.
Check off items in your daily checklist. When all items are checked, the current day will be marked with an X. Use the "Settings" button to modify your checklist items. Refresh the page to see a new inspirational quote.
Compatibility: Works on any modern web browser (Chrome, Firefox, Safari, Edge, etc.) without needing any additional setup or installation.
I'm trying to keep it as deliberately simple as possible. There's no need for a web server, no dependencies to install, and no complex build process. I'm basically building these things also as a way of learning JavaScript a bit better, so it makes sense to build as simple as possible.