Skip to content

Examples

The IFIF protocol includes comprehensive example applications that demonstrate real-world usage patterns and best practices for building decentralized applications with role-based access control and whitelist management.

Overview

The examples showcase production-ready implementations that integrate smart contracts, real-time indexing, and modern Web3 frontend development. Each example provides complete source code, detailed documentation, and deployment guides.

Example Applications

IFIF Project Management System

A comprehensive decentralized crowdfunding platform demonstrating project creation, investment management, NFT operations, and investor relations.

Key Features:
  • Project lifecycle management (creation, funding, completion)
  • Investment operations (purchase, claim, refund)
  • NFT allocation management (split, merge, convert)
  • Investor portfolio tracking and analytics
  • Real-time activity monitoring and transaction tracking

→ Explore IFIF Project Management

IFIF V2 Enhanced Features

Advanced crowdfunding features with vesting schedules, automatic stage transitions, multi-distributor support, and nonce-based signature security.

Key Features:
  • Automatic stage transitions (no manual progression)
  • Enhanced purchase controls (soft/hard caps)
  • Graduated vesting for project owners and investors
  • Multi-distributor configurations with per-distributor fees
  • Nonce-based replay attack prevention
  • Unclaimed asset sweep mechanism

→ Explore IFIF V2 Features

IFIF Factory Administration System

An enterprise-grade factory administration interface demonstrating system configuration, deployment monitoring, and administrative controls.

Key Features:
  • Factory deployment analytics and monitoring
  • System configuration management
  • Implementation contract updates
  • Base URI and metadata management
  • Role-based administrative access control

→ Explore IFIF Factory Administration

Role Management System

A comprehensive role-based access control system demonstrating hierarchical permissions, user management, and administrative controls.

Key Features:
  • Role hierarchy management (Admin, Manager, Distributor)
  • User role assignment and revocation
  • Activity tracking and audit trails
  • Real-time role statistics and analytics
  • Administrative oversight and ownership controls

→ Explore Role Management

Whitelist Management System

A Merkle tree-based whitelist system with multi-section support and batch verification capabilities.

Key Features:
  • Multi-section whitelist management
  • CSV upload and Merkle tree generation
  • Single and batch address verification
  • Section-based access control
  • Activity monitoring and analytics

→ Explore Whitelist Management

Client Actions Widget

A comprehensive self-contained React component providing all blockchain actions for IFIF projects with automatic stage detection and approval management.

Key Features:
  • Smart action detection based on project stage
  • Self-contained architecture requiring only projectId
  • Automatic token (ERC20) and NFT (ERC721) approval handling
  • Comprehensive NFT operations (split, merge, convert)
  • Contract-first validation with BigInt precision
  • Progressive data fetching and real-time updates

→ Explore Client Actions Widget

Architecture

All examples follow consistent architectural patterns:

Frontend Architecture

  • React 19 with TypeScript for type safety
  • Next.js 15 for server-side rendering and routing
  • TailwindCSS for responsive design
  • Shadcn/ui for consistent UI components
  • TanStack Table for data management
  • Recharts for analytics visualization

Web3 Integration

  • Wagmi v2 for blockchain connectivity
  • ConnectKit for wallet integration
  • Viem for low-level blockchain operations
  • Custom hooks for contract interactions
  • Transaction queue for operation tracking

Data Layer

  • Ponder for real-time blockchain indexing
  • React Query for data fetching and caching
  • Zustand for application state management
  • Progressive loading for optimal performance

Smart Contract Integration

  • Type-safe contract hooks for all operations
  • Comprehensive error handling and recovery
  • Transaction state management with user feedback
  • Role-based access control integration
  • Real-time event monitoring and updates

Getting Started

Each example includes:

  1. Setup Instructions - Environment configuration and dependencies
  2. Smart Contract Deployment - Local development and testnet deployment
  3. Indexer Configuration - Ponder setup for real-time data
  4. Frontend Development - UI implementation and Web3 integration
  5. Testing & Deployment - Quality assurance and production deployment

Development Workflow

The examples demonstrate a complete development workflow:

# 1. Start local blockchain
pnpm anvil
 
# 2. Deploy smart contracts
pnpm contracts:script
 
# 3. Start indexer
pnpm indexer:dev
 
# 4. Start frontend
pnpm ui:dev

Production Deployment

Examples include production deployment configurations for:

  • Smart Contracts: Mainnet and testnet deployment scripts
  • Indexer: Hosted Ponder deployment on Railway/Render
  • Frontend: Static deployment on Vercel/Netlify
  • Infrastructure: Environment configuration and monitoring

Best Practices

The examples demonstrate industry best practices:

Security

  • Role-based access control implementation
  • Input validation and sanitization
  • Error handling and graceful degradation
  • Secure wallet integration patterns

Performance

  • Progressive data loading strategies
  • Efficient batch operations
  • Optimized re-rendering patterns
  • Smart contract gas optimization

User Experience

  • Intuitive navigation and workflows
  • Real-time feedback and status updates
  • Responsive design for all devices
  • Comprehensive error messaging

Development

  • Type-safe development with TypeScript
  • Comprehensive testing strategies
  • Modular and reusable component patterns
  • Clean code architecture and documentation

Start exploring with the IFIF Project Management, IFIF Factory Administration, Role Management, or Whitelist Management examples to see these patterns in action.