Built 99% vibe-coded with the help of Claude Sonnet 4 ✨
Welcome to DAVINCI UI PoC, a proof-of-concept interface for the coolest decentralized voting platform on the block(chain)! 🚀 This PoC UI was created via vibe-coding with Claude Sonnet and is a React-based Progressive Web App that makes voting as smooth as butter and as secure as Fort Knox.
DAVINCI is a decentralized voting protocol by Vocdoni that brings democracy to the digital age. Whether you're running a DAO, organizing community decisions, or just want to settle the eternal debate of "pineapple on pizza" 🍍🍕, DAVINCI has got you covered!
🔗 Check it out live: https://davinci.vote/
📖 Read our whitepaper: https://whitepaper.vocdoni.io/
- 🏗️ Decentralized & Trustless: No central authority needed
- 📱 Progressive Web App: Works offline and feels native
- 🎭 Farcaster Integration: Vote directly from Farcaster MiniApps
- 🌈 Beautiful UI: Custom design system with Tailwind CSS
- 🔐 Web3 Ready: Seamless wallet connections with WalletConnect
- ⚡ Lightning Fast: Built with Vite for optimal performance
- 🎨 Accessible: Radix UI components for everyone
- 🗳️ Flexible Voting Methods: The UI currently supports Single Choice, Multiple Choice, Quadratic Voting, and Weighted Voting.
- 🧾 Diverse Census Types: The UI currently allows the creation of votes with eligible voters composed of active Ethereum wallets, ENS-based identities, and DAOs like The Haberdashery and The Yellow Collective.
- Node.js 18+
- pnpm (because we're fancy like that) 💅
# Clone this beauty
git clone https://github.com/vocdoni/davinci-ui.git
cd davinci-ui
# Install dependencies
pnpm install
# Fire it up! 🔥
pnpm dev# Development server (with hot reload magic ✨)
pnpm dev
# Build for production (make it production-ready 🏭)
pnpm build
# Preview production build (test drive your masterpiece 🏎️)
pnpm preview
# Lint your code (keep it clean! 🧹)
pnpm lintThis project is powered by some seriously cool tech:
- ⚛️ React 18 - The UI library we all love
- 🔷 TypeScript - Type safety for the win
- ⚡ Vite - Lightning-fast build tool
- 🎨 Tailwind CSS - Utility-first styling
- 🧩 Radix UI - Accessible component primitives
- 🔗 React Router - Client-side routing
- 🗄️ TanStack Query - Server state management
- 🌐 Ethers.js - Ethereum interactions
- 🔌 Reown AppKit - Wallet connections
- 📱 Farcaster SDK - MiniApp integration
src/
├── 📄 pages/ # Main application pages
├── 🧩 components/ # Reusable components
│ └── ui/ # Design system components
├── 🪝 hooks/ # Custom React hooks
├── 🌍 contexts/ # React contexts
├── 📚 lib/ # Utility libraries
├── 🛠️ utils/ # Helper functions
└── 🎨 styles/ # Global styles
We've built a custom design system with:
- 🎨 Custom color palette (
davinci-*colors) - 📝 Two beautiful fonts: Work Sans & Averia Libre
- 📱 Mobile-first responsive design
- 🌓 Dark/light theme support
- 🤖 Base layout/mockup created by v0 AI
DAVINCI plays nicely with the blockchain:
- 💰 Multi-wallet support via Reown AppKit
- 🔐 Secure transaction signing
- 📊 Real-time vote tracking
- 🌐 Cross-chain compatibility
Found a bug? Have a feature request? Want to chat about the meaning of life?
This project is licensed under the GNU Affero General Public License v3.0 - see the LICENSE file for details.
- 🎭 Vocdoni Team - For building the amazing protocol
- 🤖 Claude Sonnet 4 - For the vibe-coding assistance
- 🌍 Open Source Community - For all the amazing tools
- ☕ Coffee - For keeping us awake during late-night coding sessions
Made with ❤️ by the Vocdoni team
Democracy is not a spectator sport. Get involved, vote, and make your voice heard! 🗣️✊