Desarrollo Web
Guías y proyectos de HTML5, React, Angular, Next.js, Vite y desarrollo frontend moderno.
Lesson 06：事件處理 (Event Handling)
React 使用合成事件 (Synthetic Events)，提供跨瀏覽器一致的事件 API。
Leer artículo →Lesson 07：條件渲染 (Conditional Rendering)
根據不同的狀態或條件，顯示不同的 UI。
Leer artículo →Lesson 08：列表與鍵值 (Lists & Keys)
使用 JavaScript 的 map() 方法將陣列資料轉換為 JSX 元素。
Leer artículo →Lesson 10：useEffect 與副作用
副作用是指在渲染過程之外發生的操作，例如：
Leer artículo →Lesson 11：useRef
useRef 回傳一個可變的 ref 物件，其 .current 屬性在整個元件生命週期中保持不變。
Leer artículo →Lesson 12：useContext 與 Context API
當深層巢狀的元件需要上層的資料時，一層一層傳 props 非常冗餘：
Leer artículo →React Router 專案說明
此專案需要安裝 react-router-dom：
Leer artículo →Lesson 16：效能優化
重點：父元件重新渲染時，所有子元件也會重新渲染，即使它們的 props 沒有改變。
Leer artículo →Lesson 17：錯誤邊界 (Error Boundaries)
錯誤邊界是一種 React 元件，可以捕獲子元件樹中的 JavaScript 錯誤，顯示降級 UI，而不是讓整個應用崩潰。
Leer artículo →Redux Toolkit 專案說明
此專案需要安裝 Redux Toolkit 和 React-Redux：
Leer artículo →Lesson 20：進階設計模式
HOC 是一個函式，接收一個元件並回傳一個增強後的新元件。
Leer artículo →Lesson 21：測試與最佳實踐
[ ] 元件是否遵守單一職責？ [ ] State 是否放在最近的共同父元件？ [ ] 是否有可以提取的自訂 Hook？ [ ] key 是否使用了唯一且穩定的值？ [ ] useEffect 的依賴陣列是否完整？ [ ] useEffect 是否有必要的清除函式？ [ ] 是否避免了在渲染中直接產生副作用？ [ ] 錯誤處理是否完善？ [ ] 是否有適當的載入狀態？
Leer artículo →怎麼讀這本手冊
你如果寫過 ASP.NET Web Forms，會覺得名詞很熟：頁面、回傳、控制項、Code-Behind。熟的是感覺，不是實作。WebForms Core 沒有 ViewState，也不把整頁重新畫出來。伺服器只回一小段文字，告訴瀏覽器「把這個標籤的字改掉、把那個按鈕關掉」。
Leer artículo →三個容易搜到的名字
搜尋「WebForm Core .NET」會同時掉進三個專案。它們都提到 Web Forms，也都跑在新的 .NET 上，解決的問題卻不一樣。先把地圖畫出來，後面才不會把 A 的安裝步驟套到 B 的頁面上。
Leer artículo →舊版 Web Forms 留下的直覺
WebForms Core 的命名是故意的。CodeBehind 的介紹寫著，結構和命名會讓人想起以前的 Microsoft Web Forms。官方教學的結論也說，功能感覺相近，實作是另一套更有彈性的做法。要學會新的那套，得先知道舊的直覺從哪裡來，又是哪裡斷掉。
Leer artículo →一條請求長什麼樣子
WebFormsJS 做三件事。第一，送出時把表單序列化：一般表單用查詢字串形式，multipart 表單用 FormData。第二，看回應正文是不是 Action Control；是就執行，不是就把正文當成 AJAX 結果放進頁面（預設可放進一個 div，見 PostBackOptions.SetResponseInsideDivTag）。第三，在第一次整頁輸出時，若伺服器把指令放在 <web-forms ac="...">，它也會執
Leer artículo →把第一個專案跑起來
這一章只建立宿主，還不寫業務。目標是：瀏覽器開得到一頁 HTML，標頭裡有 WebFormsJS，伺服器進得了 PageLoad。
Leer artículo →走完官方那個歡迎頁
第 4 章的表單已經在頁面上。這一章補上控制器，然後對著網路面板把請求與回應讀完。範例的欄位名稱與官方教學一致，方便你對回文件。
Leer artículo →指到正確的那一個節點
Action Control 沒有控制項 ID 系統。你每次都在描述「現在這份 DOM 裡的哪一個節點」。指錯了，指令仍會成功執行，只是執行在別處。這一章把六種定位，和 C# 裡的兩種寫法，放在同一棵樹上。
Leer artículo →Action Control 代碼
你平常呼叫的是 C# 方法。除錯時讀到的是這張代碼表。兩套名字要對得起來，否則網路面板裡的一行會變成無法翻譯的縮寫。代碼取自 WebFormsJS 的公開 README，這裡按學習順序重排，不是按原始檔的段落順序。
Leer artículo →C# 類別上你會呼叫的方法
WebForms 的公開方法很多。這一章只排你在前 11 章會用到、而且能在公開教學或類別清單裡對上代碼的那些。方法的第一個參數幾乎都是定位：InputPlace 或它的字串形式。
Leer artículo →表單、檔案與頁面上的訊息
歡迎頁只有三個文字欄位。真實表單還有核取、下拉、多行文字與檔案。這一章的模式都一樣：用 name 讀取，用 WebForms 寫回頁面，不要把整頁換掉。
Leer artículo →沒有 ViewState 時，狀態放哪裡
舊版 Web Forms 把控制項狀態塞進隱藏欄位，所以重新整理與回傳之後，文字框裡的字還在。WebForms Core 的官方教學把「不使用 ViewState」列成優點。優點的背面是：你要自己決定哪些狀態活在 DOM、哪些活在伺服器、哪些活在瀏覽器歷史。
Leer artículo →練習：一頁聯絡表單
Has() 是 CodeBehind 教學用來判斷表單鍵是否有值的擴充。若你的版本沒有它，改回 !string.IsNullOrEmpty(...)。失敗的那條路不要停用按鈕，也不要排刪除。成功的那條路才停用，並讓綠色標題在數秒後消失。
Leer artículo →