访问官网
Github
Next Auth 角色模板
使用这个Next.js模板快速启动项目！
安装
使用以下命令在本地克隆并创建此仓库：
npx create-next-app my-saas-project --example "https://github.com/mickasmt/next-auth-roles-template"
或者，使用Vercel部署：
步骤
- 使用pnpm安装依赖：
pnpm install
- 将
.env.example复制为.env.local并更新变量。
cp .env.example .env.local
- 启动开发服务器：
pnpm run dev
- 删除不需要的部分
您可以在终端中使用pnpm run remove-content命令来删除项目的特定部分。此命令支持以下参数：
- --blog：从项目中删除博客部分。
- --docs：从项目中删除文档部分。
建议
- 删除两个部分：建议使用
pnpm run remove-content而不指定参数（--blog或--docs）。这确保所有相关文档都被正确删除，因为如果在删除"docs"后删除"blog"或反之亦然，一些文档可能不会被删除/更新。
示例
- 删除博客和文档部分：
pnpm run remove-content
- 仅删除博客部分：
pnpm run remove-content --blog
- 仅删除文档部分：
pnpm run remove-content --docs
[!注意]
我使用npm-check-updates包来更新这个项目。使用此命令更新您的项目：
ncu -i --format group
技术栈和特性
框架
- Next.js – 用于构建高性能应用的React框架，提供最佳开发体验
- Auth.js – 轻松处理用户认证，支持Google、Twitter、GitHub等提供商
- Prisma – Node.js的TypeScript优先ORM
- React Email – 用于高效灵活电子邮件开发的多功能电子邮件框架
平台
UI
- Tailwind CSS – 用于快速UI开发的实用优先CSS框架
- Shadcn/ui – 使用Radix UI和Tailwind CSS构建的可重用组件
- Lucide – 简洁美观、像素完美的图标
next/font– 优化自定义字体并移除外部网络请求以提高性能ImageResponse– 在边缘生成动态Open Graph图像
钩子和工具
useIntersectionObserver– React钩子，用于观察元素进入或离开视口useLocalStorage– 在浏览器的本地存储中持久化数据useScroll– React钩子，用于观察滚动位置（示例）nFormatter– 格式化数字，如1.2k或1.2Mcapitalize– 将字符串的首字母大写truncate– 将字符串截断到指定长度use-debounce– 延迟函数调用/状态更新
代码质量
- TypeScript – 静态类型检查器，实现端到端类型安全
- Prettier – 固执己见的代码格式化工具，确保一致的代码风格
- ESLint – 适用于Next.js和TypeScript的可插拔代码检查工具
其他
- Vercel Analytics – 以隐私友好的方式跟踪独特访客、页面浏览量等
作者
本项目基于Next SaaS Stripe Starter。
由@miickasmt于2023年创建，根据MIT许可证发布。
致谢
感谢Hosna Qasmei提供部分仪表板侧边栏代码。
