最近我在研究 Chrome DevTools MCP 時，遇到一個讓我困惑的問題：明明在 chrome://inspect/#remote-debugging 啟用了 Remote Debugging，也看到 Server running at: 127.0.0.1:9222，但 curl http://127.0.0.1:9222/json/version 卻回傳 HTTP 404 Not Found。深入研究後才發現，這其實是兩種不同的「連線建立方式」——以下就是完整的來龍去脈。
... 繼續閱讀 ...
我現在維護著幾套不同的 Chrome 擴充套件，每次發佈新版本時都需要手動上傳更新，覺得有點麻煩，所以我這幾天研究了一下 Chrome Web Store Publish API 並設定了 GitHub Actions 來自動化發佈 Release 與 Chrome Extension，真的方便太多了。這篇文章我就來說說這個設定的過程。
... 繼續閱讀 ...
我最近都在準備 實戰 E2E 測試：使用 Playwright 測試框架 課程，也為這堂課特別精心翻譯了整個 playwright.dev 網站，甚至還買了一個 playwright.tw 域名，並把翻譯好的網站部署到 GitHub Pages 上面。GitHub Pages 是 GitHub 提供的免費靜態網頁服務，使用者可以透過 GitHub Pages 建立個人網站、部落格、文件網站等。今天這篇文章我將介紹如何在 GitHub Pages 設定自訂域名與啟用免費的 TLS 憑證。
... 繼續閱讀 ...
我們在 Angular 官網的 Version compatibility 頁面可以看到不同版本的 Angular 其實有匹配的 Node.js 版本，太新的 Node.js 不能用，太舊也不能用。不過，我們通常在開發 Angular 一段時間後，多少都會面臨到需要維護不同專案採用不同 Angular 版本的狀況，這時候你就會需要管理多個不同版本的 Node.js 執行環境，這時候就可以考慮使用 NVM 來管理多個不同的 Node.js 版本。
... 繼續閱讀 ...
我有個客戶的網站最近剛上線，在設定 CSP (Content Security Policy) 標頭的時候，因為我設定了 unsafe-inline 的關係，所以導致 Google Analytics (GA) 的程式無法執行，但 GA 網站提供的程式碼就是用 Inline Script (內嵌腳本) 怎麼辦呢？這篇文章我就來告訴你解決方案。
... 繼續閱讀 ...
要製作一個好網站，除了要有好的內容外，也要有好的分享功能，讓使用者可以輕鬆地分享網站的內容到各社群媒體上，而這些社群媒體除了擁抱開放標準的 Open Graph protocol 外，其各自也有自己的 Meta Tags 定義，這篇文章我就來介紹一下有哪些是 Web 開發人員需要知道的。
... 繼續閱讀 ...
最近一直在弄客戶網站上線前的準備事項，我們在進行前端效能調校時，當然不免俗的要用 Lighthouse (GitHub) 跑一遍，結果發現除了效能殺手 Google Fonts 無解外，另一個主要的效能殺手就是沒有經過優化的圖片，畢竟圖片都是從後台上稿的，如果沒有好好的處理，是有可能會影響到用戶體驗的。今天我就來介紹一套我用很久的 Squoosh.app 網站與 Squoosh CLI 命令列工具。
... 繼續閱讀 ...
我們現在經常在專案中大量的使用 Postman 進行 API 測試，不但 API 測試變的非常方便，搭配 Postbot 這套內建的 AI 助理，更能夠大幅提昇 API 測試的開發效率。這篇文章我就來分享幾個撰寫 API 測試的小技巧。
... 繼續閱讀 ...
老牌的無障礙網頁檢測工具 Freego 歷經多次改版，它的 UX 依然是完全沒有任何改進，認真覺得難用難上手。今天這篇文章我就來說明如何安裝，因為你連要無腦的順利跑起來都有點難度。
... 繼續閱讀 ...