# Start from Scaffold-ETH 2 (/docs/start/scaffold-eth)



[Scaffold-ETH 2](https://scaffoldeth.io) is a starter kit for Ethereum dApps. Domino's extension for it adds wallet sign-in, a **Quests** tab, a **Leaderboard** tab and a sample quest, **Set a greeting**, which pays points once a member calls `setGreeting` on the example contract.

The app runs on your machine at `http://localhost:3000` against real Domino, in your project's **Test** environment.

```mermaid
sequenceDiagram
    actor Member
    participant App as Your SE-2 app
    participant Domino
    participant Sepolia
    Member->>App: Connects a wallet and signs in
    App->>Domino: Signs the member in under that wallet
    Member->>Sepolia: Calls setGreeting on YourContract
    Member->>App: Presses Check on the quest
    App->>Domino: Checks the quest
    Domino->>Sepolia: Reads GreetingChange events from the member's wallet
    Domino-->>App: Points awarded
```

## Before you start [#before-you-start]

* **Node.js 24**, which Domino's SDK and CLI need, and Git.
* **A Domino project.** Create one in [Console](https://console.domino.run) with the existing-app path.
* **Sepolia ETH** for deploying the example contract and calling it.

## 1. Create the app [#1-create-the-app]

```sh
npx create-eth@latest -e GetDomino/scaffold-domino
```

Choose Hardhat or Foundry. Besides Scaffold-ETH 2's own files, the app has:

| Part                                                    | Where                                                             |
| ------------------------------------------------------- | ----------------------------------------------------------------- |
| Wallet sign-in (Sign-In with Ethereum)                  | `packages/nextjs/app/api/wallet/`                                 |
| Domino's participant API for the browser                | `packages/nextjs/app/relay/[...path]/route.ts`                    |
| Quests and Leaderboard tabs                             | `packages/nextjs/app/quests/`, `packages/nextjs/app/leaderboard/` |
| The sample quest, the points ledger and the leaderboard | `packages/nextjs/domino/`                                         |
| Domino project settings                                 | `packages/nextjs/relay.json`                                      |
| A Domino skill for coding agents                        | `.agents/skills/domino/SKILL.md`, listed in `AGENTS.md`           |

Sepolia joins the local chain in `scaffold.config.ts`: Domino reads public chains, not Hardhat's or Anvil's local chain. Scaffold-ETH 2 shows its burner wallet only when every target network is local, so with Sepolia added, connect a wallet such as MetaMask instead.

## 2. Connect your Domino project [#2-connect-your-domino-project]

```sh
cd my-dapp-example
yarn domino login
yarn domino whoami
```

Set `organization` and `project` in `packages/nextjs/relay.json` to the IDs `whoami` lists. Until you do, `yarn domino:deploy` refuses and names the file to change.

## 3. Create an app login key [#3-create-an-app-login-key]

1. In Console, open **Settings → App login keys** in **Test** and create a key with `http://localhost:3000` as its origin.
2. Under **Connected apps**, choose **Allow vouching** on the key, give a reason, and confirm. Domino then attaches the wallet each member signs in with, which the quest reads. This needs an organization admin with **Publish** permission.
3. Copy `packages/nextjs/.env.example` to `packages/nextjs/.env.local` and fill in the Domino variables:

| Variable               | Value                                                                                                         |
| ---------------------- | ------------------------------------------------------------------------------------------------------------- |
| `DOMINO_APP_LOGIN_KEY` | The app login key, starting `di_`                                                                             |
| `DOMINO_APP_ORIGIN`    | The app's exact address, the one the key names. Leave it empty for `http://localhost:3000` under `yarn start` |
| `IRON_SESSION_SECRET`  | 32 or more random characters, such as the output of `openssl rand -base64 32`. Required in production         |

> [!NOTE] Each address needs its own key
> A key for `http://localhost:3000` refuses the app on another port or address. For a hosted app, create a key for its HTTPS address and set `DOMINO_APP_ORIGIN` to it. [Develop on localhost](/docs/build/self-hosted-wallet-sign-in#develop-on-localhost) lists the rules.

## 4. Deploy the contract and publish the quest [#4-deploy-the-contract-and-publish-the-quest]

```sh
yarn generate
yarn deploy --network sepolia
yarn domino:deploy
```

Fund the deployer account `yarn generate` creates with Sepolia ETH before deploying. `yarn deploy` records YourContract's Sepolia address in `packages/nextjs/contracts/deployedContracts.ts`, and **Set a greeting** reads it from there. `yarn domino:deploy` then publishes the quest, the **Points** ledger and its leaderboard to **Test**.

Deploy the contract first: until YourContract is on Sepolia, the quest names an address with no contract, and Domino refuses to publish it.

## 5. Complete the quest [#5-complete-the-quest]

1. Run `yarn start` and open `http://localhost:3000/quests`.
2. Connect your wallet and choose **Sign in with Ethereum**.
3. Switch the app to Sepolia, open **Debug Contracts**, and call `setGreeting` on YourContract.
4. Back on **Quests**, press **Check** on **Set a greeting**.

Domino counts a transaction once its block is finalized, about 13 minutes on Sepolia, so the first check may ask you to try again later. Once it passes, 100 points show on **Quests** and on **Leaderboard**.

> [!DEV] How the pieces fit
> The verify route checks the signed message with `verifyWalletSignIn` and keeps the wallet in an `iron-session` cookie, as [wallet sign-in in your own Next.js app](/docs/build/self-hosted-wallet-sign-in) describes. The `/relay` route is `createParticipantBackend`; its `authenticate` returns the wallet as the member's subject and vouches for it. The quest calls `ctx.wallet.events()` for `GreetingChange(address indexed greetingSetter, …)`, as in [check on-chain actions](/docs/build/wallets#check-on-chain-actions). Domino's `useAccount` from `@domino-sdk/relay/react` shares its name with wagmi's, so import it under another name.

## Add your own quests [#add-your-own-quests]

Add quest files under `packages/nextjs/domino/quests/` and publish them with `yarn domino:deploy`. The app's agent skill, `.agents/skills/domino/SKILL.md`, tells coding agents where everything is and what Domino reads; `yarn domino agents install` adds Domino's full guide for them.

## Where next [#where-next]

- [Wallets](/docs/build/wallets) — every onchain check a quest can make: events, contract reads, balances and NFTs.
- [Wallet sign-in in your own Next.js app](/docs/build/self-hosted-wallet-sign-in) — the sign-in this app uses, and paying prizes to members' wallets.
- [Leaderboards](/docs/build/leaderboards) — boards, seasons and payout lists.
