Zápisník Josefa Rouska

Python a React.js programátor, zaměřený na Shopify integrace

You don't need a SPA

I’m building Shopify apps using Django and React. When I first created Candy Rack it was server rendered HTML with single or multiple React components on a page. Since then the web ecosystem evolved. The most important change are the restrictions around 3rd party cookies. To address this problem Shopify came with an alternative authentication method that doesn’t rely on cookies called session tokens. Instead of cookies Shopify provides a Javascript function that returns a token. As a result all authenticated requests must be made from Javascript. While SPA is fine for larger apps and teams, we have some smaller apps and rewriting them to SPA isn’t viable.

Thankfully a whole new approach to interactive apps is starting to get a widespread attention.

The one I have some experience with is Hotwire, successor of Turbolinks. I created an example Shopify app based on Shopify’s tutorial Authenticate server-side rendered embedded apps using Rails and Turbolinks. Hotwire works well, gets the job done. But there are two other tools I would love to try.

htmx is similar to Hotwire and I’m seeing more of it in Python community.

Inertia.js is taking slightly different approach. It serves as client-side router for React, Vue and Svelte apps. The most interesting feature is that Inertia uses a protocol that defines how are data passed from the server and based on this data it renders a component. If you would like to learn more I recommend Episode 291: All Things Inertia.js with Jonathan Reinink of The Bike Shed podcast.

I’m very excited about the direction these tools are going and will keep writing about my experience with them.