各位程序员朋友们，我是Md Taqui Imam。今天的博客，我想和大家分享一些学习 Next.js 的最佳 GitHub 代码库。
NextJS 是一个流行的 JavaScript 框架，它允许我们使用 React 构建动态网站和应用程序。
别忘了访问 HTMLrev 👇
别忘了点个赞（🔥💖🦄🚀🤯）并保存下来以备后用📌。
让我们一起来看看并给这些热门项目点赞⭐📝
首先是👇
如果你想学习如何通过网站赚钱，欢迎免费加入我们的社区！在 Discord 上分享所有 bug 和解决方案。我们非常乐意合作，并结识像你一样才华横溢的开发者。
这是一个基于 Nextjs 13、Stripe、Drizzle ORM、Tailwind、Supabase 和 Sockets 的 SaaS 应用，支持实时光标。它具有以下多种功能：
一个使用 Nextjs 和 Shadcn UI 构建的简洁美观的作品集。
首先，运行开发服务器：
htmlrev.com
npm run dev
# or
yarn dev
# or
pnpm dev
# or
bun dev
请在浏览器中打开http://localhost:3000查看结果。
您可以通过修改文件来开始编辑页面app/page.tsx。页面会随着您编辑文件而自动更新。
本项目用于next/font自动优化和加载 Inter，一种自定义的 Google 字体。
这个作品集网站是用 Nextjs + ShadcnUI 构建的，效果很棒！它采用简洁的设计，并使用了 Tailwind CSS，包含关于、项目、简历和联系方式等页面。
对于正在学习网页开发的人来说，作品集对于展示技能至关重要。这是一个完美的入门级作品集模板，可以从中获得灵感！
joschan21 / digitalhippo使用 Next.js 14 应用路由、tRPC、TypeScript、Payload 和 Tailwind 构建
要开始这个项目，请运行
git clone https://github.com/joschan21/digitalhippo.git
然后将 .env.example 变量复制到单独的 .env 文件中，填写它们，这样你就可以开始了！
DigitalHippo是一款出色的电子商务应用，采用NextJS、Stripe和其他流行技术构建而成。它允许用户在线销售和购买数字产品。
我对产品分类、管理后台和结账流程等功能感到非常满意。代码也非常简洁清晰。
对于任何想要建立网上商店的人来说，这是一个必须学习的项目，可以了解支付和市场功能的集成。
这是一个关于全栈 Discord 克隆的仓库：Next.js 13、React、Socket.io、Prisma、Tailwind、MySQL | 2023 年完整课程
特征：
Node 版本 18.xx
git clone https://github.com/AntonioErdeljac/next13-discord-clone.git
npm i
NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY…
一个使用 Next.js 13、React、Socket.io、Prisma、Tailwind、MySQL 等构建的全栈 Discord 克隆版本。
本项目展示了如何使用NextJS、Socket.io 和其他工具编写一个类似于 Discord 的消息平台。
我觉得在应用中加入实时聊天和实时在线功能真是太棒了。学习 WebSocket 的底层工作原理真的能提升你的技能。
adrianhajdin /电子商务这个项目将帮助你学习如何构建和部署一个包含管理后台、内容管理系统和 Stripe 的全栈电子商务应用程序。
该存储库包含 af*功能齐全的电子商务网站的代码，该网站带有管理仪表板和 CMS。
产品管理、用户角色和支付集成等功能均按照最佳实践构建。
这是一个 Fullstack Trello Clone 的仓库，它使用了 Next.js 14、直播、React、Prisma、Stripe、Tailwind 和 MySQL。
主要特点：
该项目展示了如何开发一个类似于 Twitch 的直播平台，具有广播、评论等功能。
实时视频流传输看起来非常具有挑战性，但代码结构清晰。
学习如何利用 LiveKit 和 WebSocket 等服务，绝对可以帮助有抱负的开发者开发出创新产品。
这是“构建 LMS 平台：Next.js 13、React、Stripe、Mux、Prisma、Tailwind、MySQL | 2023 完整课程”的资料库。
主要特点：
Node 版本 18.xx
git clone https://github.com/AntonioErdeljac/next13-lms-platform.git
npm i
NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY=
CLERK_SECRET_KEY=
NEXT_PUBLIC_CLERK_SIGN_IN_URL=
NEXT_PUBLIC_CLERK_SIGN_UP_URL=
NEXT_PUBLIC_CLERK_AFTER_SIGN_IN_URL=
NEXT_PUBLIC_CLERK_AFTER_SIGN_UP_URL=
DATABASE_URL=
UPLOADTHING_SECRET=
UPLOADTHING_APP_ID=
MUX_TOKEN_ID=
MUX_TOKEN_SECRET=
STRIPE_API_KEY…
一个使用 Nextjs、React、Stripe、Mux、Prisma、Tailwind、MySQL 等构建的LMS（学习管理系统）平台。
主要特点：
这是一个使用Next.jscreate-next-app启动的项目。
首先，运行开发服务器：
npm run dev
# or
yarn dev
# or
pnpm dev
请在浏览器中打开http://localhost:3000查看结果。
您可以通过修改文件来开始编辑页面app/page.js。页面会随着您编辑文件而自动更新。
本项目用于next/font自动优化和加载 Inter，一种自定义的 Google 字体。
要了解有关 Next.js 的更多信息，请参阅以下资源：
您可以查看Next.js GitHub 代码库- 欢迎您的反馈和贡献！
部署 Next.js 应用最简单的方法是使用Next.js 创建者提供的Vercel 平台。
请查看我们的Next.js 部署文档了解更多详情。
这款电商应用很适合初级开发者练习使用。
项目结构和购物车、产品、结账等功能的集成都经过精心设计，同时保持了性能。
这是一个使用Next.jscreate-next-app启动的项目。
首先，运行开发服务器：
npm run dev
# or
yarn dev
# or
pnpm dev
请在浏览器中打开http://localhost:3000查看结果。
您可以通过修改文件来开始编辑页面app/page.tsx。页面会随着您编辑文件而自动更新。
本项目用于next/font自动优化和加载 Inter，一种自定义的 Google 字体。
要了解有关 Next.js 的更多信息，请参阅以下资源：
您可以查看Next.js GitHub 代码库- 欢迎您的反馈和贡献！
部署 Next.js 应用最简单的方法是使用Next.js 创建者提供的Vercel 平台。
请查看我们的Next.js 部署文档了解更多详情。
这是一个使用 NextJS 13 开发的社交媒体参考落地页应用程序。我认为像 Linktree 推广的这类服务非常有用。
在这个项目中学习整洁编码实践将为你打下坚实的基础。
如今，对于 Web 开发人员来说，学习如何在 Vercel 等平台上部署应用程序也很有价值。
这是一个用 NextJS 和 Hugo 构建的简单博客平台。撰写博客和文档是所有技术职业的重要组成部分。
这个项目可以教会我们一些好习惯，比如 Markdown 语法以及静态网站生成的工作原理。它是学习内容管理和发布流程的理想起点。
使用 Next.js 13.5 应用路由、tRPC、TypeScript、Prisma 和 Tailwind 构建
要开始这个项目，请运行
git clone https://github.com/joschan21/quill.git
然后将 .env.example 文件中的变量复制到另一个 .env 文件中，填写完毕，就完成了……
一款笔记网页应用，使用户能够轻松地用图片、格式等方式记录笔记。
主要特点：
taqui-786 / project-friendz这是一个使用 Shadcn ui 的Next.jscreate-next-app项目。
首先，运行开发服务器：
npm run dev
# or
yarn dev
# or
pnpm dev
请在浏览器中打开http://localhost:3000查看结果。
您可以通过修改文件来开始编辑页面app/page.tsx。页面会随着您编辑文件而自动更新。
本项目用于next/font自动优化和加载 Inter，一种自定义的 Google 字体。
要了解有关 Next.js 的更多信息，请参阅以下资源：
您可以查看Next.js GitHub 代码库- 欢迎您的反馈和贡献！
一个使用 NextJS、Editorjs、Taiwindcss 和其他工具构建的社交媒体应用程序。
诸如以下功能
这些是掌握 Next.js 和了解技术实际运作方式的最佳 GitHub 代码库。
研究由经验丰富的开发者创建的项目，肯定会加快我们学习 NextJS 的步伐。
希望这份清单能给你带来一些启发，让你成为这个优秀框架的专家！
如果您在探索这些代码库时需要任何帮助，请告诉我。
