傳說中的Web Forms：控件繁多，維護像在迷宮裡找出口

稍稍說明原系統開發架構，公司內部 8 年以上的系統大多前端使用 ASP.NET Web Forms，利用伺服器端控制項 (Server Controls)，像是 Button、GridView、TextBox 等。開發者透過拖拉控件建立介面，發出請求時，整個頁面重新載入，或部分使用 PostBack (傳統的頁面重整)。後端則是使用 VB.NET 撰寫 Web Forms 的後端邏輯，例如用戶點擊按鈕，觸發 Button_Click 方法。資料存取則是使用 SqlConnection 建立與 SQL Server 的連線，部分會使用資料綁定，透過 GridView.DataSource 將資料綁定到表格控件。

傳統的 .NET Web Forms 架構，雖然在早期開發效率高、初期對開發者友善，但長期下來會有維護上的困難。局部更新的限制與架構難以模組化等缺點不談，光是控件狀態掌控上，就常常一個拖曳動作，或是調整控制項設定與原理，開發者其實不容易察覺開發過程中到底更動了哪些設計。如果再加上有開發時程壓力，開發者更容易追求能動就好，而不理解各控制項背後的邏輯原意。

新的開發者很難快速理解控制底層細節，接手的工程師常常需要花費大量時間破解原有的布局和邏輯。資料流、事件觸發點、控件狀態都可能成為難以掌握的「盲點」，若沒有完整的文件或註解，遺留技術與設計思路便成為黑洞。

自己便是由 C# MVC 架構回頭去接手 Web Forms 系統的苦主之一，沒有 Controller 作為統一入口來了解功能整體作業流程，已先讓門檻往上疊加；更別說調整介面時，無法透過實際 HTML 或 Razor Page 來輕鬆插入資料、實現條件與循環顯示介面。前端無法細緻調整、可控度不高。記得有一次我僅是增加個欄位，並且調整介面排版、文字大小等等，在無意識的拖拉與調整控制項參數之間，HTML 已經默默幫我長出近 10 個 class。當然我可以視而不見，反正最終是長成我想要的樣子了，但之後接手的開發者呢？
這還是前端顯而易見的排版，後端 GridView 可無法這麼單純。實現細節封裝得太深，開發者很難理解其內部實作原理。這也是技術框架長期累積下來，造成技術債的原因之一。

從C# MVC到ASP.NET Core：提升UIUX與微服務轉型之路

那麼我自己擅長的 C# MVC 架構呢？拿它來翻修，最適合不過了吧，但仍然有個致命缺點剛好與我們本次目標有所矛盾【大幅提升 UIUX 的好感度】想做高度互動的單頁應用（SPA），MVC 本身支援有限，傳統 MVC 通常不能純粹局部更新頁面內容，除非引入 AJAX，自己在頁面中寫大量 JavaScript 來處理部分刷新，前端邏輯更複雜，增加維護難度。那麼引入前端框架呢？C# MVC API + 前端框架？
基於本公司未來仍不排除有跨平台的規劃，後端勢必需要可微服務友善，才方便日後轉型，因此後端幾乎毫無懸念以 ASP.NET Core 作為開發語言。以下為請教 GPT 進行的分析與比較：

GPT 的分析中不難看出，我們其實有些自找苦吃，開發成本較高，學習曲線較陡，且部門內除了一名同仁有開發經驗外，其他的成員於 .NET Core 著墨明顯較少。是靜茹給了我們勇氣了嗎？不！是紅紅火火的生成式 AI 真的給足了很多開發者可以再度跨領域進行開發技術轉型的底氣。我相信已經很多開發者藉由 AI 進行程式碼解 Bug或直接介入修改，工程師dk可以直接跟 AI 進行各種免項的互動與討論更容易打造出最佳實作。

不過我們目標並不是要仰賴 AI 自動化生成一整套系統，反倒是希望可以透過 AI 的輔助，協助降低學習的門檻，運用與 AI 協作配合內部環境，根據團隊風格和歷史代碼習慣，調整生成方案。針對日後的維運開發者或是維護者，仍然需要理解底層邏輯，才能夠在危急時刻了解該怎麼找出解決方式。

此外，成員大部分都有過 C# 開發經驗，因此即便轉為 ASP.NET Core，仍以 C# 為基礎，依舊有一定的熟悉程度，也是我們選擇該選項的原因。至於前端的架構，我們選擇了 Vue，原因是看中低門檻，加上本次翻修案規模偏中小型，再來是前一次翻修委外專案也是採用 Vue，對部分成員來說會有些基本的熟悉度，便選定了 vue 作為前端的框架。

彙整以下前端框架的搭配與優點分析，進行技術選定時可以有個參考：

• React + .NET Core API： 適合高互動、需彈性，可搭配各種前端資源。
• Vue + .NET Core API： 低門檻、快速上手，中小型項目較適合。
• Angular + .NET Core API： 企業級大型系統，規範較多但穩定成熟。

Ending Remarks

從 Web Forms 的拖拉式開發，到 MVC 的結構化嘗試，再到 .NET Core 搭配前端框架的現代化架構，其實反映的不只是技術更迭，更是開發團隊對「維護性、可擴展性、使用者體驗」的逐步追求。這條路或許代價不低、學習曲線不淺，但透過 AI 的輔助與團隊經驗的累積，讓我們有機會在翻修的過程中，不只是把系統換個外皮，而是真正完成一次開發思維與技術模式的轉型。