Case study · Harvard University Library

Moving a conservation records system to React in under eight weeks

ACORN is the system Harvard Library's conservators use to track every object that enters the lab, from treatment proposals and approvals to reports. Its Angular 14 front end had reached end of life. I led the front end of the move to React 19 and Next.js 16, from July 1 to production on August 24, 2026.

Role: Front-end lead
Timeline: July – August 2026
Stack: React 19, Next.js 16, TypeScript, Material UI, Node.js, MongoDB
Team: Notch8 with Harvard Library conservation staff

ACORN Records List in the new React front end: a sortable, filterable table of conservation records with columns for ID, type, title, author, call numbers, status, proposal approval and expected return date; the record data is blurred — The Records List, rebuilt in React and Material UI (record data blurred)

Under 8 weeks

from project start to production

100+

pull requests merged across client and API

~240

Playwright end-to-end tests in CI

WCAG 2.1 AA

audit led and findings fixed

The problem

Conservators rely on ACORN every day, so the new front end had to match the old one feature for feature before anyone could switch. That meant the full application: the records list, create and edit forms, proposals and approvals, item and treatment reports, advanced search, transfers, files and the admin lists.

It also had to keep the rules staff depend on: fields that only some roles can edit, warnings when someone else has a record open, and guards against losing unsaved work.

What I did

Set up the React and Next.js app shell, routing, design tokens and shared component library that the rest of the migration followed
Ported the full application to feature parity, working end to end from MongoDB schema changes through the API to the React UI
Built PDF and Excel exports for treatment reports, including multilingual catalog data, and a rich-text editor for proposals and reports
Wrote the project wiki and worked through review cycles with the library's conservation QA reviewer to confirm parity

ACORN record detail screen with tabs for Detail, Status, Proposal, Report and Files, showing fields for repository, project, purpose, assigned staff and repository info; the values are blurred — Record detail with tabbed workflow (record data blurred)

ACORN Transfer Form, step 1 of a 4-step wizard, with fields for transfer type, from, to, by and date — Transfers as a four-step form

ACORN admin list of reusable proposal and report text, with edit and delete actions and caption, owner and global columns; the values are blurred — Admin lists for reusable proposal and report text (data blurred)

Accessibility

I led a WCAG 2.1 AA audit of the new application and fixed what it found, setting a baseline in Material UI for focus order, skip navigation, dialog behavior and keyboard use across every migrated workflow.

The rich-text editor needed extra care: I added tab indentation, Escape to leave the editor, and correct focus inside dialogs, and stopped it from flagging unsaved changes the moment a form opened.

Quality

Moving fast only worked because every change was checked. I built the test suites and a GitHub Actions pipeline that blocks a pull request unless formatting, linting, TypeScript, unit and end-to-end tests all pass, and that rejects tests which pass only some of the time.

End-to-end

~240 tests

20 Playwright suites

Client unit

~1,200

assertions

Server

426

spec cases

Have a front end that needs to move?

Get in touch