Welcome to the Donation Demo tutorial — a complete, step-by-step guide showing how to build a full-stack decentralized application (dApp) on the Casper Network using modern tools from the CSPR Suite.
By the end of this tutorial, you will learn how to:
- Build a React frontend with wallet connection using CSPR.click
- Write an Odra smart contract that accepts donations
- Use CSPR.cloud to index blockchain events
- Build a Node.js backend that consumes events and exposes a REST API
- Combine everything into a clean full-stack Casper dApp
This tutorial is designed for ecosystem developers who want to learn how to structure real Casper applications by following a working, fully functional example.
Try the demo live:
https://donation-demo.casper.network
Explore the app, send a tip, and see how all components come together before diving into the implementation.
This tutorial is divided into five comprehensive parts:
Get an overview of the Casper ecosystem, the tools you'll use, and the architecture of a modern Casper dApp. Learn about the different components and how they work together.
Create a modern React application with wallet integration using the CSPR.click template. Learn how to connect multiple wallets, manage user authentication, and customize the UI.
Master the Casper transaction model. Learn how to construct deploys, estimate gas costs, sign transactions with connected wallets, and handle transaction submission.
Build your first Casper smart contract using the Odra framework. Learn about storage patterns, events, error handling, and testing. Deploy and verify your contract on the network.
Create a Node.js backend that listens to blockchain events in real-time using CSPR.cloud. Learn how to process events, store data, and expose a REST API for your frontend.
Join Casper Developers Telegram channel to connect with other developers.
Ready to build? Let's get started with
👉 Part 1: Introduction to Building Casper dApps