Syn By Design

Freelance developer, trainer, & consultant.

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

I am a distinguished software engineer and domain architect at Vista, where my teams and I develop our do-it-yourself (DIY) design software. For the past few years, I’ve focused on scaling VistaPrint’s flagship design software, Studio6. I’ve led our initial migration from a Backbone/Redux/React software stack to a modern React & MobX stack. Along the way, I’ve helped redesign our software by transforming a monolithic application into a platform built upon custom-designed integration frameworks that offer clear, typesafe integration patterns for our many engineering contributors.

Beyond my day-to-day responsibilities, I invest in building our front-end culture and knowledge at Vista. I mentor engineers on specific focus areas: testing, accessibility, and performance. I help these “champions” build and execute plans that improve our software in these often overlooked areas. I also work closely with our technology leaders, creating in-house training and finding ways to adopt standard approaches, best practices, and tooling across the entire organization.

I have an “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. Being a self-proclaimed Apple fan who loves to build UIs, I’ve taught myself a reasonable amount of Swift and SwiftUI. I used this to launch an Apple Watch/iOS/iPad app in the App Store that counts beats per minute when listening to music. I’m now building a new, more sophisticated iPad application that I hope one day will help my kids stay in bed! 🤣

Resume

Eric Masiello

Full Stack JavaScript/TypeScript 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 & TypeScript frameworks

Extensive Experience

  • Scaling large front-end applications & teams
  • Automated Testing
  • JS/TS library development
  • React
  • JavaScript
  • Advanced TypeScript
  • Accessibility
  • HTML
  • CSS
  • CSS Modules
  • Node
  • MobX
  • React Query
  • Next.js
  • Gatsby
  • Vitest
  • Cypress
  • React Testing Library
  • Webpack
  • Rollup
  • Vite
  • Git
  • React Native
  • Performance
  • Technical Writing

Learning

  • Swift
  • SwiftUI
  • AI & ML Fundamentals

Professional Experience

Vista

  • Distinguished Engineer (2024 — Present)
  • DIY Editor Domain Architect (2022 — Present)
  • Design Platform Domain Architect (2021 — 2022)
  • Principal Software Engineer (2020 — Present)
  • UI Architect (2019 — 2021)
  • Senior Software Engineer (2016 — 2020)
  • Led the requirements gathering, prototyping, and architecture that enables other VistaPrint/Cimpress business units to customize and deploy our DIY Editor software via custom-designed frameworks, transforming our software into a design platform
  • Co-led research for extending DIY Editor 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 DIY Editor 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 bundler technology
  • Architect of DIY Editor 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
  • 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)