Node 20 升級計畫

[s890081tonyhsu]

原本的node 20升級計畫改成以下內容

• 升級node 20（dev server換成vite）
• 改用function component實作
• 抽除RC開頭的組件，改用@mui/base開發自定義的組件
• 重寫原本的Redux流程，讓非同步行為可以在Action被管理（而不是擠在Reducer）
• 將抽取資料的流程改用hook實現
• 完善潛能計算部份，使其更好被除錯

已知需要確保正常的功能

• 查詢卡片時，可以關鍵字檢索、篩選、排序、翻頁
• 點選卡片可以得知詳細內容，並透過內部按鈕進行反查
• 查詢結晶（、大結晶）時，可以關鍵字檢索，翻頁
• 可以透過選擇的卡片進行組隊、且組隊時可以計算潛能

環境與工具部份

• node 14 lts -> node 20 lts
• react 17.0 -> react 18.2
• redux -> reduxjs/toolkit
• node-fetch -> axios
• - rc-prefix modules ->@mui/base with modifucation
  * + fluent ui (v2)

---

大致想法(v2使用，node 20升級不使用)

• 搜尋部份改用右側欄+折疊，讓使用者能夠清楚自己做出怎樣的篩選。
• 搜尋提供一點比較選項，讓使用者自行規劃篩選方式。需要注意AND, OR的處理方式
• 讓使用者選擇要顯示的部份，風險是每一列就無法自訂顯示方式了。
• 隊伍編輯界面改用右側欄，空間上比較不會受到modal的限制。

NOTE: 這個計畫可能會因為時間上的關係沒空處理，之後再看看。