Personal Websites
Planted 02022-03-11
Thoughts on my ideal personal website.
A heavy work in progress.
I enjoy the model of a personal OS. Currently, I think that includes collections of:
- Now (with CalendarEvents countdown)
- Writing/Essays
- Bookshelf (library)
- Bookmarks
- Notes
- Photos
- Recipes
- Timeline
- Habits (X-effect method)
These collections are somewhat derivative of social-media applications:
- Now (Calendar/Countdown)
- Writing (WordPress)
- Bookshelf (Goodreads)
- Bookmarks (Pocket)
- Notes (Twitter)
- Photos (Instagram)
- Recipes (All Recipes?)
- Timeline (iffy, but LinkedIn?)
- Habits (Todoist)
Personal websites today use three primary parts:
- Content
- Build
- Deploy
Content is handled through a CMS like Sanity, Strapi, Forestry, Netlify CMS, WordPress, or text files. Building the content is handled through a framework like Jekyll, Hugo, Next.js, or Remix. Deployment is handled through platforms like Netlify, Vercel, AWS, Cloudflare Pages, or Digital Ocean.
As of writing, the stack of this website is markdown files, Jekyll, and Cloudflare Pages.
I particularly enjoy having content as files; it feels natural and makes editing open to any application I choose. Jekyll is a tried-and-true static-site generator, but I don’t write or know much ruby. Deployment isn’t really an issue as static sites can be deployed anywhere.
Content is best stored as ingredients from which you can bake the things that you need when you need it. I want to keep content entirely separate from how it’s displayed, and text files feels like the best way to do that. Metadata can be stored with Front matter. Hugo Front matter formats: TOML, YAML, JSON, ORG.
The tossing-and-turning comes from wanting to manage my content:
- From a computer with local files using whatever tools I want
- From my iPhone
Wanting to be offline and local while also wanting to be online and networked.
Ideally, I can settle on text data formats that can be edited with no software and aided by software.
I think splitting between individual markdown files and some structured data format (e.g., JSON, YAML, etc.) makes sense—potentially using a database like SQLite for the structured data. The draw to file-based is based on not needing anything to edit on a laptop and kinda-just-works.
The collections, again:
- Now (structured)
- Writing (individual markdown files)
- Bookshelf (individual markdown files / structured)
- Bookmarks (structured)
- Notes (individual markdown files)
- Photos (individual image files)
- Recipes (individual markdown files / structured)
- Timeline (structured)
- Habits (structured)
Filtered for file-based:
- Writing
- Bookshelf?
- Photos
- Notes
- Recipes
Filtered for structured:
- Now
- Bookshelf?
- Bookmarks
- Timeline
- Habits
I’ve learned the terms for what I’m looking for are:
- local-first or offline-first
- client-side databases
- multi-master / master-master replication
A few solutions seem to be:
- AWS Amplify DataStore (offline-first)
- MongoDB Realm (offline-first)
- Google Firebase Cloud Firestore (meant for temporary offline)
- RxDB (which has an alternatives page)
- Replicache
Amazon S3 + Replicache + Cloudflare Workers seems to be an optimal solution but I have no idea.
A dumb solution could be the File System Access API (browser-fs-access) and:
- simply choose Dropbox or some other synced folder (Syncthing, Rclone, AWS S3 Sync)
- SQLite replication with RQLite or LiteSync, SQLite in a PWA
- Or maybe just Git database like Netlify CMS
Pipeline: Content → Build/script → Content → Deploy
Stack:
- Content: Markdown, JSON files (stored in Amazon S3? )
- Build: Ideally anything as content is structured and separate. Hakyll would be interesting to learn Haskell, Codedoc
- Deploy: Anything
I’m looking to be able to do three things:
- Create collections with individual formats, e.g., bookshelf, notes, writing.
- Create content for collections
- Build landing pages
- Create custom content block types (e.g., principles)
Editor (CMS):
- UTF-8 markdown
- Drag-n-drop in images with editing and requirement of alt-text and image file names
- Extensibility, e.g., add book by ISBN and auto-download image and information.
- Easy drawings with Excalidraw
- Real-time autosave
- Offline-support
- Ability to create new collections with their own format (like Sanity CMS)
- Accessible API
- Easy export (markdown files)