最新文章

專案裡常常需要一個「讀取中」或「訊息通知」的全螢幕遮罩，若在每個頁面各自刻一份很難維護。本篇整理如何用 Angular Material 的 MatDialog 統一實作 Loading 與 Message 遮罩，讓畫面在資料處理時能一致地阻擋誤操作。

當頁面有大量圖片時，一次全部載入會拖慢速度、浪費流量，尤其使用者根本不一定會捲到那麼下面。本篇整理 Angular 圖片延遲載入（Lazy Loading）的實作方式，讓圖片捲到可視範圍才載入，改善網頁效能。

文章頁常需要顯示多層級的目錄（父/子/孫），資料結構是巢狀的，畫面卻要攤平渲染，還要方便維護。本篇示範如何用 *ngFor 渲染巢狀目錄資料，並搭配子元件拆分，讓複雜的多層級選單好維護、好擴充。

把 API 請求邏輯搬進 Service，是讓 Component 專注畫面、程式碼更好維護的關鍵一步。本篇完整整理如何封裝 HttpClient 呼叫、設定 HttpHeaders，並用 RxJS 管線處理非同步資料流，寫出乾淨好測試的 Service。

Angular 內建 DatePipe、CurrencyPipe 等管線可以在畫面顯示時格式化資料，但遇到台灣常用的民國年日期格式呢？本篇教你自訂 Pipe，把西元日期轉換成民國年格式，並說明在樣板裡的使用方式。

把使用者輸入送往後端 API 前，該檢查哪些東西才不會出包？本篇整理常見的表單防呆邏輯，包含 null 值判斷與日期格式（如民國年 111/11/06）的合法性檢查，避免不合法輸入造成後端錯誤。

當專案裡有共用的元件、服務或 Pipe 想要重複利用，甚至發佈給其他專案使用時，就該考慮建立 Angular Library。本篇完整整理從建立、封裝到發佈到 npm 的流程，讓常用邏輯不用再到處複製貼上。

使用者用中文輸入法組字時，鍵盤事件的觸發時機跟英文輸入不一樣，很容易讓輸入驗證誤判。本篇整理常見輸入法事件（compositionstart/compositionend 等）的差異，並示範如何自製 Directive 正確處理中文輸入格式化。

當某些頁面需要登入或特定權限才能進入時，該怎麼保護路由？本篇整理 Angular Router Guard 的 CanActivate 用法，示範如何依使用者狀態決定是否允許進入頁面，是打造有權限控管網站的必備技巧。

Directive 是 Angular 用來擴充 HTML 標籤功能的工具，分為 Structural（如 *ngIf、*ngFor）與 Attribute（如 ngClass）兩類。本篇透過實戰範例，示範如何自製 Directive 處理 input 輸入格式化與事件監聽。

Angular Component 之間如何傳遞資料？本篇完整整理 @Input() 讓父元件把資料傳給子元件、@Output() 讓子元件透過 EventEmitter 通知父元件的用法與語法細節，是元件溝通最基礎也最重要的一組工具。

@HostListener 是 Angular 內建的裝飾器，功能類似 JavaScript 的 addEventListener()，能簡化元件內監聽 DOM 事件的寫法。本篇整理常見事件類型、參數用法與實戰範例，讓你在元件裡優雅地處理各種使用者互動。

在 Angular 專案中處理非同步資料（例如 API 請求）時，該用 Promise 的 .then() 還是 async/await？本篇整理兩種寫法的差異，並示範如何用 async/await 控制多個非同步請求的執行順序，讓程式邏輯更清晰易讀。

Django不只是網頁後端，在前後端分離的趨勢下，更需要一套好用的API方案。本篇詳細介紹Django最強大的套件Django REST Framework，從安裝、Serializer、ViewSet到路由設定，讓Django後端的API功能完整到位。

延續前篇對Django Admin資料呈現與篩選的介紹，本篇更進一步教你修改Admin後台的Html、CSS等檔案，包含插入自訂Logo、調整外觀樣式，讓後台介面能以你想要的樣子呈現，不再只是預設的陽春畫面。