A frontend architecture case study for ComponentIQ: why the plan started as a docs-and-AI-assistant monorepo, why the shipped v1 became a token-first design system and component library instead, and what a future automated audit layer still needs from that foundation.
An independent engineering case study explaining why caching a page is not the same as making it available offline, using Notion's offline architecture to reason about dependency guarantees, provenance, hierarchy reconciliation, and freshness.
A Next.js application that integrates Claude AI for resume tailoring and job fit evaluation. An exploration of what happens when you treat AI as a tool inside a real product instead of a standalone chat interface.
Select a problem below and see how my thinking escalates.
“Why does every payment flow feel fragile?”
How do you build trust when money is on the line?
7 nodes in this path • Click any node to learn more
Following the thread
Payment UX
ExploredExploringFuture
“She sees the relationship between the interface and the system underneath it.”
Notes to Myself
I want to know why.
I'd rather understand why something works than memorize how to do it.
curiosity → fundamentals → depth
I think everything connects.
I'm increasingly convinced everything becomes a system if I zoom out far enough.
patterns → architecture → mental models
I don't stop at the interface.
If I click a button, eventually I'm going to wonder where the state lives, where the request goes, and what happens when it fails.
UI → frontend systems → infrastructure
I care about the human too.
I don't think technically correct software is very useful if the person using it is confused.
system behaviour → interface → UX
I like breaking things.
If an architecture only works when everything behaves perfectly, I probably have more questions.
I don't think frontend means "just frontend."
The interface is where product decisions, system behaviour, and human expectations eventually meet.
product → systems → humans
I like simple things — after understanding the complicated version.
Sometimes the better engineering decision is removing the abstraction I was excited to build.
Note to self
One question is rarely enough. Most of my rabbit holes start with "Wait... but what happens if?"
// hmm
I want to know why.
I'd rather understand why something works than memorize how to do it.
curiosity → fundamentals → depth
I think everything connects.
I'm increasingly convinced everything becomes a system if I zoom out far enough.
patterns → architecture → mental models
I don't stop at the interface.
If I click a button, eventually I'm going to wonder where the state lives, where the request goes, and what happens when it fails.
UI → frontend systems → infrastructure
I care about the human too.
I don't think technically correct software is very useful if the person using it is confused.
system behaviour → interface → UX
I like breaking things.
If an architecture only works when everything behaves perfectly, I probably have more questions.
I don't think frontend means "just frontend."
The interface is where product decisions, system behaviour, and human expectations eventually meet.
product → systems → humans
I like simple things — after understanding the complicated version.
Sometimes the better engineering decision is removing the abstraction I was excited to build.
Note to self
One question is rarely enough. Most of my rabbit holes start with "Wait... but what happens if?"
↳ rabbit hole// hmm?····→↪⚛▲◆●◇▢
Professional Background
Work
My Journey
Work
Frontend & Mobile Engineer
Supernomics
Jan 2026 – Present
Contributed to monorepo-based AI product architecture, using shared package boundaries to keep web, mobile, and product workflows maintainable as the system expands.
Delivered an AI-powered legal application across web, Electron desktop, and Microsoft Office Add-in environments, maintaining cross-platform feature parity while prioritizing release speed, reliable API integrations, and a consistent user experience.
Delivered a React Native and Expo mobile delivery decisions where cross-platform parity, release speed, and API integration quality mattered more than isolated screens.
Delivered mobile UI implementation quality by turning Figma specifications into production interfaces with attention to platform constraints and interaction detail.
Owned an Alipay mini app to production, balancing mini-app platform limitations with the product requirement for a complete mobile experience.
Integrated product APIs across mobile flows, tightening frontend and backend expectations around data shape, loading states, and error handling.
React NativeAlipay Mini AppFigmaAPI Integration
Frontend Engineer
Leja
Jul 2024 – Oct 2025
Chose server-side rendering for business-critical pages where faster perceived loading, indexability, and retention mattered more than a purely client-rendered implementation.
Owned a Safaricom mini app by aligning Ant Design Mini patterns with product requirements, API contracts, and the commercial need to support sales workflows.
Converted Figma systems into responsive React and MUI interfaces while preserving reusable patterns instead of one-off page implementation.
React.jsNext.jsMUIAnt DesignSEO
Frontend Engineer
Oaknet Business
2023 – 2024
Owned frontend implementation for a SaaS monitoring and evaluation system, coordinating UI requirements with backend teams so product workflows mapped cleanly to data contracts.
Improved the investment appraisal experience by translating complex domain workflows into clearer interface states and interaction paths.
Used Vue 3 and Pinia to keep state management explicit in data-heavy flows where predictable updates were more important than local component convenience.
Vue3.jsPiniaGraphQLJavaScript
Frontend Developer
Pathology Network
May 2023 – May 2024
Owned creation of reusable React interface patterns that reduced development time by 30% and improved team efficiency by 20% across repeated healthcare product workflows.
Used React Query for server-state heavy screens where caching, loading states, and refetch behavior needed clearer ownership than component-local state.
Balanced Tailwind CSS and Material UI implementation choices to preserve design consistency while keeping delivery practical for the team.