Workflow · 交易工具

發布：2026-05-05 · 最後更新：2026-06-11

個人交易日誌 PWA:每天會打開的工具 不是另一個 Notion template

交易工具

一個交易者用過所有交易日誌工具 — Excel 卡卡、Notion 每次填都要點半天、TraderSync 一個月 NT$700。試過 5 個都撐不過 2 個月。最後自己做了一個 已經上線天天在用。重點從來不是「功能多」 是「每天都會打開」。下面講三個關鍵設計決策 + 我為什麼把「拜財神」也認真做進去。

卡點:沒有一個交易日誌我每天會打開

Excel 開起來慢 + 手機填很卡 + 跨裝置同步要自己搞。Notion 流暢但每次填都要選 dropdown / 多次 click — 紀律差的人會懶得填 填兩天就放棄。TraderSync 功能完整但月費對個人用戶有點貴 而且它的欄位不是我要的。試過 5 個工具都撐不過 2 個月 — 問題從來不在工具好不好 在「它不是為我這個人做的」。

設計決策 1:PWA 不是 native app(單一 HTML + Firebase)

整個 app 就是一個 HTML 檔 + Firebase(Google 登入 + Firestore 雲端同步 + Hosting)。為什麼是 PWA 不是上架的 native app?因為我不想花 100 鎂上 Apple Store、不想等審核、更不想為一個自用工具維護兩套 native code。PWA = 一個網頁加上 manifest + service worker 手機 Chrome / Safari 都能「加到主畫面」 開起來跟 app 一樣全螢幕。資料用 Firebase 同步 手機填、電腦看 都是同一份。

// PWA 三件套:讓一個網頁「裝到手機桌面」像 app 開 完全不用上架

// 1) manifest.json 關鍵欄位 — display:standalone = 全螢幕開 沒有網址列
//    { "name":"交易日誌", "display":"standalone",
//      "start_url":"/", "icons":[{ "src":"/icon-512.png","sizes":"512x512" }] }

// 2) 註冊 service worker(離線快取 + 讓「加到主畫面」可用)
if ("serviceWorker" in navigator) {
  navigator.serviceWorker.register("/sw.js");
}

// 3) HTML head 一行引用 manifest 手機就會跳「加到主畫面」:
//    link rel="manifest" href="/manifest.json"

設計決策 2:記「情緒」不只記盈虧

每筆交易除了標的 / 盈虧 我還記三件 Excel 不會逼我回顧的事:當下情緒、有沒有照策略、進場理由(可上傳圖表截圖)。然後統計頁用 Chart.js 畫「情緒 × 盈虧」— 一眼看出我在「FOMO」或「報復性」情緒下的單 虧最多。對交易者來說 真正會虧錢的不是技術 是心理 把情緒變成可統計的數據 才看得到自己的 pattern。風控設定還能設日 / 週上限 超過就跳警告。

為什麼把「祈福」做成打開的第一頁

app 打開的第一頁不是記帳 是「祈福」:財神爺 / 土地公真實照片可切換、三炷香煙霧動畫、點下去參拜、還能抽籤(6 種籤 均等機率 附交易建議)。我習慣盤前拜一下求平安(交易這幾年 開盤前的儀式感對心理穩定真的有幫助)。一般交易 SaaS 絕對不會做「拜財神」這種功能 — 但這正是「為自己做」跟「做給市場」的差別:它認真把我這個人的儀式 / 迷信 / 個人化 做進工具 而不是做一個誰都能用但誰都不貼身的東西。

踩過的雷:時區 + Safari 登入

(1) 日期一開始用 toISOString() 結果跨日的單(台灣半夜)會被記成前一天 — 改自己寫 localDateStr() 用本地時區才對。(2) Safari 因為 ITP(擋第三方 cookie)無法用 Google 彈窗登入 試很久才確定是瀏覽器層級擋的 沒辦法繞 只能在登入頁加提示引導用 Chrome。這兩個都是「本機測沒事 換環境就爆」的雷 — 自己做工具最花時間的往往是這種邊角。

整段複製給 AI agent，你就有這個 workflow

把下面整段複製貼給你的 AI agent(像 Claude Code),它就能照著幫你把這個「每天會打開的交易日誌 PWA」從零建起來,你不用自己摸技術細節。

我要你幫我做一個自己每天會打開的個人交易日誌,做成 PWA(網頁加到手機桌面像 app 開,我不要上架 App Store、不想等審核、也不想維護兩套原生程式碼)。請用這套組合:整個 app 就是一個單一 HTML 檔,搭配 Firebase 的 Google 登入、Firestore 雲端同步、Hosting,統計圖表用 Chart.js。資料同步路徑請用 users 底下接 uid 再接 trades 的結構,讓我手機填、電腦看都是同一份,並請用 Firebase 免費方案的設定。每筆交易除了標的跟盈虧,我還要記三件事:當下情緒、有沒有照策略、進場理由(理由要能上傳圖表截圖,但圖片不要存進 Firestore,請改用 Storage 或外部連結存檔)。統計頁用 Chart.js 畫勝率、盈虧比,還有最重要的情緒乘以盈虧的分析圖,讓我看出自己在哪種情緒下的單虧最多;再加一個風控設定,可以設每日跟每週虧損上限,超過就跳警告。app 打開的第一頁不是記帳,是一個祈福頁:財神爺跟土地公照片可切換、三炷香煙霧動畫、點下去參拜、還能抽籤(請做 6 種籤、均等機率,各附一句心態提醒,內容只談心態跟紀律,不要寫任何買賣方向或獲利結論)。PWA 的部分請把 manifest(display 設成 standalone 全螢幕)、service worker、加到主畫面三件套都做齊,iOS Safari 跟 Android Chrome 都要能裝。請務必避開我已知的三個坑:第一,日期不要用 toISOString(),它會把台灣半夜跨日的單記成前一天,請自己寫一個取本地時區日期的函式;第二,Safari 因為 ITP 會擋第三方 cookie,Google 彈窗登入會失效,這個沒辦法繞,請在登入頁加提示引導我改用 Chrome;第三,交易 ID 要考慮新舊格式比對相容,別讓舊資料讀不到。開始前請先確認我的環境(我是不是已有 Firebase 專案、Node 版本、要部署到哪),然後一步步建,每完成一塊就停下來跟我確認再繼續。

把上面整段複製貼給你的 agent 就好,它會先問你 Firebase 跟環境的細節再動手做,你只要回答、卡住時把畫面或錯誤訊息補給它就行。

完整 SOP 清單

上面把單一 HTML + Firebase 同步 + PWA 化 + 為什麼連拜財神都做進去 都寫出來了。這個工具已經上線、我自己天天在用 下面是完整元件對照:

• 單一 HTML 檔架構(為什麼不拆框架 + 怎麼維護)
• Firebase Google 登入 + Firestore 雲端同步(/users/{uid}/trades)免費 tier 設定
• PWA 三件套(manifest + service worker + 加到主畫面)iOS / Android 實裝
• Chart.js 統計:勝率 / 盈虧比 / 情緒×盈虧 / 策略分析圖表 code
• 風控設定(日 / 週上限)+ 本地時區修正(localDateStr 取代 toISOString)
• 祈福分頁:財神 / 土地公切換 + 三炷香動畫 + 抽籤 6 種籤實作
• 我撞過的雷:Safari ITP 登入 / 交易 ID 新舊格式比對 / 圖片不存 Firestore

看完這篇之前先確認:

名詞解釋

PWA（漸進式網頁應用）

讓網頁能「安裝」到手機桌面、像 App 一樣全螢幕開啟的技術，不用上架 App Store。

HTML

網頁的骨架語言，定義「這是標題、這是段落、這是圖片」。

Claude Code

Anthropic 推出的 AI 寫程式工具，裝在自己電腦的終端機裡，能直接讀寫你的檔案、跑指令，把你用中文描述的需求做成真的網站或工具。

部署（deploy）

把做好的網站或程式「推上線」讓所有人用得到的動作。

Vercel

把網站免費發佈到網路上的服務：接上 GitHub 後，每次推程式碼就自動更新網站，個人專案免費方案就夠用。

這篇是收斂後寫的版本。
我每兩週寄一封電子報，講「正在做但還沒寫成文章」的東西——
包含每月幫你過濾值得花時間的新 AI 工具，
以及 Lab 新文的個人版（你會比公開版早一週收到）。

→ 訂閱（雙週一封，第一封自動寄起步清單）

跳轉 Substack、隨時取消、不轉賣 email。

如果內容對你有用就太好了
隨喜斗內

相關 workflow

• Market Scanner:每天掃美 / 台 / 加密 / 期貨最強標的
• Voice profile 萃取 workflow

← 回 Workflows 總覽