Front-End Developer & Effective Note-Taking
一個專注於網頁應用的軟體工程師,並對手帳術與時間管理有深入的研究。
網站開發 & 網站設計

Youtube 前端開發、知識管理、筆記軟體 Happy Coding!
Youtube 知識小白的內化之旅與深度閱讀 Happy Learning!
Podcast SoundOn, Apple, Spotify, KKBOX
Social Media
Web Development


技術文章研究
分享前端框架 / 設計技巧 / AI 應用,打造更棒的使用者體驗。
HTML / CSS 47 Posts JavaScript 21 Posts React 14 Posts Vue 39 Posts WordPress 19 Posts 工具與觀念 29 Posts


HTML 標籤 details, summary 介紹與實作手風琴的圖片展示功能
2025-01-22 2 Min Read
CSS 樣式分享
HTML 標籤shallowRef() 和 ref() 的差別?shallowRef 真的能讓效能變好嗎?
2025-02-18 2 Min Read
元件開發與實作
動態渲染 Vue 元件以及動態導入模組,簡化重複邏輯
2025-01-03 2 Min Read
JavaScript 實作
JavaScript 觀念如何優化 React 元件的渲染效能,並避免渲染陷阱
2025-03-19 3 Min Read
數位筆記生活


React Hook
Planner規劃工具提供實用的工具和技巧,來安排日常任務與長期計畫,達成理想的生活與工作平衡。
使用的筆記軟體:Tana / Milanote / Craft
數位筆記生活 37 Posts 手帳寫真 28 Posts


如何修改 Tana 節點(Node) 前的圖示
2025-02-26 1 Min Read
Tana 小技巧
用 Zapier 自動將訂閱的文章摘要後,發布到 Obsidian
2024-08-22 3 Min Read
Tana 串接 Raycast
幫你的待辦事項加上撒花效果
2025-02-27 1 Min Read
Tana Command
如何在 Tana 側邊欄增加提高生產力的小工具
2024-11-06 2 Min Read
數位筆記寫作是一場馬拉松,需要熱情、毅力,還有……珍奶!

如果我的文章曾經啟發你,或讓你在某個時刻解決了難題,那麼,也許你願意成為這場旅程的夥伴?
每一杯珍奶,都是我繼續寫作的燃料,每一筆贊助,都是讓這個世界多一點好文的神助攻!
Buy Me a Boba


《第五項修練》微小改變如何帶來巨大成果 — 彼得·聖吉的學習型組織之旅
2025-03-31 17 Min Read
今天我們要深入探討彼得·聖吉的經典著作《第五項修練》,這本書自 1990 年出版至今,持續影響著全球的組織和領導者。在這個變化越來越快的時代,聖吉提出的「學習型組織」理念變得比以往任何時候都更加重要...
使用 Zapier MCP 串接 Cursor,輕鬆打造智慧助理,幫你快速整理 Gmail 信件並生成精準摘要
2025-03-27 2 Min Read
是的,厲害的王者 Zapier 也加入這場戰鬥了,Zapier 直接推出了自家的 MCP 服務,提供高達上千的 APP 與之互動! 對習慣使用如 Zapier, n8n 自動化的朋友來說,好處是我們不用再去拉線,也不用再把資料串來串去啦!...
AI 應用
AI 自動化MCP
打造高效的 PR 工作流:自動發 PR 並用 AI 產生完整的 PR 摘要與內容翻譯
2025-03-25 18 Min Read
如果你長時間有追蹤我的部落格,應該知道我很愛搞 Git 的一些自動化,透過之前寫過的文章,應該能了解我極度懶惰這件事: 前陣子因爲串接了 Gemini Code Assist,可以自動在發 PR 時幫我 Code Review,且可以一鍵整合到...
AI 自動化
GitGitHub
如何優化 React 元件的渲染效能,並避免渲染陷阱
2025-03-19 3 Min Read
在開發過程中,元件的渲染效能是一個前端開發者必須面對的挑戰。或許開始接觸程式開發時,我們不太重視這一點,認為只要功能能正常運作就足夠。然而,隨著我們的工作時間增加、經驗累積,專案變得愈加複雜,頁面的載入速度和渲染效率便變得尤為重要...
React Hook
用 Figma MCP Server 讓 AI 自動設計 UI,設計師的夢想成真了
2025-03-18 4 Min Read
小時候工作的夢想,就是希望能出一張嘴寫程式,這個夢想因為 AI 的問世得以實現。長大後,也希望可以出一張嘴做設計 XXD,尤其是要能應付業主的:「這邊大一點、那邊高一點,我要簡單又華麗的效果…」等一堆令人無語的需求。 現在,透過 MCP...
AI 應用
AI 自動化MCP
認識 History API:SPA 的關鍵技術之一
2025-03-17 3 Min Read
在現代前端開發中,單頁應用 (Single Page Application, SPA) 因其流暢的使用體驗而廣受歡迎。實現這種體驗的關鍵技術之一便是 History API。它允許開發者在不重整頁面的情況下更新瀏覽器...
JavaScript 實作
JavaScript 觀念Web API
Under Construction New! Generate your own 90s page here! Under Construction