Next.js 我该怎么爱你？

近日，Chatgpt已经宣布放弃Nextjs，转而使用Remix来作为全栈开发框架，为什么越来越多人质疑Nextjs？ 很简单，一家商业公司（Vercel）开源的框架，居然让框架运行机制跟自己的云服务强绑定，这让很多开发者望而却步，认为Nextjs不够自由。 的确，Nextjs的自由度不够，尤其是在Self-host的时候，非常的蛋疼，但是幸好，我们有一些方法可以规避这些问题。

1. Next.js 的定位

Next.js 是一个 React 框架，提供了服务器端渲染（SSR）和静态网站生成（SSG）的功能。它常用于构建大前端（大前端通常指的是前后端同构的应用）应用，在这种架构中，后端通过微服务来提供数据服务，而前端则使用 Next.js 来渲染和展示数据。

传统技术（如 PHP 和 JSP） 与 Next.js 的主要区别在于：

• 前后端同构：Next.js 使用 JavaScript/TypeScript 实现前后端同构，避免了在 PHP/JSP 中混入 JavaScript 代码的问题。
• 全栈开发：虽然 Next.js 更常被用作前端框架，但它也支持全栈开发，允许开发者使用同一语言（JavaScript/TypeScript）进行前后端开发。

2. Next.js 与 Vercel 的关系

Vercel 是 Next.js 的创始公司，提供了针对 Next.js 优化的部署平台。然而，使用 Vercel 也带来了一些问题：

2.1 缓存混乱

由于针对Vercel云服务优化缓存，使得当我们在Self-Host的时候， 尤其是在缓存更新和部署过程中，可能会出现缓存不一致的情况。不过，好消息是从 Next.js 版本 rc-15.0 开始，这些问题得到了显著改善。

2.2 Middleware 的 Node.js Runtime 限制

Next.js 的中间件（middleware）在早期版本中无法使用 Node.js runtime，这导致中间件无法直接连接数据库。官方曾推荐通过内部请求的方式来请求 API 路由，这种方法虽然有效，但可能会导致一些性能和开发体验上的问题。随着版本的更新，这个问题也在逐渐得到改进。

3. 如何实现全栈开发？

如果你希望在 Next.js 中实现全栈开发，可以考虑以下几个方案：

3.1 使用 Prisma 作为 ORM

Prisma 是一个强大的 ORM 工具，它与 Next.js 的集成非常顺畅。Prisma 提供了简洁的 API 来处理数据库操作，使得在 Next.js 中实现全栈功能变得更加高效和方便。

3.2 使用 NextAuth 实现 JWT 认证

NextAuth 提供了全面的认证机制，通过 JWT（JSON Web Tokens）进行会话管理。这种方式可以将账户信息嵌入 JWT，从而避免在中间件层重新构建会话的需求。这样一来，即使中间件无法直接访问数据库，也能实现有效的认证管理。

总结

Next.js 相较于传统的技术栈如 PHP 和 JSP，提供了更现代的前后端同构方案和更为强大的全栈开发能力。尽管在实际应用中可能会遇到与 Vercel 平台相关的问题，但这些问题也在不断被修复和改进。通过使用 Prisma 和 NextAuth，开发者可以更好地实现全栈开发，并充分利用 Next.js 的优势。