iT邦幫忙

前端工程相關文章
共有 26 則文章
鐵人賽 Modern Web DAY 25

技術 Day 25|有一個欄位名拼錯了,而我們決定不改

模組五|重構期的品質與節奏(Day 22–26) 新系統的請求層有這麼一行: const { code, data, msg, sucess, total...

鐵人賽 Modern Web DAY 24

技術 Day 24|最好的一次重構,刪掉的是新增的十四倍

模組五|重構期的品質與節奏(Day 22–26) 我把新專案裡「刪除行數遠大於新增行數」的改動排出來(已濾掉自動產生的檔案): 新增 刪除 內容...

鐵人賽 Modern Web DAY 23

技術 Day 23|將近一半的改動是在修 bug,而我認為這是好消息

模組五|重構期的品質與節奏(Day 22–26) 我在一個團隊裡,把兩套活了六年的 Vue 2 後台管理系統升級到 Vue 3:一套給內部營運用(下面叫專案...

鐵人賽 Modern Web DAY 22

技術 Day 22|語系從 4 個變成 11 個,維護成本反而下降了

模組五|重構期的品質與節奏(Day 22–26) 我在一個團隊裡,把一套後台管理系統從 Vue 2 升級到 Vue 3:舊系統當時還在線上服務使用者,新系統...

鐵人賽 Modern Web DAY 21

技術 Day 21|一個叫「表單項」的 hook,寫完之後零次使用

模組四|核心系統改寫(Day 17–21) 先給三個數字: 舊系統的表單項標籤:2,435 次 新系統的表單項標籤:2,842 次 新系統業務頁面用 sc...

鐵人賽 Modern Web DAY 20

技術 Day 20|框架送你一台咖啡機,團隊自己買了三個濾杯

模組四|核心系統改寫(Day 17–21) Day 9 我丟過一個數字:框架附了一整套表格機制(用一份設定物件描述整張表格,也就是 schema 化那一套)...

鐵人賽 Modern Web DAY 19

技術 Day 19|一個 182 行的檔案,決定了全站每一次請求的命運

模組四|核心系統改寫(Day 17–21) 舊系統的請求封裝是一個檔案、182 行、兩個攔截器、16 個 if 分支。 它負責的事情包括:帶 token、設...

鐵人賽 Modern Web DAY 18

技術 Day 18|同一件事有兩套做法,比沒做還貴

模組四|核心系統改寫(Day 17–21) 這篇的主軸,是被我自己的實測推翻的。 我原本要寫的是「權限從路由級長到按鈕級」:舊系統只能控制「你能不能進這一頁...

鐵人賽 Modern Web DAY 17

技術 Day 17|重寫完,路由的程式碼從 328 行變成 704 行

模組四|核心系統改寫(Day 17–21) 先給一個看起來很糟的數字。 舊系統負責「路由與選單」的程式碼,散在四個檔案裡,合計 328 行。新系統重寫之後,...

鐵人賽 Modern Web DAY 16

技術 Day 16|每 100 個測試站抓到的問題,有 1 到 2 個會溜到正式環境

模組三|遷移執行法與驗收(Day 12–16) 我們團隊修 bug 的時候,commit 訊息會標一個階段標籤:這個問題是在哪一關被抓到的。 六年下來,這變...

鐵人賽 Modern Web DAY 15

技術 Day 15|566 個 API,17 種命名方式,而我忍住沒有邊搬邊改

模組三|遷移執行法與驗收(Day 12–16) 我數了舊系統的 API 定義:566 個。 然後我數了它們的命名前綴:17 種。 光是「查詢」這一件事,就有...

鐵人賽 Modern Web DAY 14

技術 Day 14|遷移最爽的一刻,是確認某個模組不用搬

模組三|遷移執行法與驗收(Day 12–16) 有一組數字我每次看都覺得很療癒:其中一套系統的統計模組,從 52 個頁面變成 24 個。 不是因為砍功能,是...

鐵人賽 Modern Web DAY 13

技術 Day 13|共存期間,舊系統的開發量比新系統還多

模組三|遷移執行法與驗收(Day 12–16) 重構最貴的一段,不是寫新系統,是新舊兩套同時活著的那段日子。我們的共存期超過一年。 而共存期間有一個月,我攤...

鐵人賽 Modern Web DAY 12

技術 Day 12|同一個團隊做兩次遷移,第二次用了完全相反的策略

模組三|遷移執行法與驗收(Day 12–16) 一百個頁面要搬,第一個搬哪個? 我們做了兩次。而把兩次的第一天並排放在一起看的時候,我發現一件很有意思的事:...

鐵人賽 Modern Web DAY 11

技術 Day 11|建置設定裡那個沒人敢關的開關

模組二|選型、語言遷移與地基(Day 6–11) 模組二的最後一天,講建置。 先看舊專案的建置指令,一字不差: vue-cli-service test:u...

鐵人賽 Modern Web DAY 10

技術 Day 10|`"strict": false, // 啟用嚴格模式`

模組二|選型、語言遷移與地基(Day 6–11) 標題不是我打錯。這是我在新專案的 TypeScript 設定檔裡看到的一行,一字不差: { &quot...

鐵人賽 Modern Web DAY 9

技術 Day 9|換掉 UI 元件庫:8,023 個標籤,和一個我沒預料到的結果

模組二|選型、語言遷移與地基(Day 6–11) 這個專案是一個活了六年的 Vue 2 後台,我花了兩年把它升到 Vue 3。升級的時候 UI 元件庫也得換...

鐵人賽 Modern Web DAY 8

技術 Day 8|Vuex 裡有六個從沒打開過的空模組

模組二|選型、語言遷移與地基(Day 6–11) 這個專案是一個活了六年的 Vue 2 後台,我花了兩年把它升到 Vue 3。升級的時候,有三件事是被迫一起...

鐵人賽 Modern Web DAY 7

技術 Day 7|一個檔名拼錯六年的 mixin,和 `this` 消失的意義

模組二|選型、語言遷移與地基(Day 6–11) 舊專案裡有一個 14 行的檔案,我第一次打開它的時候看了三分鐘,然後決定把它寫成一整篇。 它同時示範了三個...

鐵人賽 Modern Web DAY 6

技術 Day 6|官方要 monorepo,我們把 93% 的程式碼留在根目錄

模組二|選型、語言遷移與地基(Day 6–11) 官方文件說主應用要放在 apps/ 底下。我們的主應用有 829 個檔案,全部待在根目錄的 src/。 這...

鐵人賽 Modern Web DAY 5

技術 Day 5|「重構要多久?」這個問題有兩個相差三倍的答案

模組一|現況盤點與立案(Day 1–5) 模組一的最後一天,來談那個一定會被問的問題。 我沒有參與當初的排程討論,所以不知道對外報了多久。 但有件事很有意思...

鐵人賽 Modern Web DAY 4

技術 Day 4|`this.baseUrl` 從哪來?全域魔法與那些沒人敢刪的東西

模組一|現況盤點與立案(Day 1–5) 昨天講的是看得見的重複:兩個 repo 裡 20 個一模一樣的檔案。今天講看不見的那種。 先給你一個謎題。假設你剛...

鐵人賽 Modern Web DAY 3

技術 Day 3|兩套系統,20 個一模一樣的檔案,和幾個正在長歪的

模組一|現況盤點與立案(Day 1–5) 我手上有兩套後台管理系統:一套給內部營運用,一套給外部合作方用。它們原本是同一份程式碼——當年為了趕時間,有人把第...

鐵人賽 Modern Web DAY 2

技術 Day 2|先量體重再談減肥:把「這 code 很爛」翻譯成一份清單

模組一|現況盤點與立案(Day 1–5) 昨天說我接手後的第一件事不是寫程式,是盤點。今天把方法攤開。 「我覺得這 code 很爛」是一句沒有殺傷力的話。...

鐵人賽 Modern Web DAY 1

技術 Day 1|342 個元件、1 個測試檔:一個活了六年的 Vue 2 後台

模組一|現況盤點與立案(Day 1–5) 先給你三個數字,全部是我自己跑指令量出來的: 342 個 Vue 元件,總共 103,870 行。全庫測試檔數量...

技術 從 Vibe Coding 到 Agentic Engineering:2026 年前端開發者的專業升級路徑

我這幾個月最常看到的誤解,是把 Vibe Coding 當成一種完整的方法論。好像 prompt 寫得夠順,AI 就會把專案自然推到正確方向。這套想像在 dem...