Treetop is a browser extension that provides a high-level live view of your bookmarks:
-
Open Treetop by clicking its icon in the toolbar.
-
Treetop shows all your bookmarks on a single page.
-
Treetop updates automatically as you browse.
-
Recently visited bookmarks have a larger font.
-
Search for bookmarks by name or URL.
-
Right-click to edit or delete bookmarks and folders.
-
Click the Preferences button to customize Treetop's display.
-
Click on a folder to make it the root folder.
- Node.js 20.x or greater
- Google Chrome or Firefox browser
Install dependencies:
npm install --global web-ext
npm install
Command | Description |
---|---|
npm run build:watch |
Build for development, watching for file changes. |
TREETOP_TARGET=chrome npm run build |
Build for Chrome. |
TREETOP_TARGET=firefox npm run build |
Build for Firefox. |
npm run check |
Check for unused CSS, a11y issues, and compiler errors with svelte-check. |
npm run lint |
Check code for linting errors. |
npm run lint:fix |
Fix linting errors. |
npm run prettier |
Check code for formatting errors. |
npm run prettier:fix |
Fix formatting errors. |
npm test |
Run tests. |
web-ext run --source-dir dist/chrome --target chromium |
Start Chrome and load the extension temporarily. |
web-ext run --source-dir dist/firefox |
Start Firefox and load the extension temporarily. |
web-ext build --source-dir dist/chrome |
Package the built extension for Chrome. |
web-ext build --source-dir dist/firefox |
Package the built extension for Firefox. |
- Svelte: Component framework.
- TypeScript: Typed JavaScript.
- Vite: Build tool.
- Svelte Material UI: Material UI components for Svelte.
- ESLint: Static analyzer.
- Prettier: Code formatter.
- web-ext: Command line tool for web extensions.
- Vitest: Testing framework.
- DOM Testing Library: Framework to test Svelte components.
Treetop is a modern remake of my My Portal XUL/XPCOM Firefox extension.