Syn By Design

Freelance developer, trainer, & consultant.

👋 Hi. I’m Eric Masiello, and this is what I do.

I am a principal software engineer and domain architect at Vista, where my teams and I develop front-end libraries that make design capabilities scale. Our tech stack is primarily TypeScript, React, and MobX. While I love building user interfaces, building libraries that support rich experiences adds the additional challenge of designing for more than just my needs. I have to straddle that line between the “pit of success” and extensibility. In addition, my teams and I must consider other essential requirements like accessibility, performance, and testing.

My teams and I have worked on some unique projects. I prototyped a command line interface (CLI) tool and partnered with other engineers to design and build a project generator called “Create Design Stack Project.” The CLI walks you through several prompts and generates nearly everything you need to contribute to Vista’s design capabilities ecosystem. I also helped brainstorm tooling that improves how engineers build and test libraries inside their host applications (think npm link, but tailored toward our organization and technology). And I am presently leading a high visibility, large-scale migration effort that will modernize and align all of Vista’s core editors onto a standard technology stack.

I have a unique and “unusual” love for writing unit and integration tests. I take inspiration from the great Kent C. Dodds and have turned my testing philosophy into an internal course at Vista.

Lastly, I love to tinker with the edges of web and user interface development. I’ve begun digging into Rust because I’m excited by what additional possibilities it enables on the web via web assembly. Also, being a self-proclaimed Apple fan who loves to build UIs, I’ve taught myself a reasonable amount of Swift and SwiftUI. I even launched an Apple Watch/iOS/iPad app in the App Store that counts beats per minute when listening to music.

Resume

Eric Masiello

Full Stack JavaScript Engineer

Over 15 years of professional experience in web development and design with a passion for developing and testing rich internet applications using modern JavaScript frameworks

Extensive Experience

  • Web application development
  • JS library development expert
  • Accessibility
  • Performance
  • React
  • React Native
  • JavaScript
  • Advanced TypeScript
  • HTML
  • CSS
  • Emotion
  • CSS Modules
  • Node
  • Express JS
  • Redux
  • MobX
  • React Query
  • Gatsby
  • Next.js
  • Jest
  • Vitest
  • Cypress
  • React Testing Library
  • Webpack
  • Rollup
  • Babel
  • Git
  • Technical Writing

Learning

  • Remix
  • Rust
  • Swift
  • SwiftUI

Professional Experience

Vista

  • Advanced Editors Domain Architect (2022 — Present)
  • Design Platform Domain Architect (2021 — 2022)
  • Principal Software Engineer (2020 — Present)
  • UI Architect (2019 — 2021)
  • Senior Software Engineer (2016 — 2020)
  • Co-led research for extending Print Designer architecture to improve developer contributions processes and distribute ownership by defining interfaces for libraries, plugins, and micro-frontends
  • Led the migration of VistaPrint's primary Print Designer to a new modern, React, and MobX-based framework, providing strategy and technical guidance for seven development teams
  • Designed and implemented an accessible routing solution for an embeddable design experience, with an emphasis on focus management via declarative components
  • Instrumented the definition and ratification of two organization-wide RFCs: one for accessibility and one that forces development teams to keep pace with critical JavaScript library major releases
  • Developed and instructed multiple in-house, multi-day developer training sessions on accessibility, advanced React patterns, UI testing best practices, and bundlers
  • Architect of Print Designer UI library; optimized for mobile experiences via custom build scripts supporting tree shaking, small CSS modules, and flexibility via components and custom hooks
  • Led re-architecture of Vista's Website Builder, dramatically expanding the tool's customer-facing capabilities and flexibility
  • Spearheaded the development and adoption of the VistaPrint Digital UI Component library
  • Full stack engineer across multiple products utilizing React, TypeScript, and Node
  • Longtime career coach and manager for junior & senior engineers; provided guidance and support resulting in promotions and even career changes

Advisory Board Company

  • Principal Front-End Developer (2013 — 2016)
  • Lead Front-End Developer (2011 — 2013)
  • Principal engineer on multiple health care and higher education RESTful web applications using SCSS, Angular, Ionic, Cordova, Knockout, jQuery, Gulp, and Grunt
  • Advisory Board UI framework CSS Architect
  • Authored and trained two one–week-long front-end developer boot camps
  • Coached and mentored junior engineers and designers
  • Winner of multiple Advisory Board Hackathon competitions
  • Acted as a cross-product accessibility consultant

US Census Bureau

  • Chief of Human Resources Info Systems Branch (2010 — 2011)
  • Senior Web Developer & Team Lead (2008 — 2010)
  • Web Designer & Developer (2003 — 2009)
  • Managed nine direct reports
  • Acted as project manager for HR Systems: developing project plans, wireframes, & milestones
  • Developed and documented visual style guide for engineers, enforcing HTML semantics, best practices, UI, and UX consistency
  • Lead developer for Census Human Resource Information System (CHRIS) using .NET and SQL Server

Talks & Workshops

  • Opinionated React Testing Workshop (2021)

    In developing Design Stack, Vista's component library for design experiences, I set a high bar for our libraries' test coverage: 100%. This high bar forced me to understand deeply the testing technologies and how to best author tests to be resilient, comprehensive, and beneficial to other engineers. In this workshop, I cover the most valuable parts of Jest's API, explain when snapshot testing is appropriate, and demystify all the confusing aspects of React Testing Library. Lastly, I share my opinion on organizing and authoring tests as documentation.
  • How to Tree Shake (2019)

    While we'd like to believe build tools will always magically "do the right thing," in reality, we must author JavaScript libraries "correctly" to support the diverse environments we'll want to execute our code. This talk explains the impact CommonJS and ES Modules have on these environments. It compares Rollup to Webpack, explaining when each is the appropriate choice. And finally, it touches on "side effects" and how to mitigate their impact on code bundles.
  • React Performance (2019)

    This talk covers techniques for improving the performance of your React application. It discusses code-splitting, memoization, performant usage of React context, and how to measure the impact of your code change using Chrome's performance profiler and React's developer tools.
  • Let's Make an Accessible Component (2018)

    At Vistaprint, we believe accessibility is vital. This talk showcases a tabbed interface. I explain why it is inaccessible and then walk through how to refactor the code to maintain the same visual presentation but make it fully accessible to keyboard and screen reader users using ARIA roles, labels, and JavaScript.

Freelance & Related Experience

Education & Training

University of Maryland, Baltimore County
Catonsville, MD (2003)

Bachelor of Science in Information Systems Management

Jamstack Conf
Online (2020)

JS Conf
Carlsbad, CA (2018)

Scrum Alliance
Washington, DC (2017)

Certified ScrumMaster

Chain React Conference
Portland, OR (2017)