AirBills
Israel Chinwuba
Verified
AirBills (Crypto Payment Platform)
airbills hero section
PROJECT OVERVIEW
AirBills is a cutting-edge web3 payment platform that enables users to purchase utility bills and services using cryptocurrency on the Solana blockchain. This project represents a complete redesign and frontend build of a crypto-enabled bill payment system.
DESCRIPTION
A user-friendly and intuitive cryptocurrency payment platform built for AirBills, enabling seamless bill payments through blockchain technology. The platform allows users to pay for airtime, electricity, internet subscriptions, TV services, betting deposits, and gift cards using Solana-based SPL tokens (USDC, USDT, bNGN) or internal credit balance.
app dashboard
KEY FEATURES DELIVERED
Dual Authentication System
- Traditional email/password authentication with JWT tokens
- Web3 wallet authentication using Solana wallets (Phantom, Solflare, etc.)
- Secure signature verification with time-sensitive nonces
- httpOnly cookie-based session management for enhanced security
Multiple Payment Methods
- Wallet Payment: Direct blockchain transactions using SPL tokens
- QR Code Payment: Solana Pay integration for external wallet payments
- Credit Balance: Internal credit system for quick transactions
Bill Payment Services
- Airtime top-up for all major carriers
- Electricity bill payments with meter validation
- Internet data subscriptions
- Cable TV subscriptions (DStv, GOtv, Startimes)
- Betting wallet deposits
- Digital gift cards
Flight Booking Integration
- Integrated travel booking system
- Cryptocurrency payment support for flight purchases
User Dashboard
- Real-time token balance display (SOL, USDC, USDT, bNGN)
- Transaction history and activity tracking
- Wallet management and security settings
- Payment analytics and insights
- Profile customization
Advanced Features
- Bulk bill processing for multiple transactions
- Transaction reversal system
- Real-time token rate conversion
- Network provider integration
- Form validation with comprehensive error handling
bulk page
TECHNICAL IMPLEMENTATION
Frontend Stack
- Framework: Next.js 15 (App Router)
- UI Library: React 19 with TypeScript
- Styling: Tailwind CSS with shadcn/ui components
- State Management: Zustand with localStorage persistence
- Data Fetching: TanStack Query (React Query)
- Form Handling: React Hook Form with Zod validation
- Blockchain: Solana Web3.js with Wallet Adapter
Architecture Highlights
- Server-side rendering with Next.js 15 App Router
- Protected route middleware with JWT validation
- Unified API gateway pattern for all bill services
- Custom toast notification system
- Responsive design for mobile and desktop
- Responsive sidebar implementation for mobile and tablet
- Rate limiting for security (5 attempts per 15 minutes)
Security Features
- JWT tokens stored in httpOnly cookies (not localStorage)
- CSRF protection with SameSite=Lax cookies
- Wallet signature verification with message expiry
- Backend validation for all transactions
- Secure token amount calculations server-side
Blockchain Integration
- Solana mainnet/devnet support
- SPL token balance fetching and display
- Transaction signing and verification
- Solana Pay QR code generation
- Base64-encoded versioned transactions
PROJECT COMPLEXITY
This was a complex full-stack frontend project involving:
- Web3 wallet integration with multiple providers
- Blockchain transaction handling and signing
- Real-time cryptocurrency rate conversion
- Multiple payment gateway integrations
- Complex form validation and state management
- Protected authentication flows
- Server-side rendering with client-side interactivity
LIVE DEMO
Production URL: https://app.airbills.org/home
TECHNOLOGIES USED
Core
- Next.js 15
- React 19
- TypeScript
- Tailwind CSS
Web3 & Blockchain
- Solana Web3.js
- @solana/wallet-adapter-react
- Solana Pay
UI & Components
- shadcn/ui
- Radix UI primitives
- Lucide Icons
- Sonner (toast notifications)
State & Data
- Zustand
- TanStack Query
- React Hook Form
- Zod
Development Tools
- ESLint
- Prettier
- TypeScript
- Turbopack
IMPACT & RESULTS
- Created a seamless crypto-to-fiat payment gateway for Nigerian users
- Enabled instant bill payments using cryptocurrency
- Reduced payment friction with wallet-based authentication
- Built scalable architecture supporting multiple service types
- Achieved responsive design across all device sizes
- Implemented comprehensive error handling and user feedback
Like this project
Posted Dec 1, 2025
AirBills is a cutting-edge web3 payment platform that enables users to purchase utility bills and services using cryptocurrency on the Solana blockchain.
Likes
0
Views
4
Timeline
Jul 3, 2025 - Jul 4, 2025
Clients
AirbillsPay
