Next Web3 Boilerplate

Next Web3 Boilerplate is a scaffolding template for building decentralized applications (dapps) on Ethereum using Next.js, Viem, Wagmi, RainbowKit, Chakra UI, and TypeScript.

What is Next Web3 Boilerplate?

Next Web3 Boilerplate is a free, open-source (MIT) starter kit that gives you a pre-wired Ethereum dapp shell. It takes a fresh Next.js 16 project and adds wallet connection, chain selection, and live on-chain data displays, producing a runnable web app. The repository is maintained by Pedrojok01 (Pierre E.) and a live demo is deployed at next-web3-boilerplate.com.

Key Features

• Wallet integration — Connects MetaMask, Rainbow, Coinbase Wallet, and WalletConnect v2 through RainbowKit, with a required WalletConnect project ID in the .env file.
• Chain selector — Switch between supported EVM networks; the current set includes the Amoy and Sepolia testnets after deprecated Mumbai and Goerli were removed.
• On-chain data hooks — Display the current block number, chain ID, chain name, and connected wallet balance out of the box.
• Token balance hook — A built-in hook queries a connected wallet's token balances.
• Message signing & transfers — Sign messages and transfer native currency directly from the template UI.
• Dark mode — Chakra UI dark-mode support is enabled by default.
• Developer tooling — Docker, ESLint, Prettier, and Husky are pre-configured, including a multi-stage Dockerfile that produces a standalone image of roughly 320 MB.
• Modern stack defaults — Next.js 16 with Turbopack, React 19, TypeScript 5.9.3, Chakra v3, and ESLint 9 are configured.

Who should use Next Web3 Boilerplate?

• Ethereum dapp developers — Start with wallet connection and chain switching already wired instead of configuring Wagmi and RainbowKit by hand.
• Frontend engineers new to Web3 — Use the template as a reference implementation of Viem and Wagmi inside a Next.js 16 project.
• Hackathon teams — Clone the repo, add a WalletConnect project ID, and have a working dapp shell with wallet balance and block number in minutes.
• Startups prototyping token or transfer features — Use the included sign-message and native-transfer components as a base before adding custom business logic.

What can you do with Next Web3 Boilerplate?

• Connect wallets — Support MetaMask, Rainbow, Coinbase Wallet, and WalletConnect in one button, with ENS address resolution handled by useEnsAddress.
• Read chain state — Show block number, chain ID, and chain name for the connected network.
• Manage wallet actions — Sign messages and send native transfers from the template's UI.
• Query token balances — Call the built-in hook to display token balances for the connected address.

How does Next Web3 Boilerplate work?

Clone the repository, install dependencies with npm, pnpm, yarn, or bun, and copy .env.example to .env with a WalletConnect v2 project ID. Then run bun dev (or your package manager's dev command), or build and run the Docker image with docker build -t next-web3-boilerplate -f Dockerfile . and docker run -p 3000:3000 next-web3-boilerplate. The app serves on http://localhost:3000.

FAQ

Is Next Web3 Boilerplate free?

Yes. The project is released under the MIT License, and the source is public on GitHub. You can use it for personal or commercial projects without paying a license fee.

What wallets does Next Web3 Boilerplate support?

It uses RainbowKit, so MetaMask, Rainbow, Coinbase Wallet, and any wallet compatible with WalletConnect v2 are supported. A WalletConnect project ID is required in the .env file for WalletConnect connections.

What are the Node.js requirements?

The repository requires Node.js version 20.9.0 or higher; it was developed on Node.js LTS v23. TypeScript 5.9.3 is used, and you can install dependencies with npm, pnpm, yarn, or bun.

Which chains are configured?

The template includes a chain selector with current EVM testnets Amoy and Sepolia; the deprecated Mumbai and Goerli chains were replaced in the 2026-02 update. You can add or remove chains in the Wagmi configuration.

Does the template include Docker support?

Yes. A multi-stage Dockerfile builds a standalone image of approximately 320 MB, and the Dockerfile has been updated to use a Node 23 LTS base image.