終於把基礎的 state 更新介紹完，接下來的篇章會接著介紹如何管理與設計這些在 component 裡面使用到的 state。今天的文章則是會從 輸入表單（Input Form）當例子，介紹平常我們在開發的時候，在使用 state 前需要考量的點來幫助我們設計出合理的 state 運用。
今天的文章參考官方文章的：

• https://zh-hant.react.dev/learn/reacting-to-input-with-state

命令式（imperative）與宣告式（declarative）開發

不知道大家之前有沒有聽說過 命令式開發（Imperative Programming） 跟 宣告式開發（Declarative Programming）。這兩個名詞常見可能用於 函式開發FP（Functional Programming）跟 OOP（Object-Oriented Programming）的比較上面，但今天的重點不是深入去介紹這兩個開發模式，所以我簡單的介紹兩個的不同：

命令式開發：比較注重於 How，如何達成我們的目的，所以會知道程式的細節，只要照著程式跑就會獲得我們要的結果。文章中用副駕駛指揮駕駛為例子，像是路口該右轉還是左轉，等等怎麼開之類的。
宣告式開發：只要給程式他需要的東西，他就會把結果給你，不需要知道程式實際是如何完成目的的。文章中用搭計程車當例子，只要給司機目的地，不需要知道怎麼開也能到。

這兩個開發模式沒有特別的優劣，會看操作情境而使用不同的模式。想知道更多可以參考：

• https://medium.com/@chih.hsi.chen/imperative-programming-vs-declarative-programming-%E8%BC%95%E9%AC%86%E8%AE%80%E6%87%82%E5%91%BD%E4%BB%A4%E5%BC%8F%E8%88%87%E5%AE%A3%E5%91%8A%E5%BC%8F%E5%87%BD%E5%BC%8F-75a1ea80b6d8

React 目前是使用宣告式的開發模式，在開發網頁的時候，可以宣告我們想顯示什麼，React 會根據我們的需求去更新 UI（透過 state 變化）。這幫助我們在開發網頁的時候不需要去處理程式細節，可以更快速的開發我們想要的畫面。

用宣告式思考 UI

文章中提供我們幾個流程，幫助我們思考 UI，並且設計好的架構：

1. 確認 component 不同的呈現狀態
2. 識別哪些會觸發狀態改變
3. 用 useState 記憶這些狀態進行操作
4. 移除多餘的狀態變數
5. 與事件處理做連結後實際更新狀態

這五個步驟適用於大多數我們開發 UI 設計 component 的時候，所以每當我們開發一個新功能或畫面時，可以不用馬上就直接著手寫程式，可以先照著步驟先想想 component 會有哪些狀態，並且整個執行流程會是如何，能幫助我們開發更順利。

小結

不好意思今天因為在讀文章，加上有些也是我新看的東西，所以時間不太夠，明天會把剛剛提到的五大項細節再做整理。
今天的文章就先到這邊，感謝大家耐心地看完，如果有任何問題與建議都歡迎告訴我，明天見，晚安。