[HN Gopher] Nullboard: Kanban board in a single HTML file
___________________________________________________________________
Nullboard: Kanban board in a single HTML file
Author : smusamashah
Score : 261 points
Date : 2024-12-19 14:29 UTC (8 hours ago)
(HTM) web link (github.com)
(TXT) w3m dump (github.com)
| bachmeier wrote:
| From the readme:
|
| > Still very much in beta.
|
| The last commit was November 2023.
| rand0m4r wrote:
| If I remember correctly, Gmail stayed in beta for some (~4+)
| years.
|
| Looking at the repository, maybe the author wants to work on
| mobile support, think about alternative storage methods, as for
| the last commit, maybe he's working on something else of simply
| living his life.
| zelphirkalt wrote:
| Pretty sure Gmail never stayer 4y without commits though.
| Probably not even 1 year. Not disagreeing with the notion
| itself, but noting, that the comparison doesn't really fit.
| apankrat wrote:
| Well, I didn't have a need to add or to change anything since
| then.
|
| Here's the full timeline to get a general sense of the
| development pace - http://nullboard.io/changes
| finger wrote:
| Just wanted to say that I really like the style/design of
| your change log timeline. :)
| bachmeier wrote:
| Fair enough, but I wanted to be sure everyone was aware of
| the situation.
| yunruse wrote:
| This is very neat! I'd be interested to see something like this
| with a saving mechanism reminiscent of TiddlyWiki [0], which is
| saved as a portable HTML file. Documents that contain their own
| editors like this are really neat for offline use and long-term
| storage.
|
| [0] https://tiddlywiki.com/#SavingMechanism
| zimpenfish wrote:
| I guess that's something you could add into the remote backup
| server. I'm considering writing my own (in Go/Rust) and I might
| see if I can add that.
| pseudosavant wrote:
| I have implemented Google Drive and MS OneDrive support in my
| one-file video player app. I'm using it for reading, but I
| think it could be used to push back changes to a file for
| saving.
| smusamashah wrote:
| I tried this script (which Claude came up with) to save file
| with all it's changes. The steps are
|
| 1. Put this script in html file and add a save/download button
| to trigger it
|
| 2. Set `contenteditable` on you editable elements
|
| That's it. Now make changes on the page and click download
| button to save the page with your changes. This should allow
| seeing your work without necessarily depending on JS.
|
| The script: <script> function
| downloadHTMLFile() { // Get the current HTML content
| const html = document.documentElement.outerHTML;
| // Create a temporary link element const link =
| document.createElement('a');
| link.setAttribute('download', 'example-page.html');
| // Encode the HTML content as a data URI const
| encodedContent = encodeURIComponent(html);
| link.setAttribute('href', 'data:text/html;charset=utf-8,' +
| encodedContent); // Append the link to the DOM
| and click it document.body.appendChild(link);
| link.click(); // Remove the temporary link
| element document.body.removeChild(link); }
| </script>
| nicoburns wrote:
| No need for the script. Browsers have "save as file"
| functionality built in!
| pseudosavant wrote:
| I love tools like this. I have my own single HTML file project
| for a HTTP video player along those lines.
| https://github.com/pseudosavant/player.html
|
| I'll definitely be looking at the source code to see if there are
| any ideas I want to incorporate into my own single file tools.
| imiric wrote:
| This is fantastic, thanks for sharing!
|
| I've been using something similar for a few years now hacked
| together from different sources, but yours is much more
| polished.
| zimpenfish wrote:
| Fortuitous - I've been looking for a simple Kanban board this
| week and all the popular ones are a bit heavy (`plane` uses 8
| containers!) or insist on using `mysql`.
| vovkasm wrote:
| You might like kanboard, it's a classic LAMP project but it can
| use sqlite for small installations.
| nicholasjarnold wrote:
| I run Planka in an LXC container on Proxmox, but this looks
| useful (despite being 'beta') for anyone who just wants an
| absolutely no frills local-first GUI for simple task management.
|
| The README mentions that "Trello wasn't bad", but storing this
| type of data in the cloud wasn't desirable. Well, Planka is the
| answer to that.
| RedShift1 wrote:
| I'm on mobile, I can't figure out how to add a card to a board?
| haunter wrote:
| Hamburger menu ([?]) then +Note. Works for me on iOS
| staindk wrote:
| Try the hamburger buttons
| huijzer wrote:
| I really think we are as developers underusing setups like this.
| If you could somehow figure out a simple but effective sync
| between devices then that would be able to cover many use-cases.
|
| Maybe we just need an sqlite with better support for replicas?
| Then people have one tiny server with a bunch of sqlite's to
| which the apps can sync?
| evantbyrne wrote:
| For something as simple as this a manual export/import would be
| the most appropriate. Probably not a strong foundation for a
| communication tool.
| latexr wrote:
| > manual export/import
|
| That would mean manual busywork every time you start/end a
| session. If you ever forget one of those steps, your work
| becomes out of sync and that's extra work to sort it out.
| Depending on when you notice, it may take you several hours
| to fix. Not having to do things manually is what computers
| are for.
| evantbyrne wrote:
| You could build a sync feature that requires some
| background process on each client along with likely complex
| configuration for peer-to-peer sharing, or you could build
| a web backend that runs on a server. There are good reasons
| why everyone does the latter.
| summermusic wrote:
| This sounds like a job for WebDAV!
|
| https://en.wikipedia.org/wiki/WebDAV
| rpdillon wrote:
| I'm very interested in this area and this is exactly the
| approach that I'm pursuing.
| mmcdermott wrote:
| One major failing of WebDAV for these use cases is that the
| spec requires you to `PUT` the whole resource/file in order
| to save changes. This isn't too bad when the individual files
| are small, but as your single file apps grow, this means a
| lot of data transfer without the comforts of differential
| uploads.
| nutanc wrote:
| Pouchdb?
| oneshtein wrote:
| Firefox has Pocket. Maybe, it can be used for synchronization
| ("pocketing") between devices.
| oidar wrote:
| CouchDB + PouchDB
| boramalper wrote:
| You're talking about Zero Data Apps[0]. :)
|
| [0] https://0data.app/
| all2 wrote:
| SyncThing is my go-to for multi-device syncing.
| Multicomp wrote:
| Looks nicer than say kanboard, I may give this a shot
| egeozcan wrote:
| 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
| xandrius wrote:
| Wait, so every time I make a change I need to remember to save
| or it's all lost? Or am I missing something?
| egeozcan wrote:
| Yes, is that a no-go? Maybe I'm just being too old-school :)
|
| It does make forks a lot easier, though!
|
| Another advantage is that it makes it clear what you're
| saving, reducing the likelihood of errors being persisted.
| ffsm8 wrote:
| There is a pretty newish filesystem API around. You could
| probably make auto saving possible via that - at least
| after a prompt for the filesystem permission.
|
| Or keeping it as it. That's fine too. It just came to mind
| FrancoisBosun wrote:
| Not so different from Word/Excel/Lotus 1-2-3 from the 90s! I
| like that most software saves-as-I-type now, but that was the
| workflow back then. Ctrl+S was the most used key combo on my
| keyboard back then. Now, it's `:w<Enter>`.
| breakfastduck wrote:
| My god this comment made me feel old.
|
| God forbid you have to remember to _save your work_!
| billiam wrote:
| The mental model my kids have for work is that typing or
| even thinking is itself a finished product. For my
| generation that idea of a conscious action of saving your
| work on a computer made me think more about what I was
| doing and how I was doing it. But I am an old.
| endofreach wrote:
| I understand the overall contrast you're sketching here.
| But can you elaborate on
|
| > typing or even thinking is itself a finished product
|
| Any specific examples where you notice the difference?
| mock-possum wrote:
| I mean - yeah, honestly, god forbid. Requiring manual saves
| with limited change history (or none at all) was _the bad
| old days_. That was bad UI /UX, literally everybody had a
| "oops I forgot to save" and a "oops I saved and I didn't
| mean to" horror story. Things are better now.
| jjeaff wrote:
| I wouldn't say it was totally awful. At least, prior to
| having an Undo option or perhaps an undo but that can
| only go back 3 steps, saving as before making any large
| changes was a pretty common workflow. I might end up with
| 50 versions of a document numbered incrementally by the
| time I was finished. that is still a necessary workflow
| for certain types of documents. I don't necessarily want
| everything saved automatically all the time.
| xandrius wrote:
| I love my paper notebook to save everything
| automatically, I don't long for it to all disappear if I
| forget to press a button and give it a name.
| xandrius wrote:
| Do you really long for that?
|
| It's been over 20 year with auto-save being pretty common,
| one has to adapt to the modern times, especially when it
| makes things better.
|
| I don't have to "remember to save my work" when I write on
| my notepad, why should it be different on a computer?
| darrenf wrote:
| I mean, that's what I have to do in vim, so why not?
| kaimac wrote:
| You can get the browser to confirm you want to close the tab.
| That's what I did with my little single-file scrapbook thing:
| http://kaimac.org/posts/scrapbook/index.html
| rpdillon wrote:
| If you construct the file to be able to save a copy of itself
| with updated data, then it can do so automatically without
| any user interaction, either on a timer or in response to
| some event.
| AlphaWeaver wrote:
| Came here to comment this as well! TiddlyWiki uses this as it's
| default storage format.
| gatinsama wrote:
| Thanks a lot for this. I use it everday and it brings me a lot if
| joy. We need more tools like this one.
| apankrat wrote:
| This is mine.
|
| FWIW here's a Show HN from 2019 -
| https://news.ycombinator.com/item?id=20077177
| asdev wrote:
| did you market it at all? or people just found it organically
| apankrat wrote:
| I showed it around to people that would listen, but
| otherwise, no, I didn't market it per se.
| monkeydust wrote:
| The classic software dilemma when I see something like this.
|
| It is simple, nice and clean.
|
| I immediatley want things knowing deep down that those things, if
| delivered, would probably take away the esscence of what's good
| about it.
|
| Still...i would like alt ways to persist and share ...would be
| nice to manage 1:1s across multiple teams I run :-p
| johnfn wrote:
| 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.
| lelandbatey wrote:
| If I can actually hit "ctrl-s" and save it offline, that's a
| huge and worthwhile feature that meaningfully changes how I can
| interact with the project; it's not purely a fluff description.
| zelphirkalt wrote:
| That will probably never work easily in any secure browser. I
| think at the very least you would have to go: ctrl+s, dialog
| opens hopefully at the right directory you want to store in,
| enter/return.
| hu3 wrote:
| Are you serious?
| lagrange77 wrote:
| What's wrong with that statement? Can you access the
| filesystem without a dialog?
| hu3 wrote:
| It's pure useless pedantry. Imagine the abysmal signal to
| noise ratio if discussions went like that more often.
| bowsamic wrote:
| It's not pedantry at all, he's highlighting a major
| usability issue
| rpdillon wrote:
| The point is that you can save the file and then use it
| offline. The exact set of clicks to make that happen are
| completely irrelevant to the core point.
| rpdillon wrote:
| 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 single HTML file apps that you
| can carry around on a USB drive or host on the web. The main
| trick to these apps is the same trick that TiddlyWiki uses,
| which 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.
|
| I'm attracted to this approach because it's a way to use
| relatively modern technologies in a way that is independent
| from giant corporations that want to hoover up all my data,
| while also being easy to hack and modify to suit my needs on a
| day-to-day basis.
| ustad wrote:
| Do have a link to all the single html file apps you have in
| mind?
| rpdillon wrote:
| 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 calendar, a world
| clock, and even a lightweight spreadsheet that could be
| useful. I also have an idea for something I call a link
| trap where you can rapidly just drop links in and then
| search and sort over them to quickly retrieve something you
| saw before that was interesting. Sort of like my bookmarks-
| outside-the-browser except more of a history-outside-the-
| browser.
| getcrunk wrote:
| This rational appeals to me strongly, especially on a primal
| level
|
| But also that's a lot of code in general
| johnfn wrote:
| I think I'd call that "local-first" or perhaps "offline-
| first". I can't think of a reason why a local-first app would
| need to be crammed into a single HTML file, hehe. I do agree
| it's very cool, though!
| rpdillon wrote:
| I tried to allude to this in my response above, but the
| fundamental reason that they're all crammed into a single
| file is to make sharing really easy. This is what I meant
| when I said it travels well through space.
| swah wrote:
| tiddlywiki brings back memories ... never had been so
| optimistic about computers!
| hedgehog wrote:
| Out of curiosity why WebDAV vs loading the HTML straight from
| disk wherever they are and having a service that's only
| needed to for saving changes?
| PittleyDunkin wrote:
| What about "single HTML file" sets up an expectation about
| size? I'm genuinely confused. They seem like nearly unrelated
| concepts--this isn't a project about trying to fit a kanban
| board into a kilobyte or anything like that.
| crazymao wrote:
| Why mention it when any project can technically be turned
| into a single html file? In my opinion there is an
| expectation of simplicity and as a result a small size with
| that statement.
| hu3 wrote:
| Turning a large project into a single HTML file results in
| a mess.
|
| Very different than a project that was made to be a single
| HTML file from the start.
| johnfn wrote:
| I think there are reasonable expectations around code quality
| that most projects adhere to, e.g.:
|
| - Split JS out from HTML, split CSS out from HTML
|
| - Keep files reasonably small
|
| So if I read "Single HTML file" I'd expect around a couple
| hundred lines at most, possibly with some embedded CSS.
|
| It's kind of like saying "I've solved your problem in one
| line of JS" but then your line of JS is 1000 characters long
| and is actually 50 statements separated by semicolons. Yes,
| technically you're not lying, but I was expecting when you
| said "one line of JS" that it would be roughly the size and
| shape of a typical line of JS found in the wild.
| barnabee wrote:
| IMO those expectations are not reasonable _at all_ given
| the description of the software; they sound more like anti-
| goals.
|
| When I see "single HTML file" it conjures up the same
| expectations as when PocketBase[0] describes itself as an
| "Open Source backend in 1 file".
|
| That is that I can copy that file (and nothing else)
| somewhere and open/run it, and the application will
| function correctly. No internet connection, no external
| "assets" needed, and definitely no server.
|
| This mode of distribution, along with offline and local-
| first software, avoiding susbscriptions and third party /
| cloud dependencies, etc. all appeal to me very much.
|
| So far I'm impressed, I appreciate the nice, dense and
| uncluttered UI out of the box and it seems to cover enough
| functionality to be useful. I'll definitely look out for a
| chance to give it a spin on something real.
|
| [0] which I also think is great
| pryelluw wrote:
| Typical HN passive aggressiveness sandwich. Nitpicking
| criticism with a half meant closing praise.
|
| Cool comment, though -- don't mean to take away anything from
| it.
|
| And Merry Christmas!
| johnfn wrote:
| Lol, I was just disappointed because I was hoping to see a
| kanban board fully implemented in CSS/HTML. I do also dislike
| when nitpicky comments like this get upvoted.
| darrenf wrote:
| It sets up _precisely_ the expectation that everything is
| inline, surely? How else could it be fully implemented in a
| single file?
| jmilloy wrote:
| "Single HTML file" sets up an expectation to me that it is (1)
| browser based and (2) client-side only. In other words, you can
| just open the file and start going without setting up a server,
| setting up a database, installing anything, or even having
| internet access. The last is not _technically_ required but I
| think it is implied. It does not imply anything about the
| length of the file or the presence of client-side scripting.
| qwertox wrote:
| > a five-thousand-line long HTML file with ~3500 lines of
| embedded JS
|
| You made me look at the code and I was afraid of what I was
| going to find.
|
| But man, that code is pretty and well organized, just like the
| resulting page.
| hnlmorg wrote:
| Any project can be a single HTML file, but most projects prefer
| not to.
|
| Most projects prefer to have a separate database, server side
| rendering and often even multiple layers of compilers too.
|
| A lot of projects even require hundreds of megabytes of
| language runtime in addition to the browser stack.
|
| So a single HTML file is still unusual even if it's something
| nearly any web app could technically do if they wished.
|
| And for this reason alone, I think it's unreasonable to have
| expectations of a JavaScript-less, CSS-less code-golfed HTML
| file. This isn't sold as a product of the demo scene (that's
| another expectation entirely). This is sold as a practical
| self-hosting alternative for people who need a kanban quickly
| and painlessly. Your comment even proves that it works exactly
| as that kind of solution. So having inlined JS is a feature I'd
| expect from this rather than complain about.
| nkrisc wrote:
| > I mean, hey, everything can be a single HTML file if you
| embed the bundle inline in your HTML!
|
| Yes, they could be. And then they would have the same super
| power is this file: you can put it on a flash drive and run it
| anywhere with no setup or installation.
| wolpoli wrote:
| Single HTML file conjures up memories of certain Windows
| software of the 90s where it's a single .exe, installer-free
| program. It could be copied onto a floppy and run on my
| school's computer.
|
| We are definitely coming at this from a different angle.
| gjvc wrote:
| talk about judging a book by its cover...
| rmbyrro wrote:
| it's not a BSD license if it has a "common clause"
|
| call it whatever you want, but don't ever mention a BSD License
| if you've modified it.
| seanwilson wrote:
| I wish there was some browser solution for apps like this where
| you could save and share your app state between your own devices,
| and push/share that state with others, all without any server
| backend involvement e.g. so you could have a Kanban board shared
| with others and the state would be stored locally and/or in
| bring-your-own cloud storage.
|
| There's so many apps like this that could be simple, but for
| robust state saving involve setting up and maintaining a backend
| (e.g. with security patches, backups, performance monitoring).
| There's also the privacy implications on your data being store on
| someone's server, and the risk of data leaks.
|
| It's like there's a key part of the internet that's missing.
|
| Something like this could be a browser extension? This exists?
| staticfish wrote:
| You can already do this using things like the Chrome Storage
| APIs (obviously chrome only, and you need to be signed in, and
| bundle an extension)
|
| https://developer.chrome.com/docs/extensions/reference/api/s...
| WorldMaker wrote:
| `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
| "same app" and "same user" to avoid rogue apps exfiltrating
| data from other apps and users.
|
| It would be neat to find an architecture to solve such things
| and see it added as a web standard.
| efitz wrote:
| I thought the primary value of Kanban was about collaboration.
|
| What is the purpose of a 1-person kanban?
|
| How do you collaborate with local storage?
| apankrat wrote:
| Grocery and ToDo lists. That's Nullboard's primary purpose.
| dustinsterk wrote:
| Very cool project!
| Waterluvian wrote:
| Given you can put scripts and css in an html file, you can
| produce basically any website/app and offer it as a single file.
|
| Loaded locally and/or via the Web, are there any other file
| formats that work this way or is .html the only bootstrapping
| option browsers support?
| ulrischa wrote:
| I like these tools that are in one local html file. But this
| seems a bit unsupported. Last commit ist one year old. When you
| need some more but no jira then kanboard.org is what I can
| recommend
| bentt wrote:
| This is very cool!
|
| I can't help but think the missing bit is portability of the data
| file. I wonder if simply allowing a a binary or even JSON
| representation to be copy pasted from the browser would work well
| enough.
| philip1209 wrote:
| That's cool - I've been looking for a simple self-hosted kanban.
| A backend is a requirement for me to use it across devices,
| though. But, I love the direction.
| dools wrote:
| I love it. I use Trello as my 2nd brain but it means that I can't
| do anything offline. Where I can see loving this is if I write a
| little converter so I can take a Trello board JSON export, load
| it into Nullboard and work on it offline, then a thing that goes
| back the other way and creates a Trello board from my NBX file.
|
| Maybe if I put the original trello card ID at the bottom of each
| NBX "note" and then synched any text back as a new comment on
| that card, and the list ID in the title of each list and adding
| any notes _without_ a Trello card link as new cards to that list,
| it would be a pretty automated way to get a bunch of edits back
| into Trello where I could tidy up with copy /paste.
|
| Rock on!! Forked the repo and have my new local version pinned.
___________________________________________________________________
(page generated 2024-12-19 23:00 UTC)