My Calendar
A single-page calendar built around a physical desk calendar: one month, one photograph, a notes column, and no productivity system to maintain.
Stack Next.js · TypeScript · CSS
Most digital calendars are databases with a grid on top. They can hold everything, which is exactly why they end up holding too much. My Calendar is an attempt at the opposite: a single month, a photograph, a notes column, and the pleasure of looking at one object instead of a system.
The visual reference is a physical desk calendar — the spiral binding, the die-cut photograph, the slightly imperfect alignment. The interaction is just as constrained. Move between months. Click a date. Write a note. There is no event model, no time zones, no notifications, and no integration with the rest of your life.
The design
The page is deliberately tall and narrow. On a desktop it sits in the centre of a quiet field, like an object on a desk. The month grid uses a single accent for weekends and a small underline for today. The notes column is ruled paper, not a textarea with a border.
The photograph changes with the month and carries the emotional temperature of the page. That is not decoration. A calendar is a thing you look at every day; it should have a point of view.
The build
The first version was plain CSS and a small amount of JavaScript, which is why the repository still says CSS. The current build is a Next.js page with a typed month model and a CSS layout that does most of the work. The date logic is isolated from the view. The month grid is generated from a single function, so leap years and the first weekday of a month are not special cases scattered through the component.
NOTE
The constraint is the product. Every feature I added to the calendar made it feel less like a calendar and more like an app.
What I would keep
The paper. The notes column is the only place where the interface lets you leave a mark, and it has no formatting, no checkboxes, and no reminders. It is a place to think, not a place to manage.