我最近幫一位同事整理一個已經維護 7 年的 Angular 專案，結果發現一個前後端分離的專案，只有「後端」有設定 CI / CD，前端一直以來都是人工建置與部署。我在弄 CI / CD 的時候，發現了許多 npm 套件版本有依賴問題，為了能消除這些惱人的警告，花了我好幾個小時的時間才得到徹底的解決。我這次會遇到套件依賴問題，就是因為當初的開發人員搞不定，多年來一直都視而不見，依賴問題從來都沒有搞定過，每次換人維護都用 npm install --force 或 npm install --legacy-peer-deps 來解決問題，然後一代傳一代，變成祖傳的慣例，變成技術債。如果專案有個維護妥當的 package-lock.json 檔案，其實要還原套件不是什麼難事，今天這篇文章我就來深入探討這個問題。
... 繼續閱讀 ...
在我們公司所有的專案都在 Azure DevOps Services 上面管理，從專案管理、原始碼版控、CI/CD、文件管理、測試管理、專案報表等等，都在 Azure DevOps Services 上面，所以我們的團隊成員每天都會花很多時間在 Azure DevOps Services 上面協作。雖然 Azure DevOps Services 也提供了很多鍵盤快速鍵，讓使用者可以更快速的操作，但還是沒辦法滿足我們的需求，所以這個假日我就打算在寫一個 Side Project 擴充更多鍵盤快速鍵。原本以為一個小時內可以完成的，結果卻卡關在一個不起眼的功能上，那就是 DIV 元素無法被 focus 的問題，這會導致你將無法透過鍵盤的「空白鍵」來捲動頁面，我為了提升這個小小的 UX 問題，花了好幾個小時才找到答案，這篇文章就來跟大家分享一下我研究出來的解法。
... 繼續閱讀 ...
前幾天我透過 esbuild 解決了兩個小專案(side project)的 Bundling 問題，執行起來不但速度快，其上手的難度也比 webpack 還低，這篇文章將會介紹 esbuild 的基本使用方式。
... 繼續閱讀 ...
我在兩年前曾經寫過一篇如何快速建置一個 Node.js 專案並使用 TypeScript 與 VSCode 進行開發文章，由於現在的 Node.js 大多以 ESM 為主流，TypeScript 也更新到 5.x 版，而且當時的 TSLint 也都被換成 ESLint 為主了，所以這篇文章就來更新一下內容，幫助大家更方便、更快速的建立一個支援 TypeScript, ESLint, VSCode 與 ESM 並搭配 esbuild 的專案範本。
... 繼續閱讀 ...
我們現在經常在專案中大量的使用 Postman 進行 API 測試，不但 API 測試變的非常方便，搭配 Postbot 這套內建的 AI 助理，更能夠大幅提昇 API 測試的開發效率。這篇文章我就來分享幾個撰寫 API 測試的小技巧。
... 繼續閱讀 ...
要將 Node.js 網站部署到 Azure Web App (Windows) 其實有點竅門，一般不熟悉 Windows / IIS 的開發人員要想把手邊的 Node.js 部署到 Azure Web App 通常都會卡關卡好久。這篇文章我就來說說我是如何將我最近翻譯的提示工程指南網站部署到 Azure Web App 的，而這是一個用 Next.js 開發的網站！
... 繼續閱讀 ...
我們有時候會在一些網站看到「複製到剪貼簿」功能，它不但可以複製我們肉眼看見的文字，還能複製完整的格式讓你可以貼到 Teams 或 Word 之中，有時還能複製完全客製化的內容，其實這背後都是透過瀏覽器內建的 Clipboard API 達成的。今天這篇文章我就來梳理一下 Clipboard API 的一些用法與地雷。
... 繼續閱讀 ...
前端效能調校的技法多如牛毛，但最明顯的效能殺手不外乎是 JavaScript 佔用 Main Thread 而導致頁面無法回應的狀況了。最近研究 Partytown 這個函式庫，他用了一個非常巧妙的技巧，把部分 JS 自動切換到 Web Workers 背景執行。這篇文章我就來分享如何將 Partytown 安裝到任意網站中。
... 繼續閱讀 ...
我們有個大型的 Angular 專案，原本在 Azure Pipelines 的 CI 都很順利，但是一個月前開始變的不穩定，常常會掛掉，而掛掉的原因是「記憶體不足」造成的。本篇文章我打算分享本次問題的 Log 內容，並提供一個解決方法。
... 繼續閱讀 ...