Next gen SocialFi app on Vara redefining how creators connect, engage, and monetize their content.
- 📝 Create Posts: Share your thoughts with up to 500 characters
- 💬 Comments & Replies: Engage in conversations with nested comment threads
- 👍 Upvote System: Show appreciation for posts and comments
- 💰 $VIBES Rewards: Earn tokens for your activity:
- 50 $VIBES for creating a post
- 25 $VIBES for commenting
- 10 $VIBES for upvoting posts/comments
- 👤 User Profiles: Customize your profile with username, handle, avatar, and bio
- 🖼️ Image Support: Upload images to posts and comments via IPFS
- 📊 Leaderboard: Track your $VIBES earnings and activity stats
- 🔐 Wallet Integration: Connect with Polkadot.js extension
┌─────────────────────────────────────────────────────────────┐
│ Frontend (React) │
│ ┌──────────────┐ ┌──────────────┐ ┌──────────────┐ │
│ │ Posts UI │ │ Comments UI │ │ Profile UI │ │
│ └──────────────┘ └──────────────┘ └──────────────┘ │
│ │
│ ┌────────────────────────────────────────────────────┐ │
│ │ @gear-js/api + Sails Client │ │
│ └────────────────────────────────────────────────────┘ │
└───────────────────────┬─────────────────────────────────────┘
│
▼
┌─────────────────────────────────────────────────────────────┐
│ Vara Network (Blockchain) │
│ ┌──────────────────────────────────────────────────────┐ │
│ │ Lumio Social Smart Contract (Rust/Sails) │ │
│ │ ┌──────────────┐ ┌──────────────┐ ┌──────────┐ │ │
│ │ │ MiniReddit │ │ Session │ │ State │ │ │
│ │ │ Service │ │ Service │ │ Query │ │ │
│ │ └──────────────┘ └──────────────┘ └──────────┘ │ │
│ └──────────────────────────────────────────────────────┘ │
└───────────────────────┬─────────────────────────────────────┘
│
▼
┌─────────────────────────────────────────────────────────────┐
│ IPFS (Pinata) │
│ Image Storage & Retrieval │
└─────────────────────────────────────────────────────────────┘
- Rust with Sails Framework (v0.8.0)
- Gear Protocol for blockchain execution
- Session Service for signless transactions (optional)
- React 19 with TypeScript
- Vite for fast builds
- SCSS for styling
- @gear-js/api for blockchain interaction
- Sails Client for type-safe contract calls
- IPFS/Pinata for image storage
lumio-social/
├── app/ # Smart contract (Sails)
│ ├── src/lib.rs # Main contract logic
│ └── Cargo.toml
├── client/ # Generated TypeScript client
├── frontend/ # React frontend
│ ├── src/
│ │ ├── pages/ # Page components
│ │ ├── components/ # Reusable components
│ │ └── utils/ # Utilities (IPFS, etc.)
│ └── package.json
├── target
├── ...
└── wasm32-gear
└── release
├── lumio-social.wasm <---- this is our built .wasm file
├── lumio-social.opt.wasm <---- this is optimized .wasm file
└── lumio-social.idl <---- this is our application interface .idl file
└── Cargo.toml # Workspace configuration
- Rust (1.91+)
- Node.js (18+)
- Polkadot.js Extension (for wallet)
git clone https://github.com/yourusername/lumio-social.git
cd lumio-social# Build the contract
cargo build --release
# Output files:
#wasm32-gear
└── release
├── lumio-social.wasm <---- this is our built .wasm file
├── lumio-social.opt.wasm <---- this is optimized .wasm file
└── lumio-social.idl <---- this is our application interface .idl file- Go to Gear IDEA
- Connect your wallet
- Upload
target/wasm32-gear/release/lumio-social.opt.wasm - Copy the Program ID
cd frontend
# Install dependencies
npm install
# Create .env file
cat > .env << EOF
VITE_NODE_ADDRESS=wss://testnet.vara.network
VITE_PROGRAM_ID=0x...your_program_id_here
VITE_PINATA_API_KEY=your_pinata_api_key
VITE_PINATA_SECRET_KEY=your_pinata_secret_key
VITE_PINATA_JWT=your_pinata_jwt
VITE_PINATA_GATEWAY=https://gateway.pinata.cloud/ipfs/
EOF
# Start development server
npm run dev- Import Project to Vercel
- Set Root Directory:
frontend - Add Environment Variables:
VITE_PROGRAM_ID=0x0617121506174a7eb159967337d86488e68fafa085d697c2577b98e3b5d93398VITE_NODE_ADDRESS=wss://testnet.vara.networkVITE_NODE_ADDRESSVITE_PROGRAM_IDVITE_PINATA_API_KEYVITE_PINATA_SECRET_KEYVITE_PINATA_JWTVITE_PINATA_GATEWAY
- Deploy
See VERCEL_DEPLOYMENT.md for detailed instructions.
- User writes post (max 500 chars) and optionally uploads image
- Image uploaded to IPFS via Pinata
- Transaction sent to Lumio Social contract
- Contract validates and stores post
- User earns 50 $VIBES (tracked locally)
- Post appears in feed
- Users can comment on posts
- Nested replies supported (unlimited depth)
- Each comment earns 25 $VIBES
- Upvoting comments earns 10 $VIBES
- Customizable username, handle, avatar, and bio
- Profiles stored on-chain
- Avatar images stored on IPFS
- Profile data displayed in posts and comments
- Posts: 50 $VIBES per post
- Comments: 25 $VIBES per comment
- Upvotes: 10 $VIBES per upvote (posts or comments)
- Rewards tracked locally per user per contract deployment
createPost(text, image_uri, session_for_account)- Create a new posttoggleUpvote(post_id, session_for_account)- Toggle upvote on postcreateComment(post_id, parent_id, text, image_uri, session_for_account)- Add commenttoggleCommentUpvote(comment_id, session_for_account)- Toggle comment upvoteupdateProfile(username, social_handle, description, avatar_uri, session_for_account)- Update profilegetAllPosts()- Query all postsgetCommentsForPost(post_id)- Query comments for a postgetProfile(wallet)- Query user profilegetVibesBalance(wallet)- Query user's vibes balance
createSession(signature_data, signature)- Create signless sessiondeleteSessionFromAccount()- Delete user's sessionsessionForTheAccount(account)- Query session data
- ✅ Input validation (text length limits)
- ✅ Overflow protection
- ✅ One vote per user enforcement
- ✅ Immutable post/comment content
- ✅ Session-based authorization (optional)
- ✅ IPFS content addressing
MIT
Contributions are welcome! Please feel free to submit a Pull Request.
Built with ❤️ on Vara Network
Note: This project uses the Sails framework for automatic IDL generation and optimized WASM builds.