Show HN: Replace Chrome new tab with a blank WYSIWYG editor for taking notes

Show HN: Replace Chrome new tab with a blank WYSIWYG editor for taking notes(github.com)

6 points by hakaneskici 1 year ago | 7 comments

minimalistab is an extension for Chrome that replaces the default "New tab" page with a blank WYSIWYG editor for taking notes.

Sometimes I need a blank screen to stare at, especially when context switching between tasks; so I made this Chrome extension with basic note taking capabilities.

I kept the code as simple as possible, formatted for developers with dyslexia. Let me know your opinions.

I hope you find it useful. Feel free to personalize and hack your own copy. Feedback very welcome.

DEMO: https://raw.githubusercontent.com/hakaneskici/minimalistab/r...

Install as an extension: https://github.com/hakaneskici/minimalistab

Features:

* Take notes with formatting

* CMD/CTRL + {B, I, U} or toolbar

* Works offline by design

* Auto save to local storage

* Download as .html file

* Dark/light system theme

* Paste images and links

* Plain JS, no dependencies

* No tracking, no telemetry, no cookies

* Works without JS too (no saving)

* 100% handcrafted human code (TM)

Here's the primary trick that makes this possible:

https://news.ycombinator.com/item?id=43179649

Previous discussions and tools:

[1] Nash - https://news.ycombinator.com/item?id=43358914

[2] Notetime - https://news.ycombinator.com/item?id=43434152

[3] NoteUX - https://news.ycombinator.com/item?id=43492415

[4] TiddlyWiki - https://tiddlywiki.com/

hakaneskici 1 year ago |

I found more tools from previous discussions:

https://tabnotes.page/

https://original.littr.me/

https://feather.wiki/

https://zareith.github.io/chillmd/

Although most tools use the "contenteditable" trick, I noticed some save the *entire page* as HTML. I used a different approach to enable downloading just the editable content:

  const blob = new Blob([content], { type: "text/html" });
  const url = URL.createObjectURL(blob);

edoceo 1 year ago |

I made one like this for myself. Love this. Mine has two panels. One for notes and the left side is just a tall menu, big buttons of my favorite sites/tools - saves a few clicks. Custom newtab is underrated.

hakaneskici 1 year ago | |

Awesome! I'd love to see it.

One of my goals was to make the code "hackable", so that you can take this as a starting point, then extend and personalize it, to make it "yours".

> Custom newtab is underrated

Exactly. I'm surprised myself how handy this turned out :)

beardyw 1 year ago |

I haven't really looked but my immediate reaction was - why an extension? Wouldn't a web page be capable of of this?

hakaneskici 1 year ago | |

The only reason is that it shows up on all new tabs. It's just always there.

Backstory: My primary goal was to have a blank screen when I open a new browser tab. It helps me with context switching, to stop and think. Later I added an editable area to jot down a few quick notes before typing a URL that takes me to my next distraction :)

beardyw 1 year ago | | |

But on most browsers you can set any page as the default.