[HN Gopher] Using static websites for tiny archives
___________________________________________________________________
Using static websites for tiny archives
Author : ingve
Score : 291 points
Date : 2024-10-18 06:12 UTC (16 hours ago)
(HTM) web link (alexwlchan.net)
(TXT) w3m dump (alexwlchan.net)
| noja wrote:
| https://www.filestash.app/
| egeozcan wrote:
| I copy the images in my clipboard and save them in an HTML file
| to have single-file galleries:
|
| https://gist.github.com/egeozcan/b27e11a7e776972d18603222fa5...
|
| Live:
|
| https://gistpreview.github.io/?b27e11a7e776972d18603222fa523...
|
| Selecting via file-picker works too. Dragging usually does not.
| When all works, images are inserted inline as blobs.
|
| After adding images, if you save the page (literally file->save),
| the blobs are saved together. don't want a part when saving (for
| example, removing images)? inspect element, remove, save page.
|
| throw the page on some server or just double click on your
| computer/mobile.
| joncfoo wrote:
| That is slick. Offline first in the truest sense.
| freetonik wrote:
| This is very cool, thank you for sharing.
| mikae1 wrote:
| Love it! True to the original vision of the WWW. Tim Berners-
| Lee's WorldWideWeb browser was also an editor.
|
| https://github.com/cadars/john-doe gives me the same feels.
| thatcat wrote:
| Very cool design! note if you can't get it to work, make sure
| you set file type to complete webpage when saving.
| simonw wrote:
| That's really neat!
|
| You could add a "Download this page" button on the page which
| does some tricks to produce an HTML file with the images baked
| in that the user can download, which could work on mobile.
|
| Here's a quick prototype:
| https://gistpreview.github.io/?14a2c3ef508839f26377707dbf5dd...
| - code here:
| https://gist.github.com/simonw/14a2c3ef508839f26377707dbf5dd...
| egeozcan wrote:
| Thank you! Great idea, I'll give it a try :)
| mathnmusic wrote:
| Strict hierarchies are indeed too rigid. What about using a tag-
| based file manager like TagSpaces (which is free and open-
| source)?
| deafpolygon wrote:
| MacOS also supports tags.
| lovegrenoble wrote:
| nice idea
| freitzzz wrote:
| Really nice idea! As a data hoarder myself, I think I will follow
| this as way to remind myself of the things I truly should archive
| :)
| Rhapso wrote:
| I convert content to markdown and relevant images and then store
| them in an obsidian vault. I self-sync it with syncthing. It has
| quickly become a rather effective zettelkasten memory prosthetic
| on my laptop and phone.
|
| I also use google/facebook takeouts, reformat the results, and
| store+index all my human-facing correspondence in there. Text is
| cheap and I avoid most images. Its still under 200mb and
| instantly searchable with a nice UI and as a bunch of markdown
| files it is easily portable.
| PoignardAzur wrote:
| > _zettelkasten memory prosthetic_
|
| You're really going to drop these three words without any
| context?
| Rhapso wrote:
| I was hit on the head a lot as a child. My memory isn't
| great, so I take a LOT of notes. Those notes and the
| writing/searching tools to use them are very literally a
| memory prosthetic.
|
| Zettelkasten is a methodology of organizing a LOT of notes.
|
| I index by topic, date and people involved. I can look up a
| friend and re-read every shared IM, email, and event I logged
| almost instantly. Faster than any website can. It's my own
| personal pile of papers future historians will be excited to
| find because they can actually read it.
|
| One of my biggest frustrations is that most of my note-taking
| tools are not permitted in my workplace for security reasons.
| I have to keep all my notes on their infrastructure. I'm
| going to loose a chunk of my brain when I change jobs
| someday.
| sourcepluck wrote:
| Have you thought about writing up a lovely tutorial on this
| going into all the details? Seems like a lovely setup!
| Rhapso wrote:
| Its in the backlog of notes labeled "blog post ideas" :'(
|
| I think more general tooling to "convert your assorted
| takeouts into a local database" is higher on my todo
| list. I have a bunch of python scripts I cobbled together
| to convert things. If we can get it all into an easy to
| use database, everybody could do their own things with
| them more easily.
| adamhp wrote:
| There is a ton of content about Obsidian! Also it's a
| fairly intuitive interface. I'd just download it and
| start messing around, then check out the community
| plugins. If you really want to dig into notes systems,
| then you can Google PARA or Zettelkasten, but to me, that
| quickly begins to devolve into homework and needless
| learning curves. Just bolt on what you need it for. It's
| very full featured and if you feel like you're missing
| something, just search for a plugin.
| deadfast wrote:
| I don't understand if you are self-syncing how would you
| lose your notes when switching jobs? Just exclude relevant
| work directories with sensitive info compress the vault and
| ship it to a cloud provider.
| Rhapso wrote:
| I have to take work-notes on security isolated hardware
| and the notes are owned by my employer. I can't really
| expand on the subject.
| bee_rider wrote:
| > I'm going to loose a chunk of my brain when I change jobs
| someday.
|
| Ah, that is quite sad. Do you write general impressions of
| the work day, at least, when you get home? I guess none of
| us remember all of the details of our workdays anyway.
| Terr_ wrote:
| That reminds me (heh) of a bit from one of my favorite
| book-series, involving someone recovering from a kind of
| brain injury.
|
| > "It's been so long since I had to [use a holo-map], it
| didn't even occur to me. It's like an eidetic chip you can
| hold in your hand. It even remembers things you never knew
| before. Wonderful!" He unfastened his jacket, and pulled a
| second device from an inner pocket, a perfectly ordinary,
| though obviously best-quality, business audionote filer.
| "She gave me this, too. It cross-references everything
| automatically by key word. Crude, but perfectly adequate
| for ordinary use. It's nearly a prosthetic memory, Miles."
|
| > _The man hadn't had to even think about taking notes for
| the past thirty-five years, after all. What was he going to
| discover next, fire? Writing? Agriculture?_ "All you have
| to remember is where you put it down."
|
| > "I'm thinking of chaining it to my belt. Or possibly
| around my neck."
|
| -- _Memory_ (1996) by Lois McMaster Bujold
|
| That last "audionote filer" is looking increasingly
| practical in real-life, cross-referencing and all.
| winter_blue wrote:
| What do you use to sync Obsidian on your phone? Is it syncthing
| as well?
| Rhapso wrote:
| It works great on android. I have a laptop, my phone, and a
| NAS all syncing. The NAS does most of the heavy lifting. Its
| a little P2P data ship-of-Theseus as I replace machines over
| time. As long as I don't throw my laptop, phone, and NAS all
| in the river at once, my data is safe. The encrypted sync
| feature of sync-thing lets me and my so-inclined friends use
| each other as offsite backups. Its honestly the best open
| source software other than GNU apps or Linux I have ever
| used.
|
| Make sure you setup basic version control in syncthing, I had
| some issues with my daily notes getting clobbered because
| they were autogenerated by multiple obsidian instances.
| Tuckerism wrote:
| I saw that the OP already replied, but wanted to share how I
| approach this myself. I have a desktop, laptop, and phone
| that I wanted to keep synced up, so I actually used it as an
| excuse to setup my own git repo on my NAS (which I wanted to
| do anyway).
|
| The only tricky part has been dealing with git on iOS. I have
| to use a particular app (Working Copy) and some shortcuts to
| get the syncing behavior consistent. But it is doable!
| massimoto wrote:
| I recently wrote a static site generator from AnyBox's local
| database, since they currently only allow for backups via iCloud
| which is locked down on my work laptop. I was surprised by the
| peace of mind it gave me to have a nice, 100% portable version of
| my vast bookmark/website archives.
| ejddhbrbrrnrn wrote:
| Markdown files can be a magic low effort way to get this. Even
| less fancy. Just stick an md file and it is easy to link to
| stuff. Open it in VS Code. You can go full zettlekasten but you
| can also just drop some notes around.
| chrisweekly wrote:
| that's one of the things I love about Obsidian -- at the end of
| the day, it's "just" an extraordinarily powerful interface to
| Markdown files.
| pomdtr wrote:
| I had similar thoughts, and built myself a little framework for
| this: https://www.smallweb.run
|
| The key feature it adds compared to your own setup is mapping
| subfolders to subdomains (+ dynamic websites, but you don't seem
| interested in that).
|
| ex: ~/smallweb/example => https://example.localhost
|
| We have a little discord community at
| https://discord.smallweb.run if anyone is interested.
| tga wrote:
| It looks like you just reinvented CGI/PHP.
| pomdtr wrote:
| Yeah you guessed it, smallweb is basically CGI meets Deno
| sandboxing + https imports.
| lazylizard wrote:
| https://linux.die.net/man/1/tree
|
| will list your directory tree as a html file..helpful?
| justusthane wrote:
| For myself at least, there's no way I'd stick with this over the
| long run given the overhead of hand-editing an HTML file (however
| quick and simple) every time I needed to add an item to a
| collection.
|
| Seems like an ideal use for a very simple DIY static-site
| generator. Write it in Bash or Perl and it will be future-proofed
| forever.
| zoobab wrote:
| PDF is better for archiving, but what about videos?
|
| HTML ready sucks for archiving.
| klez wrote:
| Can you please explain what you mean that PDF is better for
| archiving while HTML sucks in this aspect? What aspects of the
| formats are you basing this on?
| gazook89 wrote:
| I'm not the commenter but I Imagine it just boils down to
| what you are archiving, but in any case I don't think the
| commenter really understands what html is being used for
| here. The "preserved" material doesn't have to be html, the
| html is just to set up the directory navigation. In the blog
| post, they even mention that each type of material is its own
| website so that each website can be designed to handle that
| file/data type.
| crtasm wrote:
| >folders require you to use hierarchical organisation, and
| everything has to be stored in exactly one place.
|
| You can make aliases/shortcuts to files on MacOS, can't you?
| prmoustache wrote:
| On pretty much any modern OS that uses a modern filesystem that
| is not exfat I believe.
| kccqzy wrote:
| Personally I used to use the saved search feature in macOS
| which is much more convenient than aliases or symlinks. You can
| specify what to search for and then save them. The files
| themselves can have arbitrary text based metadata just by
| writing Spotlight comments for the files. For example for
| screenshots, I write in the spotlight comments things like from
| which app I took the screenshot and why I took this screenshot
| ("funny" or "delightful UI") and then I have a saved search
| that only searches for PNG files in the Screenshots folder with
| keyword "funny" (you get the idea). The actual files are of
| course still organized in folders by year just like the author.
| G_o_D wrote:
| Been doing so since 15 years, i make portable html with embedded
| images, mp3 and much so that i dont need any special software for
| viewing, just carry it in cloud or my phone nowadays and you only
| need a browser on any device any os. With embedded mp3 in html,
| (yes size may grew large) l, but i dont need special music player
| software or app just browser,
|
| Nowadays along with html i try to archive using MHTML format
| instead of manually embedding
|
| Run a simple http server and start browsing archives
|
| FOR IMAGES I DO IS
|
| ---> Store all images in Folder
|
| ---> Open localhost server
|
| ---> Open folder in browser
|
| ---> Using javascript convert links to <img> tag with src=link
|
| --> Once browser fetches and displays all images Save as and i
| have embedded MHTML archive
|
| Or simple bash script can be used to create html with img tag and
| links to folder
|
| Or you can manuaaly template a MHTML
|
| BUT i let my browser do the heavy work why go manual,
|
| Also instead of BASE64 EMBED, EMDEDDING DIRECTLY BINARY IMAGES IN
| MHTML IS QUITE MORE EFFECTIVE AND LESS MEMORY CONSUMING
|
| Eg i have 15 images MHTML (binary encode) -> 4MB MHTML (BASE64
| ENCODE) -> 5MB
|
| Another method i use is, Run python -m http.server on any folder
|
| Or linux : tree -H http://localhost:8000 Set recursion depth
|
| Then open folder link from server or tree created HTML IN BROWSER
|
| in cmd execute wget -rkpN -e robots=off http://localhost:8000
|
| It will recreate folder with index.html for you to browse, you
| dont need server then for viewing
|
| Same as export from google or twitter or youtube
| corinroyal wrote:
| This excites me. Imagine someone not overcomplicating web tech.
| I've been thinking of having web sites render as epubs so we
| don't have to have a sysadmin on call 24/7 just so I can read.
| stared wrote:
| For personal use, I rely on Obsidian in a similar way--whenever I
| want to keep something (like an FB post I might want to share
| later), I save it along with the source link. External services
| can disappear anytime, so local data has the dual advantage of
| being owned by us and easily searchable.
|
| I also wrote a script to convert Kindle highlights into Markdown
| files. If anyone's interested, I'd be happy to polish it a bit
| and share.
|
| For public-facing content, the Static Site Generator ecosystem
| keeps improving. I started with Jekyll (since it's the GitHub
| default), moved through Gridsome, and eventually landed on Nuxt 3
| Content, which feels like the sweet spot for me. If I were
| starting now, I might have chosen Astro.
|
| In any case, the barrier to entry has never been lower. We can
| host sites for free on GitHub, and if custom styling is needed,
| AI models are incredibly helpful with CSS.
|
| Markdown is like JavaScript for text formatting. Despite its
| quirks, it just works.
| darylfritz wrote:
| I'm interested in your Kindle script. I'm curious about how you
| handle saving FB posts--do you just copy and paste the content,
| convert it to markdown, and store it in Obsidian? Would love to
| hear more about your process!
| stared wrote:
| Here is the script. You need to download "My Clippings.txt"
| from your Kindle device. https://gist.github.com/stared/ce732
| ef27d97d559b34d7e294481f...
|
| Regarding Facebook, I do it manually only for selected posts.
| I tried to do it otherwise, but Facebook exports don't have
| data about likes (it would be helpful to filter popular
| content) or comments (often more important than the original
| post itself).
| byteknight wrote:
| I forked an android app [1] to share articles to the app, which
| converts to markdown and then sends to obsidian. I also use a
| Firefox extension that uses Obsidian extensuion Advanced URI to
| send markdown versions of articles (with frontmatter!) to
| Obsidian[2]
|
| [1] https://github.com/IAmStoxe/obsidian-markdownr
|
| [2] https://addons.mozilla.org/en-
| US/firefox/addon/markdownload/ - Theres also a chrome extension
| input_sh wrote:
| FYI there's an official web clipper now:
| https://github.com/obsidianmd/obsidian-clipper
|
| Not considered stable just yet, but it works well-enough for
| me.
| mediumsmart wrote:
| thank you for posting, I have the same experiences looking for a
| good way to organize files etc - I tested this now and asked the
| oracle to write me a bash script that finds all images starting
| with Screenshot and list them in an html file that grids them at
| 200px width with click fill screen and second click dismiss. Such
| a good way to have an overview - going to implement that across
| the HD.
| chrisweekly wrote:
| Awesome post. I'm inspired to take a similar approach. Related
| tangent: https://sive.rs/ti
|
| is author/entrepreneur Derek Sivers' script for reproducing his
| bare-bones, low-overhead, long-term "Tech Independence" stack.
| meonkeys wrote:
| Lots of folks mentioning Markdown in the comments. +1 to that.
| Plain text FTW. I think a lot about my own data hoarding /
| archiving, and plain text is such a key part of that. Very
| future-proof.
|
| Ever since WordPerfect I've preferred more deterministic,
| lightly-formatted documents with some way to see formatting
| characters directly. Markdown is brilliant, basically a DSL
| (domain-specific language) for HTML.
|
| The key to plain text is tooling! A couple Markdown tools I
| haven't seen mentioned here yet (even though they've come up on
| HN before) are:
|
| https://addons.mozilla.org/en-US/firefox/addon/markdown-view... -
| pretty-render Markdown right in the browser
|
| https://casual-effects.com/markdeep/ - standalone web-friendly
| Markdown formatter with many features
| codazoda wrote:
| I use GitHub to host my markdown files. A bit more information
| is in this article I wrote about it. I actually have 4 or 5
| similar articles with various thoughts on this. I'm trying to
| find a way to make it simpler, maybe even for non-technical
| users, but I'm not there yet.
|
| https://joeldare.com/using-neat-css-on-github-pages
| itohihiyt wrote:
| Why not use a wiki? Zim desktop is text based local first. It
| doesn't handle videos but everything is handled. Search is good
| and you get the other benefits of a wiki. No mobile client, that
| I'm aware of.
| thenoblesunfish wrote:
| Glad to see my own instincts here. Filesystems, text files, plain
| HTML, fun, long-lasting.
| nyc111 wrote:
| I use org-mode export to HTML and then ftp that to the server. Is
| the OP doing the same without the org-mode?
| zirkuswurstikus wrote:
| Personally, I prefer VimWiki for taking notes during my work. So
| it is a place to mix ideas, small documentations and snippets of
| things I found on the web.
|
| Since I most of the time like to store articles, tutorial or
| nifty tricks, I like to store the entire website. For this task,
| my favorite Tool is SingleFile[1]. With SingleFile you can save a
| Website with embedded images. Also, you can add annotations, and
| cut away annoying Ads etc. Besides, it supports a distraction
| free copy of the website. I can highly recommend taking a look.
|
| [1]https://github.com/gildas-lormeau/SingleFile
| paravz wrote:
| SingleFile is fantastic, became part of my "standard" browser
| install, next to uBlock and Tree Style Tab
| miragecraft wrote:
| I'm doing the same except with the convenience of HTML includes.
|
| https://miragecraft.com/projects/x-include
| RadiozRadioz wrote:
| > folders require you to use hierarchical organisation
|
| I find symlinks work for this, which is what I do. I have big
| directories with the raw pictures dumped from my devices, then
| categorized directories linking to them.
| ericyd wrote:
| I always find posts like this fascinating. I love the direction
| of going low tech and maintainable, but I have never once found
| myself spending significant time looking through old work. Photos
| are the one exception but I've always been fine just scrolling
| through my personal timeline of date-sorted photos. I used to
| spend more time on this sort of thing when I was younger and then
| at some point I just realized I'm never actually looking at it.
| I'd be curious to know some of the reasons people are frequently
| revising work from years ago?
| smugglerFlynn wrote:
| Just thought it would be cool to have a personal "data lifeboat",
| similar to Twitter export, for exporting Instagram
___________________________________________________________________
(page generated 2024-10-18 23:00 UTC)