After spending years 😏 building applications with Nuxt.js (and occasionally dipping into Next.js), I decided to take a step back to pure Vue 3 and create a.. lo and behold - a Google Keep alternative.
Just kidding - the app is far more dumb.
Notocan: A Dumb Google Keep Alternative
Notocan is what I like to say “deliberately dumb”, local and fast. It’s not trying to be the next big productivity platform with AI features, cloud sync complexity, or fancy collaboration tools. It’s just notes, done right in a browser window.
tldr;
- Has it been done a million times? Yes.
- Has it been done by me in the past? Probably, yes.
- Will it deter me from building something dumb again. Absolutely not.
The core features are straightforward:
- Create notes with titles and rich text content
- Color-code your notes for visual organization
- Pin important notes to keep them at the top
- Archive notes you don’t need anymore
- Search through all your notes instantly
- Keyboard navigation
Check it out here:
https://notocan.techformist.com
If you are gungho about todo’s and notes - Notocan is open source and available on GitHub.
Feel free to use the app, or just poke around the code!
Back to the Experience
The experience though has been nothing short of refreshing. No more complex configurations, no more wrestling with SSR setups and errors, just pure Vue 3 with the Composition API.
The dev experience is incredibly fast - hot reload is instantaneous, compilation is lightning-quick, and the build process feels almost instantaneous.
It’s amazing how much mental overhead you shed when you don’t have to think about server-side rendering for a client-side notes app. Also, there are no accounts, no subscriptions, no worrying about data privacy or service outages.
Your notes live in your browser’s IndexedDB, which means:
- Instant loading (no network calls)
- Works offline perfectly
- Your data stays yours
- Migration from localStorage is handled automatically
The IndexedDB implementation includes pagination for performance, so even with hundreds of notes, the app stays snappy.
Also, I can’t say enough good things about DaisyUI. Every time I use it, I’m reminded why it was my go-to UI library. The component system is thoughtful and the default styles just work without being overwhelming.
Combined with Tailwind CSS, DaisyUI makes building polished interfaces feel effortless. The color system, spacing, and component variants work together seamlessly. It’s the kind of library that gets out of your way and lets you focus on building features, not fighting CSS. And, not having all the code in my repo mocking my design skills. I would like that mocking to be deep insite the node_modules thank you very much.
Conclusion
Building Notocan reinforced some important lessons:
- Simple is indeed beautiful
- I continue to be undeterred by no one using the applications I build
If you need a simple notes app, check out Notocan - it might just become your new favorite way to jot down thoughts.
