diff --git a/packages/docs/.vitepress/config.mts b/packages/docs/.vitepress/config.mts index d9d67aa..e8c1f70 100644 --- a/packages/docs/.vitepress/config.mts +++ b/packages/docs/.vitepress/config.mts @@ -31,7 +31,14 @@ export default defineConfig({ { text: '公众号-场景二维码登录', link: '/wechatmp-qrcode' }, { text: 'Gitee登录', link: '/gitee' } ] - } + }, + { + text: '其他', + items: [ + { text: 'Next.js 我该怎么爱你?', link: '/nextjs-fuck' }, + { text: '适合中国宝宝体质的第三方登录流程', link: '/chinese-third-party-login-flow' }, + ] + }, ], socialLinks: [ diff --git a/packages/docs/chinese-third-party-login-flow.md b/packages/docs/chinese-third-party-login-flow.md new file mode 100644 index 0000000..109270c --- /dev/null +++ b/packages/docs/chinese-third-party-login-flow.md @@ -0,0 +1,5 @@ +# 适合中国宝宝体质的第三方登录流程 + + + +TODO \ No newline at end of file diff --git a/packages/docs/nextjs-fuck.md b/packages/docs/nextjs-fuck.md new file mode 100644 index 0000000..128a1e8 --- /dev/null +++ b/packages/docs/nextjs-fuck.md @@ -0,0 +1,45 @@ + +## 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` 的优势。 + diff --git a/packages/docs/quickstart.md b/packages/docs/quickstart.md index 1fcd7f4..e9c2029 100644 --- a/packages/docs/quickstart.md +++ b/packages/docs/quickstart.md @@ -1,4 +1,13 @@ +## 项目介绍 + +大部分介绍Nextjs的课程都在使用第三方OIDC平台,比如`Clerk`,`Auth0`,但是如果我的项目只是一个简单的小项目,我期待用`Nextjs`的全栈能力降低我的部署成本,我不希望依赖一些第三方的登录平台,那该怎么办? + +所以我需要一个完善的插件,能够为我提供第三方平台登录、账号/密码登录能力,并且可以绑定第三方账号,可以快速的集成到我的`Nextjs`项目,并且不再依赖其他的第三方平台。 + +为了解决这个问题,我开发了`next-auth-oauth`插件,它可以帮助你快速集成第三方平台登录,并且可以绑定第三方账号,并且可以快速的集成到你的`Nextjs`项目中。 + + ## 快速开始 🚀 diff --git a/packages/next-auth-oauth/package.json b/packages/next-auth-oauth/package.json index 630ea2a..e0e2c98 100644 --- a/packages/next-auth-oauth/package.json +++ b/packages/next-auth-oauth/package.json @@ -1,6 +1,6 @@ { "name": "next-auth-oauth", - "version": "1.0.4", + "version": "1.0.5", "description": "`next-auth-oauth` 是一个基于 Next.js 和 NextAuth 的增强插件,用于简化和增强授权登录的处理。该插件提供了丰富的功能,包括第三方登录绑定、账户管理等,使得授权流程更加高效和灵活。", "main": "dist/index.esm.js", "types": "dist/index.d.ts",