template web3 app

Plantilla de aplicación Web3 construida con Next.js, Rainbowkit, Tailwind, inicio de sesión con Ethereum y más.

Documentación

• Empezando
  • Variables de entorno
  • JSON-RPC
  • Wagmi cli
  • Componentes de la interfaz de usuario
  • Base de datos de backend
• Integraciones centrales
  • ? Arcoiris
  • ? Iniciar sesión con Ethereum
• Integraciones de contratos inteligentes
  • ERC20
• Integraciones de API
  • Disco
  • Éter

Empezando

La CLI pnpm es el Administrador de paquetes recomendado, pero npm y yarn también deberían funcionar.

pnpm install

Desarrollo

pnpm dev

Construir

pnpm build

Web3 núcleo

• Wagmi CLI - Generación automática de gancho React
• Rainbowkit - Manager de conexión de billetera
• Iniciar sesión con Ethereum - Autenticación de la cuenta

Marcos Web2

• VERCEL - Infraestructura de la aplicación
• Prisma - Base de datos ORM

Experiencia del desarrollador

• TypeScript: verificador de tipo estático para TypeSafety de extremo a extremo
• Más bonito - formatero de código obstinado para un estilo de código consistente
• Eslint - Linter conectable para Next.js y TypeScript

Interfaz de usuario

• TailWindcss-Marco CSS de utilidad para el desarrollo rápido de la interfaz de usuario
• Radix: primitivas como Modal, Popover, etc. para construir una experiencia de usuario estelar
• Framer Motion - Biblioteca de movimiento para reaccionar a los componentes animados con facilidad
• Iconos reaccionados-iconos bellamente simples, perfectos para píxeles

Los componentes de UI.Shadcn.com se incluyen en la carpeta /components/shared/ui .

Experiencia del desarrollador

? Que es husky

Husky mejora tus comodidades.

Puede usarlo para vincular sus mensajes de confirmación, ejecutar pruebas, código de pelusa, etc. cuando se compromete o presione. Husky admite todos los gits Git.

? Manos

• Pre-Commit: Base de código de la aplicación de pelusa
• Commit-MSG: aplique Commintlint

? ¿Qué es Competlint?

Compromiso de compromiso si sus mensajes de confirmación cumplen con el formato de confirmación convencional.

En general, el patrón se ve así:

type(scope ? ): subject  # scope is optional; multiple scopes are supported (current delimiter options: "/", "" and ",")

Los ejemplos del mundo real pueden verse así:

 chore: run tests on travis ci

 fix(server): send cors headers

 feat(blog): add comment section

Los tipos comunes de acuerdo con Compromlint-Config-Convencional (basado en la Convención Angular) pueden ser:

• construir
• faena
• CI
• documento
• logro
• arreglar
• perfil
• refactor
• revertir
• estilo
• prueba

Expresiones de gratitud

La plantilla original fue bifurcada de https://github.com/wslyvh/nexth

Gracias @wslyvh

---

Copyright 2023 Kames Geraghty