GiftCardsToNaira is a fintech platform operating in Nigeria and Ghana, allowing users to redeem gift cards for fiat currency (Naira or Cedis), pay utility bills, and manage digital wallets.
I was responsible for the development of the application’s frontend that is capable of handling complex state, real time transaction updates, and ensuring that every user interaction is responsive, secure, and frictionless.
Challenge
Building a fintech dashboard comes with a unique set of constraints:
Complex Multi-Step Trading: I needed to manage a smart form that guides users through their trade. It automatically updates rates and options based on their choices in real-time, while saving their progress securely so they don't have to start over if they get interrupted.
Scalable Record Management: Users need to find specific trade history information quickly. My challenge was to build a high-performance Transaction History system that remains quick even when filtering through thousands of records across different parameters.
Secure API Integration: Connecting the dashboard to various banking and utility providers required a solid bridge to verify account numbers and meter IDs instantly, preventing money from being sent to the wrong place.
Solution
1. Architecture & State Management
Global UI State: I implemented Zustand stores to manage complex authentication flows, including token expiration detection and async hydration with secure storage.
Server State: I engineered a hierarchical Query Key factory using TanStack Query to manage caching patterns. This allowed for intelligent cache invalidation and reduced redundant API calls.
2. The Trading Engine
I designed a sophisticated multi-step wizard pattern for trade creation:
Dynamic Validation: Integrated React Hook Form with Zod, implementing real-time validation logic and reactive rate calculations using useMemo.
Robust Uploads: Built a custom dropzone integration with attachment schema validation (UUID and extension tracking) to ensure only valid assets are processed.
State Persistence: Form data persists across steps using Zustand, allowing users to navigate the multi-step form without losing progress.
"Sell Gift Card" interface showing the multi-step form, card category selection, and real-time rate calculator.
Pre-validation Logic: Ensured meter numbers, smartcards, and betting IDs are verified before processing transactions.
Bill Payment dashboard displaying available utility providers, pre-validation checks, and input fields.
4. Security-First Withdrawal System
2FA Integration: Developed a custom slide-up 2FA Drawer component for sensitive operations like adding bank accounts or making withdrawals.
KYC Compliance: Integrated Dojah widget for seamless user identity verification.
Wallet Withdrawal screen showing saved bank accounts
5. User Engagement & Gamification
Leaderboards: Live view of top traders, updated in real-time.
Polls: Interactive polling system for platform feature feedback.
Referral Program: Dashboard for users to track referral earnings and copy invite codes.
Desktop view showing design of Leaderboard
Technical Highlights
Next.js Route Groups: Organized the app into route groups to separate protected routes from public ones.
Typed API Client: Built a centralized API client with generic response typing, automatic token injection, and toast-based error surfacing.
Performance Optimization: Used selective Zustand subscriptions and Streamed Hydration to minimize re-renders and perceived load times.
Outcomes
Zero-Error Submissions: Pre-validation APIs for bill payments and Zod runtime schemas caught user errors before they reached the backend.
High Performance: Intelligent caching via TanStack Query and optimized image handling resulted in a fast, PWA-ready experience.
Enhanced Security: The 2FA and token management system effectively neutralized unauthorized access attempts and session hijacking risks.
Impact Summary: I delivered a polished, high-trust SPA that successfully handles multi-currency transactions perfomantly. By prioritizing structural integrity and real-time feedback, I created a platform that drives user retention and minimizes operational support tickets.