We’re back with another dose of dev progress. This week’s highlight? You can now play the game right in the browser via our demo Storybook — no need to integrate anything just yet.

After last week’s layout and styling adventures, we wrapped the entire game flow into two clean exports:

• A single hook: usePlaceBet

• A React component: <CoinTossGame />

All the on-chain complexity — randomness, wallet checks, error handling, event listening — is baked in. Just import and go.

Here's all it takes to wire up the game component in your app:

const config = createConfig({
  chains: [base],
  transports: { [base.id]: http() },
})

export function CoinTossGamePage() {
  return (
    <WagmiProvider config={config}>
      <QueryClientProvider client={new QueryClient()}>
        <OnchainKitProvider chain={base}>
          <BettingConfigProvider value={{ affiliate: "0x0" }}>
            <CoinTossGame />
          </BettingConfigProvider>
        </OnchainKitProvider>
      </QueryClientProvider>
    </WagmiProvider>
  )
}

That’s it. If your wallet is connected, you can play. If not, OnchainKit handles it.

• Most stable: Desktop browsers with browser wallets (e.g. Coinbase Wallet, MetaMask)

• Mobile: Coming soon — we’re starting Farcaster Frame support!

• Also keeping an eye on Base minikit — hoping to plug into that as well.

In the coming week:

• 📦 Publish the first npm package for easy component installs

• 🎨 Polish token selection and mobile layout

• Begin Farcaster frame integration using Base minikit

The component is real, live, and working—no mockups. And it’s not just for meme sites. Anyone building with on-chain vibes can plug this in and start earning from gameplay.

More soon!

We’re back with another dose of dev progress. This week’s highlight? You can now play the game right in the browser via our demo Storybook — no need to integrate anything just yet.

After last week’s layout and styling adventures, we wrapped the entire game flow into two clean exports:

• A single hook: usePlaceBet

• A React component: <CoinTossGame />

All the on-chain complexity — randomness, wallet checks, error handling, event listening — is baked in. Just import and go.

Here's all it takes to wire up the game component in your app:

const config = createConfig({
  chains: [base],
  transports: { [base.id]: http() },
})

export function CoinTossGamePage() {
  return (
    <WagmiProvider config={config}>
      <QueryClientProvider client={new QueryClient()}>
        <OnchainKitProvider chain={base}>
          <BettingConfigProvider value={{ affiliate: "0x0" }}>
            <CoinTossGame />
          </BettingConfigProvider>
        </OnchainKitProvider>
      </QueryClientProvider>
    </WagmiProvider>
  )
}

That’s it. If your wallet is connected, you can play. If not, OnchainKit handles it.

• Most stable: Desktop browsers with browser wallets (e.g. Coinbase Wallet, MetaMask)

• Mobile: Coming soon — we’re starting Farcaster Frame support!

• Also keeping an eye on Base minikit — hoping to plug into that as well.

In the coming week:

• 📦 Publish the first npm package for easy component installs

• 🎨 Polish token selection and mobile layout

• Begin Farcaster frame integration using Base minikit

The component is real, live, and working—no mockups. And it’s not just for meme sites. Anyone building with on-chain vibes can plug this in and start earning from gameplay.

More soon!