Sideproject: Focusthingy

, 1 min read

I wanted to build this for a while now and finally got around to do it.

project screenshot

Check it out on
The source is available on GitHub.

As the footer says, it is inspired by a Chrome extension. But I can't remember the name of it. If you happen to know the extension, let me know.

Using IndexedDB

This project was my excuse to practice some Javascript as well as applying the principles of OfflineFirst. I decided to use IndexedDB, because it seems to be the simplest solution for persistent offline storage. There is also localStorage which has limits on the maximum size of data. If you are looking to sync your data to a server, maybe give or PouchDB a try.

An IndexedDB primer

IndexedDB is an object storage for Javascript objects. Each IndexedDB database stores a collection of key-value pairs. Each value can be a Javascript object of any complexity. The key can be a property of such an object. You can also create indexes of any properties for quicker searching and sorting. Furthermore, instead of using SQL, in IndexedDB you use a cursor to iterate over a result set.

If you want to learn more about IndexedDB, I recommend starting with the IndexedDB guide on the MDN.


Philipp Hansch

Full Stack Developer

Philipp is a full stack developer currently heavily involved with Rust. Most notably he's a member of the Clippy team where he helps with bugfixing and documentation. You can follow him on Mastodon and find him on GitHub as well as Patreon.