Arbitrum Dapp Skill
by @hummusonrails
Opinionated guide for building dApps on Arbitrum using Stylus (Rust) and/or Solidity. Covers local devnode setup, contract development, testing, deployment, and React frontend integration with viem. Use when starting a new Arbitrum project, writing Stylus or Solidity contracts, deploying to Arbitrum, or building a frontend that interacts with Arbitrum contracts.
clawhub install arbitrum-dapp-skillπ About This Skill
name: arbitrum-dapp-skill description: Opinionated guide for building dApps on Arbitrum using Stylus (Rust) and/or Solidity. Covers local devnode setup, contract development, testing, deployment, and React frontend integration with viem. Use when starting a new Arbitrum project, writing Stylus or Solidity contracts, deploying to Arbitrum, or building a frontend that interacts with Arbitrum contracts.
Arbitrum dApp Development
Stack
| Layer | Tool | Notes |
|-------|------|-------|
| Smart contracts (Rust) | stylus-sdk v0.10+ | Compiled to WASM, runs on Stylus VM |
| Smart contracts (Solidity) | Solidity 0.8.x + Foundry | Standard EVM path on Arbitrum |
| Local node | nitro-devnode | Docker-based local Arbitrum chain |
| Contract CLI | cargo-stylus | Check, deploy, export-abi for Stylus |
| Contract toolchain | Foundry (forge, cast, anvil) | Build, test, deploy, interact for Solidity |
| Frontend | React / Next.js + viem + wagmi | viem for all chain interaction |
| Package manager | pnpm | Workspace-friendly, fast |
Decision Flow
When starting a new contract:
1. Need max performance / lower gas? β Stylus Rust. See references/stylus-rust-contracts.md.
2. Need broad tooling compatibility / rapid prototyping? β Solidity. See references/solidity-contracts.md.
3. Hybrid? β Use both. Stylus and Solidity contracts are fully interoperable on Arbitrum.
Project Scaffolding
Monorepo layout (recommended)
my-arbitrum-dapp/
βββ apps/
β βββ frontend/ # React / Next.js app
β βββ contracts-stylus/ # Rust Stylus contracts
β βββ contracts-solidity/ # Foundry Solidity contracts
β βββ nitro-devnode/ # Local dev chain (git submodule)
βββ pnpm-workspace.yaml
βββ package.json
Bootstrap steps
# 1. Create workspace
mkdir my-arbitrum-dapp && cd my-arbitrum-dapp
pnpm init
printf "packages:\n - 'apps/*'\n" > pnpm-workspace.yaml2. Local devnode
git clone https://github.com/OffchainLabs/nitro-devnode.git apps/nitro-devnode
cd apps/nitro-devnode && ./run-dev-node.sh && cd ../..3a. Stylus contract
cargo stylus new apps/contracts-stylus3b. Solidity contract
cd apps && forge init contracts-solidity && cd ..4. Frontend
pnpm create next-app apps/frontend --typescript
cd apps/frontend
pnpm add viem wagmi @tanstack/react-query
Core Workflow
Stylus Rust
# Validate
cargo stylus check --endpoint http://localhost:8547Deploy (uses the nitro-devnode pre-funded deployer account)
cargo stylus deploy \
--endpoint http://localhost:8547 \
--private-key $PRIVATE_KEYExport ABI for frontend consumption
cargo stylus export-abi
Solidity (Foundry)
# Build
forge buildTest
forge testDeploy locally (uses the nitro-devnode pre-funded deployer account)
forge script script/Deploy.s.sol --rpc-url http://localhost:8547 --broadcast \
--private-key $PRIVATE_KEY
> Note: The nitro-devnode ships with a pre-funded deployer account. See references/local-devnode.md for the default private key and address. For testnet/mainnet, use your own key via environment variables β never hardcode secrets.
Frontend (viem + wagmi)
import { createPublicClient, http } from "viem";
import { arbitrumSepolia } from "viem/chains";const client = createPublicClient({
chain: arbitrumSepolia,
transport: http(),
});
// Read from contract
const result = await client.readContract({
address: "0x...",
abi: contractAbi,
functionName: "myFunction",
});
See references/frontend-integration.md for full patterns with wagmi hooks, wallet connection, and write transactions.
Principles
cargo stylus export-abi) and Solidity (forge inspect) and keep them in a shared location the frontend can import.References
Load these as needed for deeper guidance:
references/stylus-rust-contracts.md β Stylus SDK patterns, storage, macros, entrypointsreferences/solidity-contracts.md β Solidity on Arbitrum specifics and Foundry workflowreferences/frontend-integration.md β React + viem + wagmi patternsreferences/local-devnode.md β Nitro devnode setup, accounts, and debuggingreferences/deployment.md β Deploying to testnet and mainnetreferences/testing.md β Testing strategies for both Stylus and Solidity