https://www.thingsaboutweb.dev RSS feed of things about web development https://www.thingsaboutweb.dev/en/posts/mcp-apps MCP Apps let MCP Servers embed interactive HTML UIs directly inside AI conversations. This post walks through the spec — three roles, lifecycle, two-way communication — using a Mermaid diagram renderer I built, plus the gotchas I hit along the way. Wed, 25 Mar 2026 00:00:00 GMT https://www.thingsaboutweb.dev/zh-TW/posts/mcp-apps MCP Apps 讓 MCP Server 可以在 AI 對話中嵌入互動式 HTML UI。這篇用自己做的 Mermaid 圖表渲染器走一遍規範的核心概念：三個角色、生命週期、雙向通訊，以及開發時踩到的坑。 Wed, 25 Mar 2026 00:00:00 GMT https://www.thingsaboutweb.dev/en/posts/temporal-api JavaScript's Date API has been broken for decades — mutation hidden inside helper functions, month arithmetic silently overflowing, date string parsing inconsistent across browsers. Temporal reached TC39 Stage 4 in March 2026 and is now part of ES2026, natively shipped in Chrome, Firefox, and Edge. Here are the concrete examples that show what finally changed. Sat, 14 Mar 2026 00:00:00 GMT https://www.thingsaboutweb.dev/zh-TW/posts/temporal-api JavaScript 的 Date API 已經 30 年了，但問題不少，因此有許多套件如 dayjs 或 moment.js。Temporal API 在 2026 年 3 月正式成為 ES2026 標準，原生內建在 Chrome、Firefox、Edge。幾個具體的範例，讓你直接在頁面上執行、對照。 Sat, 14 Mar 2026 00:00:00 GMT https://www.thingsaboutweb.dev/zh-TW/posts/plan-effectively 當 AI 讓寫程式不再是瓶頸，真正的挑戰變成了動手之前把問題跟解法想清楚的能力。這篇文章用 RADIO 框架拆解技術規劃的思考方式，讓你不管是自己寫、帶人寫、還是帶 AI 寫，都能更穩當地掌握開發方向。 Wed, 11 Mar 2026 00:00:00 GMT https://www.thingsaboutweb.dev/zh-TW/posts/drawing-the-invisible 世界很複雜，數位世界又因為非實體的本質多了另一層讓人不容易想像的維度，透過介紹『隱喻』這個方法，希望讓大家在理解與介紹概念時，可以多一個工具來使用，減低溝通以及學習的成本 Mon, 06 Jan 2025 00:00:00 GMT https://www.thingsaboutweb.dev/en/posts/code-review Code Review is essential for teamwork and growth, yet often feels slow and burdensome. How can we balance efficiency and quality to turn it into a team strength? Wed, 01 Jan 2025 00:00:00 GMT https://www.thingsaboutweb.dev/zh-TW/posts/code-review Code Review，不只是找 bug，而是促進團隊合作、分享知識與提升技術成長的關鍵過程。該如何兼顧效率與品質，讓審查成為團隊的助力，而非負擔？ Tue, 31 Dec 2024 00:00:00 GMT https://www.thingsaboutweb.dev/en/posts/nonce-and-csrf-token Explore the differences and use cases of Nonce and CSRF Token, explaining how these web security mechanisms prevent replay attacks and cross-site request forgery to enhance application security. Sat, 21 Dec 2024 00:00:00 GMT https://www.thingsaboutweb.dev/zh-TW/posts/nonce-and-csrf-token 了解 Nonce 和 CSRF Token 的差異與應用場景，解析這兩種網頁安全機制如何防止重複請求、重放攻擊與跨站請求偽造，確保應用程式的安全性。 Fri, 20 Dec 2024 00:00:00 GMT https://www.thingsaboutweb.dev/zh-TW/posts/the-70-percent-problem 「為什麼 AI 工具讓程式碼生成變得更快，卻無法讓軟體變得更好？看似強大的 AI 工具是否真的在提升軟體品質？快速的進步背後，可能隱藏著開發者需要正視的挑戰與真相。 Mon, 09 Dec 2024 00:00:00 GMT https://www.thingsaboutweb.dev/en/posts/naming-with-acronyms The challenges of naming, especially dealing acronyms. How will you name "xml http request", "new customer id", "supports IPv6 on iOS", "YouTube importer" in PascalCase / camelCase? Sat, 07 Dec 2024 00:00:00 GMT https://www.thingsaboutweb.dev/zh-TW/posts/naming-with-acronyms 在 PascalCase 或 camelCase 的規則下，你會如何命名 "xml http request", "new customer id", "supports IPv6 on iOS", "YouTube importer" ？ Sat, 07 Dec 2024 00:00:00 GMT https://www.thingsaboutweb.dev/en/posts/dark-mode-with-tailwind-v4-nextjs Dark mode support has become a fundamental aspect of modern web applications, and I recently tackled this feature for my personal blog using Tailwind CSS v4 beta with Next.js 15. In this article, I'll walk through my journey of implementing a dynamic theme toggle, share my learnings of both frameworks.' Sun, 01 Dec 2024 00:00:00 GMT https://www.thingsaboutweb.dev/zh-TW/posts/dark-mode-with-tailwind-v4-nextjs 最近使用了 Tailwind CSS v4 Beta 和 Next.js 15 為新的個人部落格實作了深色模式主題切換功能，覺得有蠻多有趣的東西，紀錄一下。 Sun, 01 Dec 2024 00:00:00 GMT https://www.thingsaboutweb.dev/en/posts/css-variables-part-2 Dark mode support has become a fundamental aspect of modern web applications, and I recently tackled this feature for my personal blog using Tailwind CSS v4 beta with Next.js 15. Fri, 15 Nov 2024 00:00:00 GMT https://www.thingsaboutweb.dev/zh-TW/posts/css-variables-part-2 解析 var() 細節、變數權重影響、空白預設值及無效值處理。搭配範例包括以 @property 定義動畫變數，和利用 CSS Space Toggle 技巧實現深淺色主題切換，展示 CSS 變數如何增強樣式控制的靈活性與應用範圍。 Fri, 15 Nov 2024 00:00:00 GMT https://www.thingsaboutweb.dev/en/posts/css-variables-part-1 In my exploration of CSS variables, I discovered a lot of exciting potential and subtle details that aren’t always apparent at first glance. Like many developers, I initially used CSS variables in simple, straightforward ways, rarely encountering edge cases. This approach is common and effective for many purposes, but it means theres a lot more to explore and experiment with. In my view, gaining a deeper understanding of CSS variable naming rules and valid value assignments can significantly expand the range and flexibility of their applications. Thu, 07 Nov 2024 00:00:00 GMT https://www.thingsaboutweb.dev/zh-TW/posts/css-variables-part-1 探究 CSS 變數的命名規則與賦值方法，包含如何正確設定自定義屬性名稱、避免常見解析錯誤，以及在不同情境下靈活使用 CSS 變數的實用技巧。 Thu, 07 Nov 2024 00:00:00 GMT https://www.thingsaboutweb.dev/en/posts/cache-freshness How do browsers determine whether to cache resources by default? What happens to our resources when cache settings are not manually configured? Sun, 29 Sep 2024 00:00:00 GMT https://www.thingsaboutweb.dev/zh-TW/posts/cache-freshness 瀏覽器預設是怎麼判斷資源是否要快取呢？當沒有手動設定快取資訊的時候瀏覽器會怎麼處理我們的資源？ Sun, 29 Sep 2024 00:00:00 GMT https://www.thingsaboutweb.dev/en/posts/flowchart-introduction Discover the basics of flowcharts with this guide! Learn about essential components, see practical examples like login and recruitment processes, and a library for Excalidraw. Perfect for visualizing processes and improving problem-solving efficiency. Mon, 10 Jun 2024 00:00:00 GMT https://www.thingsaboutweb.dev/zh-TW/posts/flowchart-introduction 流程圖是一種很萬用的圖解形式，透過幾個簡單的元素，描繪事情發生的先後順序，可能的分支等。讓讀者們聚焦在『這整件事情接下來會發生什麼，彼此之間的先後關係是什麼』上。 Mon, 10 Jun 2024 00:00:00 GMT