Mirochiu's coding note

這裡使用範例MUI本身示範例，因為有時寫一寫會忘記一些步驟，乾脆就會整成一篇。以下整理成10點內容 1. 使用範例專案 pnpm create next-app {你喜歡的專案目錄名稱} --example https://github.com/mui/material-ui/tree/master/examples/material-ui-nextjs-ts 這裡使用MUI官方提供的Next.js的typescript範例，程式碼 請參考這裡 使用到的主要技術堆疊如下 a. MUI v5  b. Next.js v14 - App router c. typescript v5

這篇是受Tapas Adhikary所寫的 How to create a countdown timer using React Hooks 啟發 將它改成typescript和MUI的版本，並調整成自身使用的元件，並修改了 1. 使用  padStart()   處理時顯示分秒的雙位數字 2. 倒數30分鐘時會改變倒數時間成紅色 3. 避免顯示出NaN的狀況