An opinionated approach to TiddlyWiki
TiddlyWiki (TW) has been coming up in the Matrix channel that hosts discussion for the Malleable Systems Collective. It was correctly observed that first-time user onboarding is... rough. It's easy for even professionally technical people to bounce off, having made configuration choices that don't match their goals, and to conclude that TW does not meet their needs. If they find solutions that make them happy, godspeed! But in an attempt to be helpful I'll lay out how I have mine set up. I should say that I use “note” and “tiddler” interchangeably because I hate “tiddler” as a term. Skim the headings and skip to Configuration if you don't care about the rationale.
Principles
First let me lay out the values that inform my choice of TW and my approach to its configuration.
Links
Interlinking is one of the most valuable things you can do to organize information. I compromise on my commitment-phobia for links. Links have this inconvenient need to know where they go, so you have to come down from your maximally-agnostic high horse and provide them some concrete indicators. That said, I refuse to think too hard here—Joplin, for instance, is a really lovely open source Evernote replacement that I was considering but discarded because of the internal link syntax. It looks like [Target note](:/6d55a1e4d87946099bb8aeb24f663f96)
, with one being dependent on the application to get the blobby note IDs. I want to be able to turn "Hang on to your youthful enthusiasms -- you’ll be able to use them better when you’re older." --Seneca
into something like"Hang on to your youthful [enthusiasms](#enthusiasm) -- you’ll be able to use them better [when you’re older](#aging)." --[Seneca](#seneca)
fluidly.
Backlinks
Everyone in this space seems to have fallen in love with Roam Research and their very, very impressive demos. The tl;dr: if I link from A to B when B doesn't exist and then navigate to B, B shows me the link context in A with a link back to A. If I add content to B, the link from A still displays below that content. The point of this is that it allows one to build up associations among topics, authors, etc. that are perusable. (Tags also function in this way, but tags are not central to my organization in the way that I center links)
Everything everywhere: browser access
I don't compromise on the portability the Google ecosystem can offer. I can log in from someone else's laptop and note down an address. I can write down an album recommendation from my phone typing with my thumbs. All my devices can access everything and I don't have to think about what's been left in what backpack.
Commitment-phobia
No new markup language: only Markdown
My life is lived in Markdown, for better or worse, at work and at play. Even Facebook Messenger supports a subset. I'm not memorizing anything else for my own notes when it's so helpful to have Markdown syntax in one's muscle memory.
No data lock-in: simple files
If I'm writing in Markdown, I should be storing in Markdown. An .md
file, or a folder of .md
files, feels timeless—or timeless enough to be translated to the next thing, at least. The underlying data is in this kind of storage—what lives on top is just a view layer.
Let there be pretty: customizable
My needs here are somewhat less demanding than I was of my middle school MySpace CSS, but I want plain Markdown files and I want cutesy background images and I get both. If I want to be persnickety about fonts, I can be to my own satisfaction. The view layer is usable by default but has enough knobs for visual tinkering.
Flat organization: no hierarchy
Hierarchies are so 2nd millennium. Links and tags ought to be enough. This verges dangerously on relating more to my philosophy of notetaking than my technical needs, but I want a tangle, not a tree, and my tools can't force the latter on me.
Bonus: offline function for alternate use
I know that I've said I want everything available everywhere—and that's true for the great bulk of what I do. But it's also valuable for me to be able to take notes on my work. I work at a big tech company. People throw enough three letter acronyms around internally that you could hit on real ones by sharpieing letters on some dice. I need to remember a lot of non-public information. It's not kosher to store that where it doesn't need to be—so if I can use the same kind of view layer locally to see Markdown files that never leave my work laptop, that's a great bonus.
Configuration
- Install the TW5 nodejs application
- Use the init command with the
server
option targeting the folder you want to hold your data - Run the server itself
- Navigate to the server in the browser.
- Drag the markdown plugin over to the tab serving your wiki Put the new markdown tiddler button where the old new tiddler button was.
- Install this
relink
plugin if you intend to use links much at all.
There. You now have a basic server that will autosave your changes as you edit to a bunch of markdown files in theFolderYouChose/tiddlers
. Here's documentation on how to use it.
Making it available everywhere is then a question of web hosting. I am not qualified to give advice on how to configure a reverse proxy and whatnot. There are also different auth solutions you will want to consider. The built in username / plaintext password is not ideal for long-term use, but will work for testing it out. Your reverse proxy can help here.
For a while, I had this running on an EC2 instance. If you do this, I recommend creating some kind of backup as well (push the directory to S3 every so often, rely on EBS snapshots if lazy and deep-pocketed, sync with git every so often, etc.). I now run it from a machine I have physical access to for recovery, but I should still probably have a better backup story. (We should all have a better backup story.)
Snazzier configuration
- If you use the “journal” feature for daily logs, it's possible to create a modified button that will open the journal of the day with the markdown format selected. (If you care about this but don't want to fuss with it yourself, DM me on Mastodon and I'll share the modifications necessary.)
Backlinks – install this context plugin and create a tiddler with the content:
<$list filter="[all[current]backlinks[]sort[title]]" emptyMessage=""> <$link to={{!!title}}><$view field="title"/>: </$link> <$context length=80 term=<<storyTiddler>> /> <br> </$list>
and tag it
$:/tags/ViewTemplate
. I use this footer along with a list of notes tagged with the title of the current note, but this is simple for you to try to see if you like this backlinks feature.Decoration – I'm not going to say it would be reasonable to do so, but if one wanted to have little images floating at the bottom of one's notes based on some tag, one could use a. the fact that every note gets the CSS class
.tc-tagged-{TAG}
for every tag, b. every note tagged$:/tags/Stylesheet
being included as CSS, c. the TW markup language to process transclusion before this CSS inclusion happens, and d. a cute image stored as base64 as a separate note. It might look something like this:
Drawbacks
Images
The native thing to do involves embedding the images, more or less, in the big blob of content that gets sent across the wire on first load. Base64 encoding is involved for whatever reason. There is lazy loading available that reduces the performance penalty, but I haven't tried it out (not sure how it will mix with my nginx auth_request
redirect setup). The whole thing makes me realize that I'm not sure I have a good story around saving images to be mixed with text content.
Plugin discovery
The TW plugin experience in the technical sense is stellar. If someone hosts their TW publicly and they have a plugin you like, you can click and drag it over to your TW and it Just Works™. Perhaps because of this easy p2p plugin sharing, however, there is very poor discoverability around the really great plugins out there. The whole community exists primarily in Google Groups, for God's sake.
Alternatives
Org-roam
If you're an emacs person, do check out org-roam.
David Gifford's TW adaptations
Someone who's twiddled with TW with the aim of producing UX somewhat like Roam without requiring user configuration to get there. His latest iteration is named Stroll. I don't care for it. That's because it's not a minimal plugin to TW focusing on specific functionality, but an attempt to develop an overall experience including multiple existing plugins to TW—and as the latter, it has all kinds of modifications to layout and such that I don't want to have to deal with in trying to hone in on my own preferences. I mention it because, as always, Your Mileage May Vary.