Case Study
Boiib Online
Making Nigerian insurance transparent, comparable, and purchasable in one place.
The Problem
Insurance in Nigeria is opaque; and pricing is inconsistent, comparison is nearly impossible, and most purchases still happen via phone calls or physical offices. Boiib needed a web platform that could surface multiple providers, let users compare policies meaningfully, and complete purchases without leaving the app.
Key Technical Decisions
Used a multi-role routing architecture (users, agents, companies) with protected routes per role. This kept each actor's surface area clean without duplicating layout code.
Integrated Flutterwave as the payment layer because Flutterwave's webhook reliability was better documented for the insurance premium recurring-payment pattern we needed.
Chose Quill Text Editor for product descriptions inside the provider portal; lightweight, well-supported, and familiar enough for non-technical insurance staff to use without training.
Challenges & Solutions
Challenge
Three completely different user flows (customer, agent, provider) had to share the same codebase without leaking UI or data between roles.
Solution
Implemented role-based route guards using React Context + localStorage persistence, with a dedicated layout component per role that conditionally rendered nav and sidebar.
Outcome
Delivered a working multi-provider marketplace with real payment processing and admin dashboards for all three actor types. First time I shipped a product with live payment integration.
What I Learned
Role-based access at the frontend level is not security, it's UX. Real security lives on the API. This project taught me to think about who sees what at every layer, not just the component level.