Next.js Web3 Starter

A modern, full-stack Next.js & Web3 boilerplate with Docker, TypeScript, Hardhat, NextAuth.js, Tailwind, Postgres, and painless local development for your next Web3 project.

Wallet connect out of the box

Don't waste time setting up wallet connect—it comes out of the box. Focus on what differentiates your app sooner.

Ships with NextAuth.js and a custom provider for Ethereum, so anything more custom can be handled with a familiar library.

import { signInWithWallet } from "lib/auth.client";
import type { NextPage } from "next";
import { signOut, useSession } from "next-auth/react";

export default function Page: NextPage = () => {
  const session = useSession();
  if (session.data) {
    return <button onClick={() => signOut()}>Disconnect</button>;
  } else {
    return <button onClick={signInWithWallet}>Connect wallet</button>;
  }
}

Develop against local contracts

Don't sweat over having to deploy to a testnet to begin testing your app's functionality. Use your locally managed JSON-RPC node via Hardhat to make changes and see them immediately.

nextjs-web3-starter/..
|_ app/
|_ smartcontracts/
|_ docker-compose.yml
|_ README.md

Docker Compose it all

Spinning up your app, database, and JSON-RPC node is easy with Docker. Just run the Docker Compose command and begin writing code right away.

$ docker-compose up
[+] Running 3/0
 ⠿ Container nextjs-web3-starter-app-1        Created  0.0s
 ⠿ Container nextjs-web3-starter-db-1         Created  0.0s
 ⠿ Container nextjs-web3-starter-contracts-1  Created  0.0s