使用 nextjs 重构我的个人博客
内容提要
作者将个人博客从基于PHP的CodeIgniter框架重构为Next.js 14，原因包括对PHP的不熟悉、希望使用Node.js框架以及提升开发效率。重构过程中保持了前端样式一致性，采用了Next.js的新特性App Router，简化了开发流程，并使用了Tailwind CSS和Ant Design等技术。博客现已接入阿里云效进行代码管理和发布。
延伸解读
从PHP到Next.js：技术栈迁移的考量
作者因对PHP不熟悉且希望使用Node.js框架，决定将博客从CodeIgniter重构为Next.js 14。这反映了开发者倾向于选择自己更熟悉的技术栈以提高效率。同时，博客原先由三套独立代码组成，统一到Next.js后降低了维护复杂度。对于类似情况的开发者，评估自身技术背景和项目维护成本是重构前的重要步骤。
App Router与约定大于配置的实践
Next.js的App Router通过文件系统约定简化了路由和布局管理，作者利用app目录和动态路由文件快速实现了页面逻辑。这种“约定大于配置”的方式减少了显式配置，提升了开发效率。但需注意，App Router是较新特性，可能伴随学习成本，且部分功能仍在迁移中，实际项目需权衡稳定性和新特性。
内置API路由与缓存机制的变化
Next.js提供了内置API路由，允许在页面同级目录下创建api/route.ts处理请求。作者特别指出，fetch()方法默认自带缓存，但Next.js v15将改为默认不缓存。这一变化可能影响数据获取行为，开发者需关注版本差异，必要时手动设置缓存策略，以避免意外行为。
样式与UI库的选型及部署流程
作者使用Tailwind CSS处理样式，Ant Design构建管理后台和评论功能，highlight.js实现代码高亮。这些工具提升了开发效率和界面一致性。部署方面，代码接入阿里云效，通过Git管理并利用流水线发布，实现了自动化。对于个人项目，合理选择工具链和部署方案能显著减少运维负担。
Q&A
为什么作者选择将博客从PHP重构为Next.js？
作者选择重构的原因包括对PHP的不熟悉、希望使用Node.js框架以及提升开发效率。
Next.js的App Router有什么新特性？
Next.js的App Router提供了一种更灵活的方式来组织和管理应用中的页面、布局和共享组件。
在重构过程中，作者如何保持前端样式的一致性？
作者在重构过程中尽量保持了前端样式的一致性，大部分主要功能已实现，部分功能正在迁移中。
作者在开发中使用了哪些技术？
作者使用了Tailwind CSS和Ant Design等技术来提升样式和功能。
如何在Next.js中创建动态路由？
可以通过在app目录下创建[slug].js文件来支持动态路由，文件中定义页面逻辑。
博客上线后如何进行代码管理和发布？
博客现已接入阿里云效进行代码管理和发布，支持使用git管理代码和接入流水线。
