A step-by-step developer tutorial that guides you through building a fully-functional dad joke dApp with Next.js, Tailwind CSS, a smart contract, and Viem, and deploying it on Sepolia.
➜ npx create-next-app@latest
Need to install the following packages:
[email protected]
Ok to proceed? (y) y
✔ What is your project named? … dad-jokes
✔ Would you like to use TypeScript? … No / Yes
✔ Would you like to use ESLint? … No / Yes
✔ Would you like to use Tailwind CSS? … No / Yes
✔ Would you like to use `src/` directory? … No / Yes
✔ Would you like to use App Router? (recommended) … No / Yes
✔ Would you like to customize the default import alias (@/*)? … No / Yes
Creating a new Next.js app in /home/chyiyaqing/chyi/github/DadJokesDApp/dad-jokes.
Using npm.
Initializing project with template: app-tw
Installing dependencies:
- react
- react-dom
- next
Installing devDependencies:
- typescript
- @types/node
- @types/react
- @types/react-dom
- postcss
- tailwindcss
- eslint
- eslint-config-next
$ cd dad-jokes
$ npm run dev
# viem: Build reliable apps & libraries with lightweight composable, and type-safe modules that interface with Etherem.
$ npm install viem
abi.json DadJoke Contract Address: 0x2683167d86c33B45cc05ae94a834a29E967Ece70
1. cd dad-jokes
2. npm run dev