Frontend
Node version
Node >v16.14.x is supported, although Node v18.x.x is recommended.
A .nvmrc has been provided if you use nvm. You can use this by:
Framework
The frontend runs on a Next.js server. If you're new to Next.js but know React.js, getting used to Next.js would be trivial. To get started, modify the component file at ./frontend/src/pages/index.
To learn more about Next.js, read their docs.
Environment variables
Before you start, you need to setup the environment variables. Look at the .env.example to know what to setup. Env variables required are:
Note, all env variable names which are supposed to be exposed used in client requests should be prefixed with NEXT_PUBLIC_.
Connecting wallet
To connect user wallets, Web3Modal v3 has been integrated and pre-configured for you.
Use the provided useWallet hook to interact with Web3Modal and wallets. This contains utilities to simplify anything you need related to wallets.
Sending transactions to smart contracts
To send transactions to either a locally deployed smart contract or a smart contract on a prod chain, use the useSmartContract hook. This contains utilities to simplify getting and interacting with a Ethers.js contract instance.
When deploying to local or production, this hook will automatically use the correct chain and contracts.
Deploying to local test server
The dev command automates everything for you to setup a local Next.js test server.
Deploying to Vercel
To deploy this, follow the Deploying guide.
With the deploy command, the Frontend deployment is fully automated. Vercel is used for deployments. Vercel offers free quotas to developers to get started.
No pre-configuration is necessary to run the deploy command. You'll be taken through all relevant steps upon running it.
Last updated