Skip to main content

Prerequisites

Complete the environment variable setup in the quickstart before following the steps below.

Framework

The frontend runs on Next.js. To start customizing it, edit the component at ./frontend/src/pages/index.
If you know React.js but are new to Next.js, the transition is straightforward. See the Next.js docs for details.

Environment variables

All environment variable names exposed to the browser must be prefixed with NEXT_PUBLIC_.

Connect wallets

Web3Modal v3 is integrated and pre-configured. Use the provided useWallet hook to interact with Web3Modal and wallets. This hook contains utilities for all common wallet operations.

Send transactions to smart contracts

To send transactions to a locally deployed contract or a contract on a production chain, use the useSmartContract hook. It provides utilities for getting and interacting with an Ethers.js contract instance, and automatically points to the correct chain and contracts when you run or deploy the app.

Run the local frontend server

The dev command starts the local Next.js dev server along with the local blockchain. See the start developing instructions for usage.

Deploy to Vercel

The deploy command handles frontend deployment to Vercel automatically. Vercel offers a free tier for developers. To deploy:
dapp-launchpad deploy -n <CHAIN-NAME>
No pre-configuration is required. The command walks you through all relevant steps when you run it. See the deploy section of the quickstart for the full deployment workflow.