Skip to main content

3 posts tagged with "TiddlyWiki"

View All Tags

· 3 min read
Wei Ji

前情提要

  • 想對我那五花八門的 Side Project 們進行一點基本的專案管理,因此搜尋了幾個開源的 Kanban 軟體之後 fork 了 Planka,並把它改裝成以 SQLite 運作。

Kanban

我本來就想要使用 Tiddlywiki 作為 Side Project 資料的儲存形式,直接在裡面做專案管理豈不是錦上添花?在抱持著這樣的想法之下,稍微搜尋了一下。

DoolPlex/TiddlyKanban

只是非常陽春的「拖拉」功能實做,完全未達到實用的標準。在 Tiddlywiki 官方論壇內發現的。1

BTC/Muuri-Kanban

看起來很 Fancy,而且 Fancy 過頭了,加上對其他我不是很想要的插件有仰賴關係。

reidgould/Dropboard

不必要的功能太多了,而且 UI 不太對我的胃口。

Tekkan One

直接把整個 Tiddlywiki 變成 Kanban,wiki 的部份直接消失了。

Tekkan

雖然完成度不及 Tekkan One 那麼高,但是熟悉的 Trello 界面、單純的功能與 UI 加上 Wiki/Kanban 切換的設計是所有 Kanban 類插件中最令我滿意的。

問題

上面這些插件都有幾個共同的問題:

Card ID

Card (或是在 Jira 稱作 Ticket,GitHub 中稱為 Issue) 是 Kanban 上的小卡片,在 Jira 中會是一個類似 JIRA-123 之類由專案代碼和編號構成的唯一 ID;GitHub 中則是 issue 號碼,這些 ID 將會成為追蹤 Card 的識別依據。另一方面,Trello 比較不重視人類可讀,Card ID 由雪花 ID 表示。

而這些 Kanban 插件都是使用 Tiddler 來實做 Card,而 ID 理所當然的就是標題,在這樣的設計下無法達到「兩個 Kanban 有一樣名稱的 Card/Action Item」這樣的使用情境。

Tiddlywiki Macro

為了滿足這樣的使用情境,勢必需要對插件進行修改,但是這些插件主要是以 Tiddlywiki 特有的巨集 (Macro) 語法撰寫而成,學習成本對我而言是一件有點麻煩的事情,考量這是一個非常冷門且使用受限的語法,花時間在上面似乎不是這麼值得。

結論

就像我在前一篇說的:

讓我越陷越深的兔子洞

我的 Tiddlywiki 之旅並沒有到此為止。

Footnotes

  1. Three plugins available - Plugins - Talk TW. Retrieved 2024-04-04, from https://talk.tiddlywiki.org/t/three-plugins-available/1999

· 4 min read
Wei Ji

撰寫 Tiddlywiki 條目的預設語法是 Wikitext,這自然便成為我這個 Markdown 使用者在使用 Tiddlywiki 遇到的第一個問題。幸好這個問題可以透過安裝官方的 Markdown 插件解決。

安裝插件

在 Tiddlywiki 安裝插件的方式有兩種:

  • 網頁拖曳1
  • 檔案安裝2

網頁拖曳

大部分 Tiddlywiki 的插件都有自己的 Tiddlywiki,然後會有像是這樣的連結:

對它按下滑鼠,然後拖曳到自己的 Tiddlywiki 上放開,它會引導你匯入東西:

部份插件會要求重新載入網頁:


值得注意的是,這個魔法(我猜)是透過瀏覽器實做的 DataTransfer API 達成的,因此使用 Desktop 版本的 Tiddlywiki 或是其他跨越瀏覽器的情況(從 Chrome 把插件拉到 Firefox 上)是不支援的。

檔案安裝

只能在 Node.js 模式下使用,把插件複製到 /plugins 的資料夾下,像這樣:

├── plugins/
│ ├── relink/
│ │ ├── js/
│ │ ├── tiddlers/
│ │ └── plugin.info
│ └── relink-markdown/
│ ├── js/
│ ├── plugin.info
│ └── readme.tid
├── tiddlers/
└── tiddlywiki.info

插件系統

插件本質上是由一組名為「影子條目」的特殊的條目 (Tiddlers) 打包而成的。

影子條目 (ShadowTiddlers)

相較於一般的條目只是一些使用者可以任意編輯的資料,影子條目是一些跟 Tiddlywiki 核心運作有關的條目,比如:定義按鈕的外觀與行為。

當使用者編輯影子條目時,Tiddlywiki 會創建一個同名的副本,並且覆蓋原始條目的行為,當使用者刪除這個副本,則會切換回使用原本的影子條目,形同預設值一般的作用。

插件的型態

當使用「檔案安裝」時,插件是以類似專案資料夾的方式存在,並且以資料夾下的 plugin.info 檔案作為進入點,例如:

├── plugins/
├── relink/
├── js/
├── tiddlers/
└── plugin.info

而使用「網頁拖曳」時,插件中的數個影子條目會被打包成單一 JSON 檔的型態,例如:

├── tiddlers/
├── $__plugins_tiddlywiki_markdown.json
├── $__plugins_tiddlywiki_markdown.json.meta

幾個目前我正在使用的插件

Footnotes

  1. Manually installing a plugin. Retrieved 2024-02-25, from https://tiddlywiki.com/static/Manually%2520installing%2520a%2520plugin.html

  2. Installing custom plugins on Node.js. Retrieved 2024-02-25, from https://tiddlywiki.com/static/Installing%2520custom%2520plugins%2520on%2520Node.js.html

· 8 min read
Wei Ji

我從接觸 Tiddlywiki 到現在 (2023-10-29~2024-01-30) 也已經三個月了,雖然預計要做的事情還沒完成,不過想把累積的筆記做個階段性的總整理。

旅程的起點

目前我使用 Docusaurus 撰寫網誌並作為個人網站,但是用來表達我的 Side Project 仍然不夠合適,想來想去還是 wiki 的形式最符合我的需求,不久前跟人聊天的時候提到了 Wiki.js,於是我便朝這個方向去搜尋了。

接著我發現了 Tiddlywiki,當時正戴著耳機聽著戰鎚 40K 機械神教的 BGM ,當下我腦海中浮現了一個念頭:

Goddess of open source just kissed my forehead.

非線性

一個非線性的網頁式筆記 a non-linear personal web notebook

這是 Tiddlywiki 官方對自己簡介,不過「非線性」一詞其實非常抽象,不過我想它想要相對於「線性」概念應該是指線性敘事 (Linear narrative),換句話說 Tiddlywiki 指稱的非線性應該是指非線性敘事 (Nonlinear narrative);在紀錄或閱讀資料的時候能夠透過超連結在不同的條目之間穿梭瀏覽。相較之下一般的電子文件是由上而下(線性)閱讀的。

使用 Tiddlywiki

基本模式

一個"經典"的 Tiddlywiki 檔案會是一個單一的 HTML 檔案,一個 Wiki 的資料(條目、檔案...等)和 Tiddlywiki 的程式都被放在這個單一的 HTML 檔案裡面,使用者可以透過網頁瀏覽器開啟這個檔案使用 Tiddlywiki。

當使用者編輯內容,所有修改都會暫時存在瀏覽器的記憶體之中,直到使用者按下"儲存"紐,這時瀏覽器會下載一個新的 HTML,這個新的檔案是原本檔案的副本,但是包含了剛才修改的內容。

進階模式

在基本模式中,使用者必須反覆下載更新版來實現「存檔」功能,這是因為出於安全考量,一般情況下瀏覽器不具有任意讀寫硬碟上資料的權限。透過一些輔助工具可以提高 Tiddlywiki 的使用者體驗:

  • 應用程式
  • 瀏覽器插件

應用程式

TiddlyDesktop 或是 TidGi 等應用程式在執行 Tiddlywiki 的同時,允許使用者直接進行存檔(或自動存檔)而無須額外重複下載更新,有些應用程式甚至提供管理多個 Tiddlywiki 檔案的功能。

瀏覽器插件

Timimi 同樣可以允許使用者直接對 Tiddlywiki 進行存檔,只是不是以應用程式的方式實現,而是以瀏覽器插件的形式存在。

使用它需要完成兩個前置作業:

  • 下載並執行 "Timimi 程式"
  • 安裝 "Timimi 瀏覽器插件"

這個方案允許使用者使用自己熟悉的網頁瀏覽器編輯 Tiddlywiki,只是額外的步驟可能會讓人覺得不方便。

伺服器 (Node.js) 模式

Tiddlywiki 允許以 Node.js 執行,至於 Node.js 與 NPM (或其他套件管理工具) 的安裝與環境設定我就不在此多做解釋了。安裝 tiddlywiki 指令:

npm install -g tiddlywiki

新增一個 Tiddlywiki Node.js 專案:

tiddlywiki <Name> --init server

這個指令會初始化一個 Tiddlywiki 並設定一些在 Node.js 模式下需要的插件,諸如:tiddlywiki/tiddlywebtiddlywiki/filesystem

接著執行:

tiddlywiki <Name> --listen

再打開 http://127.0.0.1:8080 就能看到你的 Tiddlywiki 了!

與「基本模式」和「進階模式」不同是,新增的條目並不會被打包成單一 HTML,而是一個條目對應一(或兩個)檔案的方式儲存在資料夾中。


另外值得一提的是,tiddlywiki 不只能夠以 Node.js 啟動一個伺服器,還提供了一系列的 CLI 操作,比如:建構 (Build) 靜態版本、從 HTML 抽出指定條目...等。

$ tiddlywiki --help
usage: tiddlywiki [<wikifolder>] [--<command> [<args>...]...]
Available commands:

* build: Automatically run configured commands
* clearpassword: Clear a password for subsequent crypto operations
* commands: Run commands returned from a filter
* deletetiddlers: Deletes a group of tiddlers
* editions: Lists the available editions of TiddlyWiki
* fetch: Fetch tiddlers from wiki by URL
* help: Display help for TiddlyWiki commands
* import: Import tiddlers from a file
* init: Initialise a new wiki folder
* listen: Provides an HTTP server interface to TiddlyWiki
* load: Load tiddlers from a file
* makelibrary: Construct library plugin required by upgrade process
* output: Set the base output directory for subsequent commands
* password: Set a password for subsequent crypto operations
* render: Renders individual tiddlers to files
* rendertiddler: Render an individual tiddler as a specified ContentType
* rendertiddlers: Render tiddlers matching a filter to a specified ContentType
* save: Saves individual raw tiddlers to files
* savelibrarytiddlers:
* savetiddler: Saves a raw tiddler to a file
* savetiddlers: Saves a group of raw tiddlers to a directory
* savewikifolder: Saves a wiki to a new wiki folder
* server: Provides an HTTP server interface to TiddlyWiki (deprecated in favour of the new listen command)
* setfield: Prepares external tiddlers for use
* unpackplugin: Unpack the payload tiddlers from a plugin
* verbose: Triggers verbose output mode
* version: Displays the version number of TiddlyWiki

變體與其他衍生

基於 Tiddlywiki 的設計哲學,而造就了「基本模式」、「進階模式」或是「伺服器模式」這幾種不同的使用方式,不過其實它們都不太符合一般使用者使用軟體的習慣,因此有不少衍生專案正是為了改善它的使用體驗而存在的。這裡是一些我在爬文的過程發現的衍生型 Tiddlywiki1

補充說明

「基本模式」、「進階模式」或是「伺服器模式」是我為了方便解釋而使用的詞彙,並以單純使用者的角度去區分,實際上 Tiddlywiki 本身並不是以這樣的方式區分或是稱呼它們。

本文使用的「條目」同樣是為了方便解釋而沿用 Wikipedia 的使用習慣,實際上在 Tiddlywiki 中,條目被稱作 「Tiddler」。

Footnotes

  1. 知識連結的工具:TiddlyWiki. (n.d.). Retrieved 2024-01-30, from https://roulesophy.github.io/知識連結的工具-tiddlywiki/