QuickStart
Web3Modal
This is an opinionated quickstart guide for Web3Modal using Next.js. If you are looking for a more in-depth guide for other frameworks like Vue, Vanilla JS or platforms like Android, Flutter, please refer to Web3Modal Docs.
The Web3Modal SDK allows you to easily connect your Web3 dapp with wallets. It provides a simple and intuitive interface for dapps to request actions such as signing transactions and interacting with smart contracts on the blockchain.
Prerequisites
Usage
We are using create-wc-dapp, the official quickstart CLI for Web3Modal from WalletConnect
npx create-wc-dapp@latest -y web3modal
cd web3modal
yarn dev
We are using the -y flag to skip the interactive prompts and use the default values. You can pass in your own values if you wish or run this command without the -y flag to be prompted for each value. You can also pass in the -h flag to see the available options.
The default values are as follows:
| Option | Description | Value |
|---|---|---|
| Template | Template to use for the project | nextjs |
| Package Manager | Package manager to use for the project | yarn |
| Library | Library to use for the project. [Wagmi/Ethers] | wagmi |
| Install Dependencies | Whether to install dependencies after project creation | true |
Once the app is running, you can open it in your browser at http://localhost:3000
That's it! You now have a working dapp that can connect to wallets using Web3Modal.
What's Next?
Was this helpful?