NTab: Notepad New Tab

Chrome extension that replaces the new tab page (Ctrl+T, + button, chrome://newtab) with a home screen of large action tiles and a narrow sidebar with the same actions. Actions are links and apps:

• Notes — a tabbed plain-text notepad (think Notepad++), saved as you type, open tabs survive restarts;
• Tracker — tap a tile to log that something happened (smoked, workout, called mom…), or start an activity that runs until you finish it;
• Board — a kanban board: tasks in New / Planned / Work / Hold / Done.

All data lives in the browser (IndexedDB) and works offline; your own small server can sync it between your devices in real time (optional, see Sync server); a backup is one JSON file. No dependencies, no build step. Requires Chrome 122+.

Install

From the Chrome Web Store, or unpacked:

1. Open chrome://extensions
2. Enable Developer mode (top right)
3. Click Load unpacked and select this folder
4. Press Ctrl+T — Chrome shows a one-time prompt to keep the change; click Keep it

After editing any file, hit the reload icon on the extension card in chrome://extensions.

Web version

The same code runs as a plain web page (a PWA) on GitHub Pages: https://thetilliwilli.github.io/ntab/ — open it in any browser, or install it as an app (the install icon in Chrome's address bar). Pages serves the master branch as it is (.nojekyll keeps the files untouched), so a push deploys it.

• platform/web.js stands in for the extension: no favicon cache (tiles show letters or uploaded icons), and no access to other sites, so request actions work only with servers that allow CORS (and only https:// ones).
• Its data is its own (another origin than the extension): move it with a backup, or connect both to the sync server. The page asks the browser to keep its storage persistent.
• Offline: sw.js caches every file per version and starts from the cache. VERSION and FILES in it are generated: run node scripts/sw.mjs after changing any file (--check tells whether it is stale; test/web.mjs checks it). A new version is downloaded in full in the background. The page looks for one whenever it comes back to the screen (an installed app on a phone is resumed, not reloaded) and reloads into it at the first safe moment: at once on the home screen, otherwise on going home or leaving the app; meanwhile a bar offers Reload (shell/update.js).
• The origin thetilliwilli.github.io is shared by every Pages site of the account: any of them could read this data.

Home screen

Every new tab, reload and browser restart starts at the home screen, so notes never appear on screen by themselves (handy when sharing the screen). An app opens from its tile or its sidebar icon; the house button at the top of the sidebar goes back home. The address shows the screen as a route (#/notes); switching screens replaces it instead of adding browser history. The top right corner of the home screen links to the GitHub repository and shows the version (manifest.json; the web version adds its build, the id of the cached file set, so you can tell whether a phone has the latest). An app loads its data when it is first opened.

Data

One IndexedDB database, ntab2 (data model 2); the model (stores and fields) is documented at the top of shared/db.js. The same rules everywhere: every record of every store has a uuid id and updatedAt (its last change), labels are name, times are milliseconds in …At fields, order is a numeric rank (fractional: moving a record changes only that record), the sort of a record is kind. Synced and backed up: notes, trackerTypes, trackerEntries, tasks, actions, settings (one record per setting); this browser only: device (the open note tabs, the backup reminder, the sync server) and outbox (changes the sync server hasn't got yet). Every write is one transaction, and every page of the browser hears about it (BroadcastChannel), so open pages stay in sync.

The Data button in the sidebar (a small square on it: green = synced, red = the sync server can't be reached):

• Sync server — see Sync server.
• Export backup downloads ntab-backup-YYYY-MM-DD.json: { "app": "ntab", "format": 2, "exportedAt": …, "data": { notes, trackerTypes, trackerEntries, tasks, actions, settings } }
• Import backup… checks the file and adds what this browser doesn't have yet (by id): nothing is deleted or changed, a record that is here already stays as it is (the untouched default actions give way to the backup's). To restore a backup exactly: Delete all data…, then import it. Backups of NTab 2.2 (format 1): see From NTab 2.2.
• Import text files… adds every picked file as a note named like the file.
• Delete all data… deletes everything NTab keeps in this browser (the database, the 2.2 database, the cached theme) after a confirm and starts fresh with the default actions; other NTab pages reload. The sync server keeps its data.

When the last backup is a week old (or there was none for a week) and there is something to lose, the home screen shows a reminder with Export backup and Later (3 days).

Sync server

Optional: one small server of your own (server/ntab-server.mjs, Node 22.13+, no dependencies; not part of the extension or the web version) that all your NTab clients sync with: the extension on each computer, the web version on a phone, a plain browser tab. A change on one shows on the others within a second: start an activity on the laptop, finish it on the phone. A client works the same without it (offline, the server down, or no server set yet): its changes wait and go when it connects, whatever piled up meanwhile.

This is the beginning of the README. Read the rest at the original. Read the full README ↗