Static Single Page View Implementation - 前端專案review

這個作業分為前端刻板與系統設計，今天我們先來看前端(React/NextJS)專案，這個作業是需要根據提供的figma設計來刻板，盡量刻的一樣。
這是作業需求的版型
這個我做的作業Demo

專案目錄設計 review

優點：

• 組織結構清晰：從根目錄到子目錄，結構層次分明，容易理解。
• 分離公共組件：在 src/components/shared 下分離公共組件有助於重用和維護。
• 設定文件和程式碼分離：配置文件（如 .eslintrc.json 和 tsconfig.json）位於根目錄，與程式碼分開，使目錄結構更為整潔。
• 使用 TypeScript：專案使用了 TypeScript，這可以增加程式碼的健壯性和易維護性。

可以改進的地方：

• 組件的命名：一些組件名稱，如 navBack.tsx 和 title.tsx，過於通用。可以根據實際功能和上下文給予更具描述性的名稱。
• 單一職責原則：確保每個組件只做一件事情。例如，resultStatusList.tsx 和 resultList.tsx 可以進一步拆分或組合？
• 樣式組織：可以建立一個 styles 或 utilities 目錄來存放自定義的 Tailwind 工具類、組件或插件。
• 狀態管理：目錄中沒有明確的狀態管理解決方案（如 Redux、MobX 等）。如果此應用需要管理複雜的狀態或進行非同步操作，則可能需要加入。
• 測試目錄：沒有專門的測試目錄或測試文件，建議建立一個 tests 目錄或使用其他命名規則。