⚡ TurboETH - Web3 应用程序启动套件

使用 Next.js、RainbowKit、Tailwind、Sign-In With Ethereum 等构建的 Web3 应用程序模板。

文档

• 入门
  • 环境变量
  • JSON-RPC
  • WAGMI CLI
  • UI 组件
  • 后端数据库
• 核心集成
  • 🌈 RainbowKit
  • 🔏 Sign-In With Ethereum
• 智能合约集成
  • ERC20
• API 集成
  • Disco
  • Etherscan

开始使用

推荐使用 pnpm CLI 作为包管理器，但 npm 和 yarn 也应该可以使用。

pnpm install

开发

pnpm dev

构建

pnpm build

Web3 核心

• WAGMI CLI - 自动生成 React Hook
• RainbowKit - 钱包连接管理器
• Sign-In With Ethereum - 账户认证

Web2 框架

• Vercel - 应用基础设施
• Prisma - 数据库 ORM

开发者体验

• TypeScript – 静态类型检查器，实现端到端类型安全
• Prettier – 固执己见的代码格式化工具，确保代码风格一致
• ESLint – 适用于 Next.js 和 TypeScript 的可插拔代码检查工具

用户界面

• TailwindCSS – 实用优先的 CSS 框架，用于快速 UI 开发
• Radix – 原始组件如模态框、弹出框等，用于构建出色的用户体验
• Framer Motion – React 动画库，轻松为组件添加动画效果
• React Icons – 简洁美观、像素完美的图标

ui.shadcn.com 组件包含在 /components/shared/ui 文件夹中。

💻 开发者体验

🐕 什么是 husky

Husky 改善了你的 git 提交。

你可以在提交或推送时使用它来检查提交消息、运行测试、检查代码等。Husky 支持所有 Git 钩子。

🪝 钩子

• pre-commit: 检查应用程序代码库
• commit-msg: 应用 commitlint

📋 什么是 commitlint

commitlint 检查你的提交消息是否符合约定式提交格式。

通常，模式大致如下：

type(scope?): subject  #scope 是可选的；支持多个范围（当前分隔符选项："/"、"\" 和 ","）

实际例子可能如下所示：

chore: 在 travis ci 上运行测试

fix(server): 发送 cors 头

feat(blog): 添加评论部分

根据 commitlint-config-conventional（基于 Angular 约定），常见类型可以是：

• build
• chore
• ci
• docs
• feat
• fix
• perf
• refactor
• revert
• style
• test

致谢

原始模板来自 https://github.com/wslyvh/nexth

感谢 @wslyvh 🙏

版权所有 2023 Kames Geraghty