MongoDBDeveloper PlatformApr 2023 – Oct 2024
Cross-library design-system work on mongodb.com: token layer, shared components, and coordinated multi-package releases.
Shipped component-library features powering mongodb.com: a design-token layer, a high-level component library, and a unified navigation package consumed across properties. Owned backward-compatible API design for code used by dozens of engineers, coordinated multi-package release chains, and debugged style-precedence in a hybrid Tailwind + theme-ui stack.
Design system
Performance
Semver
Role
Senior Frontend Engineer
Scope
18 months
Highlights
- Architected a multi-promo announcement bar spanning the token layer, the component library, and the shared navigation package. Coordinated release chain shipped without breaking downstream consumers.
- Added `fetchPriority="high"` on hero images for a measurable LCP improvement on the highest-traffic marketing pages. Tiny diff, real Core Web Vitals win.
- Led a large marketing-form migration from Pardot to Eloqua across hundreds of forms: field mapping, post-submission rich-text rendering, defensive handling of incomplete CMS payloads.
- Card-grid revamp with variant sizing, hover treatments, inverse-theme fix, and graceful deprecation of legacy props. Backward-compatible consumer adoption across landing pages.
- Systematized style-precedence debugging by introducing a scoped override pattern in the hybrid Tailwind + theme-ui codebase; pattern became team practice.
- Unified image/video/embed handling behind a single media component API, reducing surface area and enabling rich-text JSON embeds.
- Hardened components against CMS drift with defensive null-checks and type exports, preventing build failures when the CMS returned incomplete payloads.
Outcomes
- Contributed across the full library set (design tokens, high-level components, unified navigation) with strict semver discipline and snapshot-test coordination.
- Measurable Core Web Vitals improvement on mongodb.com landing pages.
- Multi-promo banner rollout shipped without breaking changes for downstream consumers.
Stack
- React
- TypeScript
- Next.js
- Tailwind
- theme-ui
- Jest
- React Testing Library
- Storybook
- Contentstack
- API Extractor