Matthew A. Bretz

Frontend Engineer and UX Designer
Contact Me:
matthew.a.bretz@gmail.com

Case Study:Edwardjones.com React Component Library

  • file_type_reactjs
  • file_type_typescript_official
  • file_type_jest
  • file_type_storybook
  • file_type_tailwind
Stack: React | TypeScript | Jest | Storybook | Tailwind CSS

As an enthusiastic advocate for Design Systems and reusable component libraries, I initiated a project within Edward Jones Marketing's UX discipline to create a component library based off the all-new 2021 relaunch of Edwardjones.com, with the intent to help facilitate quick internal prototyping of new features and enhancements for the site and other experiences, as well as serve as a reference for our agency partners engaged in creating other public-facing websites and applications.

Starting with a React and TypeScript base, I learned the Tailwind CSS system in use on the website and worked to integrate it as the default styling option for this component library. I also authored Storybook stories to view components in isolation, as well as automated UI tests to run in Jest.

Storybook view of multi-variants of different components.