Insite

Challenges

1. 01

   A legacy frontend stuck on old majors

   Problem

   The app ran on React 16, webpack 4 and an old Redux stack, with vulnerable transitive dependencies and tooling that no longer worked on current Node.

   Approach

   I upgraded one layer at a time, keeping the app releasable after every step: React 18 and react‑redux 8, webpack 5 with the polyfills it no longer ships, axios 1, Jest 30 and Node 24. I replaced deprecated tooling like react‑hot‑loader with Fast Refresh and removed unused libraries and widgets along the way.

   Outcome

   The app is on supported versions, the bundle lost dead weight, and the dependency findings were resolved.

2. 02

   Tests that couldn't survive React 18

   Problem

   The test suite was written with Enzyme, which doesn't support React 18.

   Approach

   I migrated the tests to Testing Library, rewriting them around what the user sees rather than component internals.

   Outcome

   The suite runs on the new stack and is less brittle to refactors.

3. 03

   Small UI paper cuts

   Problem

   Chart labels wrapped on short bars and table headers broke while scrolling, which made dense data hard to read.

   Approach

   I fixed the layout issues and tightened the chart label logic.

   Outcome

   Dense views are readable again on real data.

What I took away

• Incremental upgrades with a releasable app at every step beat a big‑bang rewrite.
• Tests written against behaviour survive framework changes; tests against internals don't.