Summary of "Re{solve} Hackathon Workshop: Build Starknet dApps Fast with Scaffold Stark"

This workshop focuses on building decentralized applications (dApps) quickly on Starknet using the Scaffold Stark framework, ideal for hackathon participants and developers aiming for rapid MVP development.

Key Technological Concepts & Product Features

Scaffold Stark Overview:
- Scaffold Stark is a comprehensive development framework designed to accelerate dApp development on Starknet.
- It integrates smart contract development tools, front-end libraries, and deployment utilities into a single, ready-to-use project scaffold.
- Inspired by similar frameworks like Scaffold-Eth but tailored for Starknet.
Stack Components:
- StarknetJS: The low-level JavaScript client library for interacting with Starknet blockchain.
- Starknet React: A ReactJS library built on StarknetJS providing React hooks for blockchain interactions (read, write, connect wallet, event listening).
- Scaffold Stark: Built on top of Starknet React, it bundles everything needed (Next.js frontend, contract tools, deployment scripts) for rapid development.
Smart Contract Development:
- Uses Starknet Foundry for contract compilation, testing, and deployment.
- Comes with pre-built sample contracts and tests.
- Deployment is simplified via commands (yarn deploy) that deploy all contracts automatically.
- Supports local development with a devnet (yarn chain) and supports latest Starknet versions and RPCs.
- Supports chain forking from mainnet and testnets (e.g., Sepolia) to integrate external contracts without source code cloning.
Frontend Development:
- Next.js app scaffolded with pre-installed Starknet frontend tools.
- Provides React hooks and UI components (including TailwindCSS and DaisyUI) for common dApp features like wallet connection, address display, balance, and contract interaction.
- Auto-syncs deployed contract ABIs to frontend, enabling immediate interaction without manual configuration.
- Debug UI allows live testing of contract functions directly from the frontend.
- Supports multi-call transactions bundled into a single signing event, improving user experience by reducing multiple transaction approvals into one.
Features for Faster Development:
- One command scaffolding (npx create-Starknet-app@latest) to bootstrap projects with all dependencies and configuration.
- Extensions system to pre-integrate features like indexing servers for easier setup.
- Devnet block explorer for tracking local blockchain transactions similar to StarkScan or Voyager.
- Debug UI adapts automatically to contract changes for rapid feedback loops.
- Type-safe hooks with autocomplete support for contract names and functions, reducing runtime errors.
- Support for multiple wallets (e.g., Argent/Ready Wallet) integrated out of the box.
Commands and Workflow:
- yarn chain - runs local devnet.
- yarn deploy - deploys smart contracts.
- yarn start - runs frontend.
- Configuration via scaffold.config.js to switch networks (Devnet, Sepolia, Mainnet).
- Environment variables for private keys and RPC URLs for deployment to testnet or mainnet.
Developer Experience Enhancements:
- Debug UI for contract function testing.
- Auto ABI sync to frontend.
- Multi-call transactions for better UX.
- Pre-provided burner wallets with test tokens for easy testing.
- Helpful error catching early in development with type-safe hooks.
- Support for React stateful components and Next.js features.

Tutorial / Guide Highlights

How to scaffold a new project with a single command.
Running a local devnet for contract development.
Deploying smart contracts to local devnet, Sepolia, or mainnet with minimal configuration.
Using debug UI to interact with contracts.
Writing frontend React components that read from and write to contracts using Scaffold Stark hooks.
Demonstrating multi-call transactions to bundle approve and write operations in one transaction.
Switching networks and connecting wallets.
Using TailwindCSS and DaisyUI for UI styling.
Handling common errors and environment setup tips (Node.js version management with nvm, installing dependencies).

Additional Notes

Workshop is part of the Re{solve} Hackathon, with over $45,000 in prizes.
Encouragement to join the Telegram support channel for help.
Upcoming related workshops and hackathon kickoff details shared.
Recording available for later viewing.

Main Speakers / Sources

Robert: Host and moderator, introduced the session and provided hackathon context.
Rick: Core maintainer of Scaffold Stark, main presenter who demonstrated the framework, explained features, and walked through coding examples.