The Long View
A year-at-a-glance planner. No signups, no servers.
You've seen those $50 "Big Calendars" on TikTok—giant wall posters that show your whole year at a glance. I wanted a digital version that was free, portable, and didn't require an account.
Try It
Interesting Problems
Lane Calculation
When events overlap, they need to stack vertically without colliding. The naive approach is O(n²)—compare every event to every other event. For a personal calendar with <100 events, this is fine. I kept it simple instead of prematurely optimizing.
Multi-Day Rendering
A 14-day vacation needs to render as one draggable bar spanning multiple cells. CSS Grid handles the layout, but the tricky part is calculating which cells an event occupies when months have different lengths. February 28th + 5 days = March 5th, not February 33rd.
No Backend
Everything lives in localStorage. This means no auth, no database, no server costs—but also no sync across devices. I added JSON export/import so users own their data completely. Trade-offs.
UI Design
The UI presented a challenge. The calendar grid itself came together quickly. It's just data in boxes. But the header and toolbar? I went through probably a dozen iterations trying to figure out where zoom controls, year navigation, theme picker, and import/export should live. Nothing felt quite right.
The current layout works. It's not embarrassing. But I'm still not fully satisfied with how the controls are organized. I'd probably focus on a collapsible settings panel or a command palette instead of everything visible at once.
Stack
- React
- TypeScript
- shadcn
- dnd-kit