Decentralized Web Application Starter Template

Bootstrapped with Next.js + Tailwind CSS + Ethers + wagmi + RainbowKit.

Other tools/components included: Headless UI, Heroicons, Autoprefixer, Sass, PostCSS, ESLint, Prettier.

Demo

Getting Started

# Install Dependencies
yarn

# Run the development server
yarn dev

ENV

# Copy ENV File
cp .env.example .env.local

Configs

  • src/appConfig.ts: app name, title, SEO etc.
  • src/pages/_app.tsx: chains, providers, wallet connectors

Scripts

Next.js

# Build
yarn build

# Start server with build files
yarn start

Prettier

# Use Prettier to do Format Check for files under ./src
yarn format:check

# Use Prettier to do Format Fix for files under ./src
yarn format:fix

Contract Types

# Generate contract types from src/contracts/*.json
yarn compile-contract-types

Deployment

The easiest way to deploy your Next.js app is to use Vercel, by the creators of Next.js.

Check out the Next.js deployment documentation for more details.

More

Learn about components of this kit is using:

  • Next.js - React Framework by Vercel
  • Tailwind CSS - Utility-first CSS Framework
  • Ethers.js - Compact library for interacting with Ethereum.
  • wagmi - React Hooks for Ethereum
  • RainbowKit - React library for wallet connections with dApp.
  • Headless UI - Unstyled, fully accessible UI components

License

This app is open-source and licensed under the MIT license. For more details, check the License file.