内置 Swagger UI 调试界面,可在仪表盘内直接测试 API
nextjs-api-starter-kit — Next.js 启动器模板
作者 MGalaCyber
基于 Next.js 与 Tailwind CSS 的 REST API 平台启动模板,集成 Swagger UI、用户认证、仪表盘、API Key 与速率限制,提供免费与付费两个版本。
看看你的网站会是什么样
浏览真实页面截图,比较内容排版与手机效果。点击下方缩略图切换,放大查看整页细节。
全部页面与视图 2
截图用于了解视觉与布局,交互效果请以实际项目为准。
值得关注的模板亮点
从已有项目资料中,快速了解它的特点。
完整的 API Key 系统,支持 X-RESTful-KEY 请求头校验与免费/付费差异化速率限制
提供登录注册、邮箱验证、忘记/重置密码等认证流程(付费版)
支持 Google、GitHub、Discord 等 OAuth2 提供商(付费版)
包含落地页、仪表盘、升级套餐页、状态页与 404 页面
README 列出自动生成 API 端点、类型、客户端组件与 Mock 服务器等开发者工具
模板详细介绍
该模板面向希望快速搭建 REST API 平台与配套管理界面的开发者。README 显示其包含落地页、登录注册、用户仪表盘、升级套餐页,以及内嵌于仪表盘的 Swagger UI 调试界面。后端提供 RESTful API 路由与 OpenAPI 文档,并实现 API Key 系统:每个注册用户分配唯一 Key,需通过 X-RESTful-KEY 请求头传递,无效或缺失返回 401,免费与付费用户可设置不同速率限制。技术栈涉及 Next.js、Tailwind CSS、Swagger UI(OpenAPI 3.x)、TypeScript/JavaScript、Axios/Fetch,以及 MongoDB、JWT、NextAuth、SMTP。
模板分为免费版与付费版。免费版包含 Swagger UI、落地页、仪表盘、调试页、升级页与状态页;付费版额外提供登录注册、忘记/重置/确认邮箱页面、4 个 OAuth2 提供商、自定义 Swagger 主题、自定义 VSCode 代码片段、SMTP、速率限制、API Key 访问、账户管理及优先支持等。README 中的环境变量配置(如数据库、NextAuth、OAuth、SMTP)标注为仅付费版可用。
开发者功能方面,README 列出自动组件与 API 生成器(从 OpenAPI/Swagger schema 生成 TypeScript 端点、类型与客户端组件)、动态客户端 SDK 生成(fetch 封装或 React hooks)、集成请求检查器、Mock 服务器支持,以及自动生成 JSON 响应结构。这些功能的具体实现细节与可用范围 README 未进一步说明。
适合你的项目吗?
适用场景
- 搭建带用户认证与 API Key 管理的 REST API 平台
- 为已有 API 快速生成带 Swagger 调试界面的管理仪表盘
- 作为 SaaS 产品的起步模板,包含免费/付费套餐升级页
- 需要 OAuth2 登录、SMTP 邮件与速率限制的 API 服务原型
适合人群
- 需要快速启动 REST API 平台与配套前端的开发者
- 希望集成 Swagger UI 与 OpenAPI 文档的团队
- 计划实现 API Key 访问控制与速率限制的项目
- 需要登录注册、邮箱验证与 OAuth2 登录的 SaaS 原型
上手与定制指南
结合仓库当前版本的说明,按下面的资料检查内容、配置与运行要求。
- 1
克隆仓库后使用 npm、yarn、pnpm 或 bun 安装依赖
- 2
环境变量配置(数据库、NextAuth、OAuth、SMTP 等)仅付费版提供,需参考 .env.example
- 3
站点配置位于 src/config/site.ts
- 4
运行 npm run dev 等命令启动开发服务器,默认访问 http://localhost:3000
- 5
调用受保护接口时需在请求头中携带 X-RESTful-KEY
授权与来源资料
使用条件与限制
免费使用 · 保留许可声明本次收录的是公开仓库中采用 MIT 许可的免费版本;免费范围为该版本代码,不代表外部服务或第三方素材免费。
使用时需要遵守
- 允许免费使用、修改、商用和分发该版本代码。
- 分发代码副本或实质性部分时,保留原作者版权声明和完整 MIT 许可声明。
- 代码按现状提供;担保与责任限制以原许可证及适用法律为准。
额外费用与待核对事项
- 项目资料提及可选付费版本或功能;本次仅收录公开免费代码,不包含付费升级。
- 演示图片、字体、图标及其他第三方素材需按各自许可核对,不能仅凭代码的 MIT 许可判断。
- 域名、托管、数据库、支付或 AI 等外部服务可能另外收费。
- 环境变量配置(数据库、NextAuth、OAuth、SMTP 等)仅付费版提供,免费版无法按 README 完成完整配置。
- 登录与注册页面仅付费版提供,免费版不含该功能。
- 忘记密码、重置密码与确认邮箱页面仅付费版提供。
- 4 个 OAuth2 提供商登录仅付费版提供。
- SMTP 邮件发送支持仅付费版提供。
- 速率限制功能仅付费版提供。
- API Key 访问控制仅付费版提供。
- 账户管理功能仅付费版提供。
- 优先支持仅付费版提供。
- 独家功能访问权仅付费版提供。
- 专属 Discord 角色仅付费版提供。
- 更新抢先体验仅付费版提供。
- 付费版需通过 SociaBuzz 链接单独购买,免费版与付费版为不同分发。
- 需自备 MongoDB 数据库(如 MongoDB Atlas)连接地址。
- 邮件功能需自备 SMTP 服务账号(如 Brevo 或免费 SMTP)。
查看原文依据
Permission is hereby granted, free of charge
许可证原文
4. Setup environment (Note: `Only available in Premium version`)
README 原文
| Sign In & Sign Up Page | ❌ | ✅ |
README 原文
| Forgot, Reset & Confirm Email Pages | ❌ | ✅ |
README 原文
| Supports 4 OAuth2 Providers | ❌ | ✅ |
README 原文
| Supports SMTP | ❌ | ✅ |
README 原文
| Rate Limiting | ❌ | ✅ |
README 原文
| API Key Access | ❌ | ✅ |
README 原文
| Account Management | ❌ | ✅ |
README 原文
| Priority Support | ❌ | ✅ |
README 原文
| Access to Exclusive Features | ❌ | ✅ |
README 原文
| Access to Exclusive Discord Roles | ❌ | ✅ |
README 原文
| Early Access to Updates | ❌ | ✅ |
README 原文
1. Clone this repository or download from [MGalaCyber](https://github.com/MGalaCyber/nextjs-api-starter-kit) or buy premium version [HERE](https://sociabuzz.com/galaxd/p/nextjs-api-starter-kit)
README 原文
MONGOOSE_URI=REPLACE_ME #Go to: https://cloud.mongodb.com
README 原文
https://github.com/MGalaCyber/nextjs-api-starter-kit/blob/master/LICENSEhttps://github.com/MGalaCyber/nextjs-api-starter-kit/blob/master/README.md# NODEMAILER - You can search "SMTP Free" on browser or use Brevo
README 原文
DeepSeek 根据仓库许可证和 README 整理 ·2026-10-14。结果仅覆盖已读取资料,依赖、图片、字体及后续条款变更以各自原文为准。
项目核对记录与介绍依据
模板资料
- 来源平台
- GitHub
- 资料与维护参考分
- 资料较完整 · 83 / 100
- 技术栈
- Next.js · React
- 网站类型
- 启动器
这个分数如何计算
本站按许可资料(最高30分)、演示链接(12分)、预览图(10分)、Star数(15分)、记录的维护时间(15分)、描述完整度(8分)、功能记录(5分)和分类资料(5分)计算。它不是代码、安全或性能测试,也不是 Google 评分;有链接不代表已实测可用。
这个项目需要核对什么
- 记录的仓库更新时间
- 2026-01-15
- 截图检查日期
- 2026-10-14
已收录演示链接。请用你的内容与屏幕尺寸检查;有演示不代表表单、认证或支付已经可用。
目录记录的主要技术栈是 Next.js。请通过依赖清单和锁文件核对实际版本与托管要求。这些说明基于收录资料,不代表代码审计或部署实测。
查看具体选型方法 →介绍的制作与核对状态
介绍由 AI 辅助整理目录与仓库资料。仓库作者不等于这篇介绍的审核者。
审核声明: codex-user-requested-batch-review-20261017 · 2026-10-16
查看当时使用的来源资料
SHA-256: 8ecd921245f4ea5b293246a3e9ad999d998d1e436f7ff45b107c556ce925d2db
2026-10-14T07:11:33.904Z
来源文件 / 仓库# 🚀 NEXTJS API Starter Kit A powerful starter kit built with **Next.js**, **Tailwind CSS**, and **Swagger UI** — perfect for building modern REST API platforms with user authentication, dashboards, freemium upgrade pages, and built-in API documentation playground. --- ## 📚Table of Contents - [Screenshot](#️-preview-screenshots) - [Features](#-features) - [Tech Stack](#-tech-stack) - [Quick start](#-quick-start) - [File Structure](#-quick-start) --- ## 🖼️ Preview Screenshots #### FREE VERSION > [DEMO](https://demo.galaxd.com/p/nextjs-api-starter-kit-free) | Landing Page | Dashboard | |--------------|-----------| |  |  | | Status | Swagger Playground | |------------|--------------------| |  |  | #### PREMIUM VERSION > [DEMO](https://demo.galaxd.com/r/nextjs-api-starter-kit-premium) ``` DEMO ACCOUNT: email: [email protected] password: demo ``` <div align="center" style"border-radius:15px"> <a href="https://sociabuzz.com/galaxd/p/nextjs-api-starter-kit"> <img alt="SociaBuzz" height="50" src="https://github.com/MGalaCyber/Badges/blob/master/sociabuzz.svg"/> </a> </div> | Landing Page | Dashboard Dark Mode | Dashboard Light Mode | |-----------|-----------|-----------| |  |  |  | | Sign In | Sign Up | Verification Email | |-----------|-----------|-----------| |  |  |  | | Forgot Password | Reset Password | Playground | |-----------|-----------|-----------| |  |  |  | | Status | Not Found | Pricing | |-----------|-----------|-----------| |  |  |  | | Settings API Key | Settings Account | Settings Danger Zone | |-----------|-----------|-----------| |  |  |  | | Delete Account | SMTP Confirm Email | SMTP Forgot Password | |-----------|-----------|-----------| |  |  |  | --- ## ✨ Features - 🌐 Beautiful landing page (Tailwind CSS) - 🔐 Login & registration system - 📊 User dashboard with access control - 💎 Upgrade page for free/premium plans - 🧪 API Playground using Swagger UI inside the dashboard - ⚙️ RESTful API routes with OpenAPI documentation - 🔑 API Key system with rate limiting - 📁 Clean and modular project structure ## 🧰 Developer Features - 🧬 Auto Component & API Generator - Automatically generate TypeScript API endpoints, types, and client components from OpenAPI or Swagger schema. - 🔄 Dynamic Client SDK Generation - Auto-generate fetch wrappers or React hooks from OpenAPI schema (`useApi` style).integration. - 🔍 Integrated Request Inspector - View real-time request/response logs inside dashboard (for debugging API keys or endpoints). - 🧪 Mock Server Support - Built-in support for mock API responses (for testing frontend without real backend). - 🔁 Auto-generate JSON response structure - Automatically produce structured JSON examples for Swagger/OpenAPI `responses` section, based on validation schema or model definitions. ### 🆚 Free vs Premium Comparison | FEATURES | FREE | PREMIUM | |---------------------------- |:--------:|:-------:| | Swagger UI | ✅ | ✅ | | Landing Page | ✅ | ✅ | | Dashboard Page | ✅ | ✅ | | Playground Page | ✅ | ✅ | | Upgrade Plan Page | ✅ | ✅ | | Stats & Status Page | ✅ | ✅ | | Sign In & Sign Up Page | ❌ | ✅ | | Forgot, Reset & Confirm Email Pages | ❌ | ✅ | | Supports 4 OAuth2 Providers | ❌ | ✅ | | Custom Swagger Theme UI | ❌ | ✅ | | Custom VSCode Snippets | ❌ | ✅ | | Supports SMTP | ❌ | ✅ | | Rate Limiting | ❌ | ✅ | | API Key Access | ❌ | ✅ | | Account Management | ❌ | ✅ | | Priority Support | ❌ | ✅ | | Access to Exclusive Features | ❌ | ✅ | | Access to Exclusive Discord Roles | ❌ | ✅ | | Early Access to Updates | ❌ | ✅ | --- ## 🔑 API Key System This project includes a built-in API key system for managing access to protected endpoints. ### How it works: - Every registered user is assigned a unique API key. - API keys must be passed in the `X-RESTful-KEY` header. - Different rate limits can be set for free vs. premium users. - Invalid or missing API keys will result in a `401 Unauthorized` error. --- ## 🧱 Tech Stack - **Next.js** - **Tailwind CSS** - **Swagger UI (OpenAPI 3.x)** - **TypeScript / JavaScript** - **Axios / Fetch** - **MongoDB, JWT, NextAuth, SMTP** --- ## 🛠 Quick start 1. Clone this repository or download from [MGalaCyber](https://github.com/MGalaCyber/nextjs-api-starter-kit) or buy premium version [HERE](https://sociabuzz.com/galaxd/p/nextjs-api-starter-kit) 2. Make sure you have **Node.js** installed on your machine. 3. Install the dependencies using your preferred package manager: ```bash npm install # or yarn install # or pnpm install # or bun install ``` 4. Setup environment (Note: `Only available in Premium version`) ```yml SITE_MODE=REPLACE_ME #Use: development | production MONGOOSE_URI=REPLACE_ME #Go to: https://cloud.mongodb.com NEXTAUTH_SECRET=REPLACE_ME #Open terminal and type: openssl rand -base64 64 NEXTAUTH_URL=REPLACE_ME #Paste your domain URL # AUTH PROVIDERS # Google - Go to: https://console.cloud.google.com/auth AUTH_GOOGLE_CLIENT_ID=REPLACE_ME AUTH_GOOGLE_CLIENT_SECRET=REPLACE_ME # Github - Go to: https://github.com/settings/developers AUTH_GITHUB_CLIENT_ID=REPLACE_ME AUTH_GITHUB_CLIENT_SECRET=REPLACE_ME # Discord - Go to: https://discord.com/developers/applications AUTH_DISCORD_CLIENT_ID=REPLACE_ME AUTH_DISCORD_CLIENT_SECRET=REPLACE_ME # NODEMAILER - You can search "SMTP Free" on browser or use Brevo NODEMAILER_AUTH_USER=REPLACE_ME NODEMAILER_AUTH_PASSWORD=REPLACE_ME ``` 6. Setup site: Go to `src/config/site.ts` 7. Start the development server: ```bash npm run dev # or yarn dev # or pnpm dev # or bun dev ``` 8. Open http://localhost:3000 in your browser to view the app. ### Example request with API key: ```bash curl -X 'GET' \ 'http://localhost:3000/api/v1/users' \ -H 'accept: application/json' \ -H 'X-RESTful-KEY: your-api-key-goes-here ``` --- ## 📂 Files Structure <details> <summary>Premium version</summary> ``` . ├── .vscode │ └── nextjs-api-starter-kit-premium.code-snippets ├── public │ ├── preview │ │ ├── free │ │ │ ├── dashboard.png │ │ │ ├── landing.png │ │ │ ├── playground.png │ │ │ └── status.png │ │ └── premium │ │ ├── 404.png │ │ ├── dashboard.png │ │ ├── delete-account.png │ │ ├── email-verification.png │ │ ├── forgot-password.png │ │ ├── landing.png │ │ ├── light-mode.png │ │ ├── playground.png │ │ ├── pricing.png │ │ ├── reset-password.png │ │ ├── settings-account.png │ │ ├── settings-apikey.png │ │ ├── settings-dangerzone.png │ │ ├── signin.png │ │ ├── signup.png │ │ ├── smtp-confirm-email.png │ │ ├── smtp-forgot-password.png │ │ └── status.png │ ├── file.svg │ ├── globe.svg │ ├── next.svg │ ├── vercel.svg │ └── window.svg ├── src │ ├── app │ │ ├── actions │ │ │ └── github.ts │ │ ├── api │ │ │ ├── [...slug] │ │ │ │ └── route.ts │ │ │ ├── auth │ │ │ │ ├── [...nextauth] │ │ │ │ │ └── route.ts │ │ │ │ └── signup │ │ │ │ └── route.ts │ │ │ ├── data │ │ │ │ ├── regenKey │ │ │ │ │ └── route.ts │ │ │ │ ├── stats │ │ │ │ │ ├── server │ │ │ │ │ │ └── route.ts │ │ │ │ │ └── route.ts │ │ │ │ └── user │ │ │ │ └── route.ts │ │ │ ├── sendMail │ │ │ │ ├── reset-password │ │ │ │ │ └── route.ts │ │ │ │ └── verification-email │ │ │ │ └── route.ts │ │ │ ├── test │ │ │ │ └── route.ts │ │ │ └── v1 │ │ │ └── users │ │ │ └── route.ts │ │ ├── auth │ │ │ ├── confirm-email │ │ │ │ └── page.tsx │ │ │ ├── forgot-password │ │ │ │ └── page.tsx │ │ │ ├── reset-password │ │ │ │ └── [userId] │ │ │ │ └── page.tsx │ │ │ ├── signin │ │ │ │ └── page.tsx │ │ │ ├── signup │ │ │ │ └── page.tsx │ │ │ └── verification │ │ │ └── [userId] │ │ │ └── page.tsx │ │ ├── dashboard │ │ │ ├── playground │ │ │ │ └── page.tsx │ │ │ ├── pricing │ │ │ │ └── page.tsx │ │ │ └── page.tsx │ │ ├── endpoints │ │ │ └── route.ts │ │ ├── status │ │ │ └── page.tsx │ │ ├── favicon.ico │ │ ├── globals.css │ │ ├── layout.tsx │ │ ├── not-found.tsx │ │ └── page.tsx │ │ └── robots.ts │ │ └── sitemap.ts │ ├── components │ │ ├── dash │ │ │ ├── stats │ │ │ │ ├── account.tsx │ │ │ │ └── global.tsx │ │ │ ├── content.tsx │ │ │ ├── layout.tsx │ │ │ ├── profile.tsx │ │ │ ├── project-list.tsx │ │ │ ├── settings.tsx │ │ │ ├── sidebar.tsx │ │ │ └── top-nav.tsx │ │ ├── ui │ │ │ ├── alert-dialog.tsx │ │ │ ├── alert.tsx │ │ │ ├── avatar.tsx │ │ │ ├── button.tsx │ │ │ ├── card.tsx │ │ │ ├── dialog.tsx │ │ │ ├── dropdown-menu.tsx │ │ │ ├── input.tsx │ │ │ ├── label.tsx │ │ │ ├── progress.tsx │ │ │ ├── separator.tsx │ │ │ ├── sonner.tsx │ │ │ ├── tabs.tsx │ │ │ ├── textarea.tsx │ │ │ ├── toast.tsx │ │ │ └── toaster.tsx │ │ ├── background.tsx │ │ ├── confirm-email.tsx │ │ ├── cookie-consent.tsx │ │ ├── footer.tsx │ │ ├── preloader.tsx │ │ ├── theme-provider.tsx │ │ ├── theme-toggle.tsx │ │ ├── type-writer.tsx │ │ └── visitor.tsx │ ├── config │ │ ├── site.ts │ │ └── swagger.ts │ ├── context │ │ └── authProvider.tsx │ ├── hooks │ │ ├── use-toast.ts │ │ ├── useCountUp.ts │ │ └── useTextScramble.ts │ ├── lib │ │ ├── functions.ts │ │ ├── httpErrorHandler.ts │ │ ├── mongodb.ts │ │ ├── nodemailer.ts │ │ ├── responseHandlers.ts │ │ ├── swaggerCompiler.ts │ │ ├── utils.ts │ │ └── withApiKeyAuth.ts │ ├── models │ │ ├── cooldown.ts │ │ ├── passwordResetStatus.ts │ │ ├── user.ts │ │ └── verificationStatus.ts │ ├── styles │ │ └── SwaggerTheme.css │ ├── types │ │ ├── auth.ts │ │ ├── next-auth.d.ts │ │ └── swagger.ts │ └── middleware.ts ├── .env.example ├── .gitignore ├── components.json ├── eslint.config.mjs ├── LICENSE ├── next.config.ts ├── package.json ├── postcss.config.mjs ├── README.md ├── tailwind.config.ts └── tsconfig.json ``` </details> <details> <summary>Free version</summary> ``` . ├── public │ ├── preview │ │ ├── dashboard.png │ │ ├── landing.png │ │ ├── playground.png │ │ └── status.png │ ├── file.svg │ ├── globe.svg │ ├── next.svg │ ├── vercel.svg │ └── window.svg ├── src │ ├── app │ │ ├── actions │ │ │ └── github.ts │ │ ├── api │ │ │ ├── data │ │ │ │ ├── stats │ │ │ │ │ └── route.ts │ │ │ │ └── user │ │ │ │ └── route.ts │ │ │ ├── test │ │ │ │ └── route.ts │ │ │ └── v1 │ │ │ └── users │ │ │ └── route.ts │ │ ├── dashboard │ │ │ ├── playground │ │ │ │ └── page.tsx │ │ │ └── page.tsx │ │ ├── endpoints │ │ │ └── route.ts │ │ ├── login │ │ │ └── page.tsx │ │ ├── status │ │ │ └── page.tsx │ │ ├── favicon.ico │ │ ├── globals.css │ │ ├── layout.tsx │ │ └── page.tsx │ ├── assets │ ├── components │ │ ├── dash │ │ │ ├── stats │ │ │ │ └── global.tsx │ │ │ ├── content.tsx │ │ │ ├── dashboard.tsx │ │ │ ├── layout.tsx │ │ │ ├── profile.tsx │ │ │ ├── project-list.tsx │ │ │ ├── settings.tsx │ │ │ ├── sidebar.tsx │ │ │ └── top-nav.tsx │ │ ├── ui │ │ │ ├── alert-dialog.tsx │ │ │ ├── button.tsx │ │ │ ├── card.tsx │ │ │ ├── dialog.tsx │ │ │ ├── dropdown-menu.tsx │ │ │ ├── input.tsx │ │ │ ├── label.tsx │ │ │ ├── progress.tsx │ │ │ └── tabs.tsx │ │ ├── background.tsx │ │ ├── footer.tsx │ │ ├── preloader.tsx │ │ ├── theme-provider.tsx │ │ ├── theme-toggle.tsx │ │ └── type-writer.tsx │ ├── config │ │ ├── site.ts │ │ ├── swagger.ts │ │ └── swaggerCompiler.ts │ ├── hooks │ │ ├── useCountUp.ts │ │ └── useTextScramble.ts │ ├── lib │ │ ├── responseHandlers.ts │ │ └── utils.ts │ ├── sections │ ├── types │ │ ├── auth.ts │ │ └── swagger.ts │ └── middleware.ts ├── .env.example ├── .gitignore ├── components.json ├── eslint.config.mjs ├── LICENSE ├── next-env.d.ts ├── next.config.ts ├── package.json ├── postcss.config.mjs ├── README.md ├── tailwind.config.ts └── tsconfig.json ``` </details>
看看同类模板
对比同技术栈与用途的模板,找到更适合的视觉与内容结构。

ai-website-cloner-template
Clone any website with one command using AI coding agents
Next.js · 启动器

Next.js SaaS Starter
Next.js SaaS Starter 是 Next.js 官方维护的 SaaS 起点模板,定位介于学习资源和可直接部署的脚手架之间。
Next.js · SaaS

Next.js Commerce
Next.js Commerce 是 Vercel 团队维护的电商启动模板,基于 Next.js App Router 构建,采用服务端渲染、React Server Components、Server Actions …
Next.js · 电商

Next-js-Boilerplate
Next-js-Boilerplate 是一个面向 Next.js 16、Tailwind CSS 4 和 TypeScript 的启动器,核心定位是开发者体验优先。
Next.js · 启动器

tailwind-nextjs-starter-blog
tailwind-nextjs-starter-blog 是一个面向个人技术博客的 Next.js 与 Tailwind CSS 启动模板,其 v2 版本基于 App Router 与 React Server Comp…
Next.js · 博客

next-forge
Production-grade Turborepo template for Next.js apps.
Next.js · 启动器
