pomoUp React Next NLW 4专注倒计时项目
Next.js 的待办倒计时项目，用起来挺带感的。
pomoUp-react_next，其实就是 Rocketseat 的 Move.it 项目，我自己给它改了个名字，听起来更像个专注小帮手。项目是 NLW#4 上搞出来的，技术选型挺实在：Next.js + TypeScript + Context API，配合 CSS Modules 写样式，结构也蛮清晰。
前端部分是纯 React 开发，基本没加花活，组件划分合理，用 Context 做状态管理，像计时器、挑战任务这些状态切换，响应也快，逻辑也干净，适合新手上手练手。想学 SPA 和 SSR/SSG 的话，这项目里都能体验到。
页面是单页结构，带有挑战和休息机制，像个番茄钟。代码写法比较清爽，_app.tsx 和 _document.tsx 都写得挺规范。样式模块化后也方便维护，不用担心命名冲突。部署推荐用 Vercel，配套最舒服，yarn dev 跑本地也毫无压力。
你要是刚入门 Next.js 或想练习 TypeScript + React，这个项目可以直接拿来改着玩。比如换个接口，接入你自己的任务系统，或者改下样式整成黑夜模式也都挺方便。别忘了看看 moveit 项目 和 Next.js 教程，配着看更清楚。
如果你做的是类似习惯追踪、专注类的小应用，可以参考它的文件结构，挺值得借鉴。
文件大小：159.66KB
评论区