Live data from Hacker News

Nullboard: Kanban board in a single HTML file

github.com

151–160 of 191 posts

Re: Nullboard: Kanban board in a single HTML file

#152
post #127

Earlier quoted context omitted.

I'm authoring two, One that's a keyboard based mnemonic launcher for accessing various websites. It's basically a way to have your bookmarks outside of the browser and quickly accessible. The other is a tabbed markdown document that can render static copies of itself. The two projects out in the wild that natively work with this approach are TiddlyWiki and FeatherWiki. I see room for a lightweight version of a calend…

Is https://rpdillon.net/redbean-tiddlywiki-saver.html still what you're using?

I've been working on projects like this for some time and that particular project happened to make the Hacker News front page but was not the client files that I'm referring to here, but rather a server. It was a side project to play with a redbean, since I'm a fan of jart's work.

My primary saver is a Python script that I wrote called Notedeck, but I also sometimes use a Rust webdav server called dufs.

I haven't released either of my projects I'm working on that are the client files, otherwise I would have just linked them.

Re: Nullboard: Kanban board in a single HTML file

#153

Earlier quoted context omitted.

I totally understand your take, but as a guy that spends most of his time on side projects working on single HTML files, I have a different perspective. I find the totally self-contained nature of them very appealing because it travels well through space and time, and it's incredibly accessible, both online and offline. My current side project is actually using a WebDAV server to host a wide variety of different sing…

> The main trick to these apps [...] is to construct a file in such a way that it can create an updated copy of itself and save it back to the server. Any additional info/pointers on this ?

Yes, I have done a lot of analysis on the structure of tiddlywiki and featherwiki to figure out the right way to do this in a more repeatable way. And that's the basis that I'm using for the projects I'm working on. I'm planning to write a blog post on this soon because I've learned a lot. So stay tuned.

For the benefit of the Hacker News audience that are curious, let me take a stab here.

The general strategy is to include JavaScript in the HTML document that knows how to look at various nodes in the DOM and create a new version of the document that uses an updated set of data.

Some sections of the data can be pulled verbatim. So, for example, if you have one giant script at the bottom of the doc, you can give it an ID of perhaps S, and then use that ID to retrieve the outer HTML of that script tag and insert it into the clone.

Other areas of the DOM need to be templated. So for example, I insert a script that is of type JSON, and that contains all of the data for the application. This can be pulled and stringified when creating the clone.

For a minority of attributes like the title and document settings like whether or not you're in light or dark mode, you want to avoid a flash of unstyled content and so you actually templatize those elements so they are written into the cloned copy with the updated data directly inline.

There's no real magic to it, but it can be a little bit tedious. One really interesting gotcha is that the script tag is parsed with higher precedence than quote tags. And so I have to break up all script tags that appear in any string that I'm manipulating so that the parser does not close out the script I'm writing.

I have a very minimal app that uses this technique called Dextral. I'll be happy to host it on my site and link it here.

Re: Nullboard: Kanban board in a single HTML file

#154
post #104

This is mine. FWIW here's a Show HN from 2019 - https://news.ycombinator.com/item?id=20077177

Do you know if a remote backup service was written? I am going through SimpleBackup code, (and if not exists) I would like to contribute remote agent for backup. Any pointers for that implementation would be appreciated.

Yes, I wrote one [1] and others did too, e.g. [2] and [3].

The gist of it, as mentioned in [4], is that you need to have a web server that implements checkStatus and saveConfig PUTs, and PUT and DELETE for saveBoard.

[1] https://github.com/apankrat/nullboard-agent

[2] https://github.com/luismedel/nbagent

[3] https://github.com/OfryL/nullboard-nodejs-agent

[4] https://nullboard.io/backups

Re: Nullboard: Kanban board in a single HTML file

#155

This is very cool. BTW, when developing single HTML file apps, instead of localStorage, one can use the HTML as the source of truth, so the user can just save/save-as to persist. I had mentioned my quick and dirty attempt at an image gallery that is a self-contained html file and some really liked the concept, if not the "app" itself: https://news.ycombinator.com/item?id=41877482

How would this work without manually editing the HTML file?

Re: Nullboard: Kanban board in a single HTML file

#156
post #155

This is very cool. BTW, when developing single HTML file apps, instead of localStorage, one can use the HTML as the source of truth, so the user can just save/save-as to persist. I had mentioned my quick and dirty attempt at an image gallery that is a self-contained html file and some really liked the concept, if not the "app" itself: https://news.ycombinator.com/item?id=41877482

How would this work without manually editing the HTML file?

You write Javascript to read and write to HTML, like, develop a single page app that treats HTML as the view and the database, and restores state on DOMContentLoad from the HTML. Super easy and maintainable for micro apps.

You can also use the contenteditable attribute and use no JS, so you basically have a notepad.

Re: Nullboard: Kanban board in a single HTML file

#157

Earlier quoted context omitted.

My bad, I should have mentioned that you should choose the option to save the complete web page. It becomes default on Firefox once you select it. Not sure about Chrome and others. It looks like this on Firefox, Windows: https://imgur.com/zNlEGgK

Great idea, as usual killed in its infancy by lacking UA UX. We even already have an API to ask the user not to close the web page, because there's unsaved work; but it wouldn't work with "Save as...", because you can't detect that, and the browser won't do it for you, even if it knows you're editing a local file. Same for all of the pointless cookie banners - they could've been UA prompts instead, putting the user i…

It's not killed IMHO, I actively use a fleet of such single HTML file apps that I save locally and even share with people. My initial comment has an example of a gallery, works wonderfully.

Re: Nullboard: Kanban board in a single HTML file

#158
post #32

I think "single HTML file" sets up a certain expectation that a five-thousand-line long HTML file with ~3500 lines of embedded JS doesn't really live up to. I mean, hey, everything can be a single HTML file if you embed the bundle inline in your HTML! Cool project, though - don't mean to take away anything from it.

I disagree - there is value in single file versus multiple file, even if the LoC are exactly the same.

It’s one reason Mac Apps get bundled as a single “file” from the user perspective. You don’t have to “install”, you just copy one file with everything. It’s a simpler dev experience.

Sure there are tradeoffs, but that’s great! We should accept that tradeoffs mean people can chose what works best for their specific context, rather than “best practices” which are silly.

Re: Nullboard: Kanban board in a single HTML file

#159

Earlier quoted context omitted.

`roamingStorage` as a relative to `localStorage` sort of like Windows' "Local App Data" versus "Roaming App Data' would be nice to have in theory. Of course even if you kept it to the simple KV store interface like `localStorage` you'd need to define sync semantics and conflict resolution mechanics. Then you'd have to solve all the security concerns of which pages get access to `roamingStorage` and how it determines…

> Of course even if you kept it to the simple KV store interface like `localStorage` you'd need to define sync semantics and conflict resolution mechanics. It would be great to have this standardized. Custom two way syncing is a nightmare to implement correctly, and it doesn't make sense for apps to have to keep reinventing the wheel here.

It is a factor in why CRDT/OT posts and libraries get regularly upvoted on HN. A lot of us want a good, easy to use baseline. A lot of us are searching for that and/or thinking we can build that.

Part of why there's always some reinventing the wheel in this space, unfortunately is that this also seems to be one of the harder problems to generalize. There's always going to be domain specifics to your models or your users or users' idea of your models that is going to need some custom sync and conflict resolution work. Sync has a lot more application specifics than most of us want.

That said, yeah, if there was a good simple building block "base line" to start with that met a nice 80/20 rule plateau, it would be great for giving apps an easy place to start and the tools to build application and domain specifics as they grow/learn their domain.

(One such 80/20 place to start if the idea was just a simple KV store might be a basic "Last Write Wins" approach and a simple API to read older versions when necessary. You can build a lot of the cool CRDT/OT stuff on top of a store that simple. Many starting apps LWW is generally a good place to start for the basics. It doesn't solve all the syncing/conflict resolution problems, you'll still need to write app-specific code at some point, but that could be a place to start. It's basically the place most of the simplest NoSQL databases started.)

Re: Nullboard: Kanban board in a single HTML file

#160

Earlier quoted context omitted.

> along with offline and local-first software, avoiding susbscriptions and third party / cloud dependencies Sorry if it's a bit direct and unrelated. I've actually got a question if you wouldn't mind. I've been in the process of creating a local-first, non-subscription based Linux/Windows application that acts as a completely local search engine for your own documents and files. It's completely offline, utlises open…

Good question. I try to avoid proprietary software when I can, so if I wanted something like this I’d definitely look for open source options first. I’ll endure a reasonable amount of setup pain as long as the solution is what I’m after to go the open source route over a proprietary app. For example, your idea seems to sit somewhere between Alfred (which I’ve bought every upgrade/ultimate pack/whatever for) or Raycas…

Thank you so much for taking the time to write such a detailed reply, it's given me a list of things to think about and it's honestly really appreciated. Completely understand the open source side of things and avoiding proprietary tech, I'm exactly the same and only standing on the shoulders of other open source software. I'm utilising SQLite and FAISS, so just files on disk that technically _any_ frontend or whatever could display, it's your data to do what you want with.

Not heard of Alfred as I'm not in the Apple ecosystem, but yes, you've hit the nail on the head between the combination of both after doing a bit of digging.

I'll seriously think about making it open source (time to brush up on the different licenses again). I want to keep it accessible so even my grandma could use it. I'm not expecting her to go cloning a git repo and checking dependencies etc, so I'm packaging it into a standalone executable. Maybe making the source open is something for me to consider and people can just pay if they don't want to go through any setup hassle (do I put some soft donation paywall up with a $0 minimum or something - just thinking out loud).

In terms of pricing, you've landed where I was thinking, maybe more towards the $30 end. I mean I think it's pretty slick and fills a niche, but I'm conscious I may be ever so slightly biased. A lot of stuff to mull over. Thanks again, really useful.

Post reply on HN