Backstage

This project is a Next.js-based web application that creates a "Patreon for Creator Coins" experience, enabling creators to monetize content through blockchain-based token ownership on the Zora protocol.

Core Functionality:

For Creators:

• Upload and manage digital content (currently images only) to IPFS via Pinata
• Create token-gated access controls tied to their Zora creator coins
• Set minimum token ownership requirements for content access
• View analytics on their coin holders and supporters
• Manage multiple creator coins from a unified dashboard

For Supporters/Fans:

• Access exclusive content based on coin ownership levels
• Browse creator profiles and discover new creators
• Track their coin portfolios and supported creators
• Purchase your favorite creator's coins using fiat

Technical Architecture:

Frontend: Built with Next.js 15, TypeScript, and TailwindCSS, featuring a responsive design with sidebar navigation and mobile-optimized layouts.

Authentication: Integrates Privy for wallet-based authentication, supporting external wallets and cross-app wallet linking with Zora.

Blockchain Integration: Uses the Zora Coins SDK to interact with creator coins, check balances, and verify ownership for content access.

Content Storage: Files are encrypted and stored on IPFS via Pinata, with metadata stored in a PostgreSQL database using Prisma ORM

Access Control: Implements sophisticated token-gating where files are stored encrypted on IPFS and only decrypted when ACL (Access Control List) conditions are met. The system verifies users' creator coin holdings against the minimum token requirements set by creators before providing decryption access, ensuring content remains secure even if IPFS links are discovered.

Key Features:

• Infinite scroll content feeds
• Real-time balance checking and coin portfolio management
• Creator discovery through top creators showcase
• Wallet management for both primary and Zora wallets
• Secure file upload with encryption and conditional decryption

This platform essentially bridges traditional content creator monetization models with Web3 token economics, allowing creators to build sustainable revenue streams through their community's token ownership while providing supporters with exclusive access and direct creator support mechanisms through cryptographically secured content access.

Core Tech Stack:

• Frontend: Next.js 15 with App Router, TypeScript, TailwindCSS
• Authentication: Privy with cross-app wallet linking
• Database: PostgreSQL with Prisma ORM
• File Storage: IPFS via Pinata API
• Blockchain: Zora protocol integration, Ethers.js for contract interactions
• Encryption: Node.js crypto (AES-128-CBC)
• Purchase creator coins with fiat powered by Coinbase Onramp API.

Key Architecture Decisions:

1. Token-Gated Encryption System We implemented a content access control system where files are encrypted before IPFS upload using AES-128-CBC. The decryption endpoint at /api/decrypt-image/[cid] only serves decrypted content after verifying the user owns sufficient creator coins. This ensures content remains secure even if IPFS CIDs are discovered.

2. Zora Cross-App Wallet Integration Used Privy's cross-app account linking to connect their Backstage embedded wallets with their Zora wallets. We hit a challenge: Zora's smart wallet addresses weren't consistently available through the Privy SDK. Our solution was to create a custom database table (wallet_links) that stores the mapping between primary wallets and Zora smart wallets, with raw SQL queries for reliability.

3. Multi-Source Balance Verification Zora's SDK provides coin discovery through getProfileBalances() but doesn't guarantee real-time accuracy or handle all edge cases. To ensure precise access control, we implemented direct blockchain verification using Ethers.js contracts on Base network (via LlamaRPC). For each coin returned by the SDK, we make direct balanceOf(), decimals(), and owners() contract calls to verify the user's actual token holdings and creator status. This dual-layer approach ensures our token-gating is based on live blockchain data rather than potentially stale API responses, critical for secure content access.

4. Creator Coin Purchase with Fiat We used Coinbase onramp API to allow users to purchase USDC with fiat and Zora's coin SDK to purchase creator coins with USDC, enabling a seamless experience.

Notable Hacks & Workarounds:

1. Cross-App Wallet Address Extraction Privy's cross-app wallet data structure was inconsistent. We created a robust address extraction function that tries multiple possible object properties and even parses wallet addresses from subject strings using regex.

2. Raw SQL for Wallet Linking Used Prisma's $queryRaw and $executeRaw for wallet linking operations because the relationship between primary and Zora wallets needed custom table structure that didn't fit standard Prisma models.

3. Contract Owner Detection To distinguish creators from supporters, we call the owners() function on coin contracts directly rather than relying on API metadata, ensuring accurate creator identification.

Partner Technology Benefits:

• Privy: Simplified wallet authentication and cross-app linking
• Zora: Provided the creator coin infrastructure and GraphQL API
• Pinata: Reliable IPFS pinning with authenticated gateways

The most challenging aspect was bridging the gap between Zora's creator economy and secure content delivery - requiring custom encryption, multi-source balance verification, and robust wallet address handling across different authentication systems.