Stacks Wallet dApp

A Stacks blockchain dApp demonstrating wallet connection, STX transfers, and smart contract interactions using @stacks/connect and @stacks/transactions.

Built by rajuice for the Stacks Builder Rewards campaign.

🚀 Features

• Wallet Connection - Connect with Leather, Xverse, or any Stacks wallet
• STX Transfers - Send STX to any address
• SIP-010 Token Operations - Check balance, mint tokens
• SIP-009 NFT Minting - Mint NFTs from your collection
• Staking Pool - Stake, unstake, and claim rewards
• DAO Voting - Create and vote on proposals

📦 Packages Used

• @stacks/connect - Wallet connection and authentication
• @stacks/transactions - Transaction building and signing
• @stacks/network - Network configuration

🛠️ Installation

# Clone the repository
git clone https://github.com/Dark-Brain07/stacks-wallet-dapp.git
cd stacks-wallet-dapp

# Install dependencies
npm install

# Start development server
npm run dev

📁 Project Structure

stacks-wallet-dapp/
├── index.html          # Main HTML file
├── style.css           # Styles
├── src/
│   ├── main.js         # App entry point & event handlers
│   └── stacks.js       # Stacks blockchain utilities
├── package.json        # Dependencies
└── README.md

🔧 Usage

Connect Wallet

import { connectWallet, getStxAddress } from './src/stacks.js';

connectWallet(
  (userData) => console.log('Connected:', getStxAddress()),
  () => console.log('Cancelled')
);

Transfer STX

import { transferSTX } from './src/stacks.js';

await transferSTX('ST1PQHQKV0RJXZFY1DGX8MNSNYVE3VGZJSRTPGZGM', 10);

Read Contract Data

import { readContract } from './src/stacks.js';
import { principalCV } from '@stacks/transactions';

const balance = await readContract(
  'ST1PQHQKV0RJXZFY1DGX8MNSNYVE3VGZJSRTPGZGM',
  'sip010-token',
  'get-balance',
  [principalCV('ST1PQHQKV0RJXZFY1DGX8MNSNYVE3VGZJSRTPGZGM')]
);

Call Contract Function

import { callContract } from './src/stacks.js';
import { uintCV } from '@stacks/transactions';

await callContract(
  'ST1PQHQKV0RJXZFY1DGX8MNSNYVE3VGZJSRTPGZGM',
  'staking-pool',
  'stake',
  [uintCV(1000000)]
);

🎨 Screenshots

The dApp features a modern dark theme with:

• Glassmorphism effects
• Gradient accents
• Smooth animations
• Responsive design

🔗 Related Contracts

This dApp is designed to work with the contracts in:

• stacks-builder-contracts

📜 License

MIT License

🤝 Contributing

Contributions are welcome! Please feel free to submit a Pull Request.

---

Built with ❤️ for the Stacks ecosystem using @stacks/connect and @stacks/transactions