Magic Responsive Tables with Stimulus and IntersectionObserver

You’re working on this data table for your app. It’s mostly server-side HTML. Nothing fancy.But as you’re adding columns, you’ve got a problem. How are you going to handle small screens?The table has to scroll horizontally to let the user see all the columns. The table needs to become “responsive”.In this article, we’ll look at a side-scrolling widget used in Shopify’s Polaris UI toolkit (currently built in React), and we’ll recreate the functionality using just Stimulus without having to rewrite your data table in React.