The React frontend for AryaFund, a decentralized crowdfunding dApp built on the Stellar network.
The home page as seen by a first-time visitor with no wallet connected. Campaign cards are visible and browsable without needing to connect a wallet.
Clicking the Connect Wallet button opens the Stellar Wallets Kit modal, showing all supported wallets — Freighter, Albedo, xBull, Rabet, and LOBSTR.
The home page after successfully connecting a wallet. The connected address is displayed in the top right corner.
The campaign creation form where organizers can set a title, description, funding goal, deadline, and extension days.
A campaign that is active, goal has not been met and the deadline has not passed. The donate form is available and users can donate by typing the amount they want to donate.
A campaign that has reached 100% of its funding goal. The donate form is replaced with a Goal Reached message, and the organizer can now withdraw funds from their dashboard.
A campaign that has reached 100% of its funding goal. The donate form is replaced with a Campaign Successful message, which means that funds have been withdrawn by the organizer.
The organizer dashboard when the connected wallet has not yet created any campaigns.
The organizer dashboard when the connected wallet has created one or more campaigns.
The admin page when the user has not yet connected their wallet. It prompts the user to connect their wallet to access the admin panel.
The admin page when accessed by a wallet that is not the platform owner. Access is restricted to protect platform settings.
The admin page when accessed by the platform owner's wallet. It shows the Platform Settings card - which shows the settings that the platform owner can update. It also shows the All Campaigns card - which shows all the campaigns on the platform.
| Tool | Purpose |
|---|---|
| React 19 + Vite | UI framework and build tool |
| React Router v7 | Client-side routing |
@stellar/stellar-sdk |
Soroban contract interaction |
@creit-tech/stellar-wallets-kit |
Multi-wallet connection (Freighter, Albedo, xBull, Rabet, LOBSTR) |
| CSS Modules | Component-scoped styling |
| Inter + JetBrains Mono | Typography |
| Property | Value |
|---|---|
| Network | Stellar Testnet |
| Contract Address | CD5LOATI5SDME7GQXRBVSZIG3DZL4NRYD4663GM7PLPY252L2RGPOFTL |
| Deploy TX | 95478ead278154ae67b279cdce1492715f2e37079d5ed41253710dbc017e2ab6 |
| Action | Transaction |
|---|---|
| Create Campaign (1000 XLM goal) | aed99ba9... |
| Donate 120 XLM | ca0e0fd7... |
| Donate 500 XLM | 970d73e8... |
| Donate 80 XLM | 98020ff7... |
| Donate 300 XLM | 27c954cd... |
| Update Fee to 2% | 4586967e... |
| Update Action Window to 5 days | 4f4691ed... |
| Route | Description |
|---|---|
/ |
Browse all campaigns with status filters |
/campaign/:id |
Campaign detail, donate, claim refund |
/create |
Create a new campaign |
/dashboard |
Manage your own campaigns (withdraw, extend, mark failed) |
/admin |
Platform owner settings (fee, treasury, action window) |
- Node.js
v22+ - A Stellar wallet extension (Freighter recommended for testnet)
npm installnpm run devOpens at http://localhost:5173
npm run buildNo .env file needed. All configuration is in src/contract/config.js:
import { Networks } from '@stellar/stellar-sdk'
export const CONTRACT_ID = 'CD5LOATI5SDME7GQXRBVSZIG3DZL4NRYD4663GM7PLPY252L2RGPOFTL'
export const NATIVE_TOKEN_ID = 'CDLZFC3SYJYDZT7K67VZ75HPJVIEUVNIXF47ZG2FB2RMQQVU2HHGCYSC'
export const NETWORK_PASSPHRASE = Networks.TESTNET
export const RPC_URL = 'https://soroban-testnet.stellar.org'
export const PLATFORM_OWNER = 'GBLH7QUEY43J3AJSIYPRUQKKUFX577GSYWRRQJVNFOV7MUON3YMM5IJQ'
export const READ_ACCOUNT = 'GBLH7QUEY43J3AJSIYPRUQKKUFX577GSYWRRQJVNFOV7MUON3YMM5IJQ'src/
├── contract/
│ ├── config.js # Contract address, network config
│ └── client.js # All contract function calls
│
├── hooks/
│ ├── useWallet.js # getAddress, signTransaction
│ └── useContract.js # useCampaigns, useCampaign, usePlatformSettings
│
├── utils/
│ ├── stellar.js # truncateAddress, explorerUrl
│ ├── format.js # XLM/stroops conversion, fee calculation
│ └── time.js # Unix timestamps, countdown, action window
│
├── components/
│ ├── Header/
│ ├── Footer/
│ ├── CampaignCard/
│ ├── ProgressBar/
│ ├── CountdownTimer/
│ ├── StatusBadge/
│ ├── TxStatus/
│ └── ConnectPrompt/
│
└── pages/
├── Home/
├── Campaign/
├── Create/
├── Dashboard/
└── Admin/
- Browse campaigns filtered by status (Active, Successful, Failed)
- Create campaigns with goal, deadline and extension days
- Donate XLM to active campaigns
- Auto-refund for failed campaigns — donors claim directly
- Organizer dashboard — withdraw funds, extend deadline, mark as failed
- Platform admin panel — update fee, treasury wallet, action window
- Real-time countdown timers and progress bars
- Transaction status feedback with Stellar Explorer links
- Multi-wallet support via Stellar Wallets Kit