Learn Shopify Theme Development with Liquid - Shopify Liquid Development - Using Javascript Frameworks (React, Vue, Svelte, etc)

In this video we are going to see how to use Javascript frameworks such as Vue, Svelte or React in a Liquid theme. This approach is intended for when for one reason or the other you need to reach for one of those frameworks to build a section of your Shopify theme. For building the whole storefront of a store using a framework the recommended approach is either Shopify Hydrogen or using Shopify’s API to build a headless store in the technology of your choosing. 🟢 My links - Website - https://stackingcontext.com - Support This Project - https://stackingcontext.com/support - Let's work together - https://stackingcontext.com#contact - Get Early Access To New Videos - https://www.youtube.com/@stackingcontext/join Resources - Vite - https://vitejs.dev/ - Hydrogen - https://hydrogen.shopify.dev/ - Shopify Headless - https://shopify.dev/docs/custom-storefronts/getting-started/build-options Timestamps 00:00 - Introduction 01:55 - Setup 02:32 - Vite Setup 03:55 - .shopifyignore 06:15 - Updating the Vite configuration 10:16 - Adding an interactive component 10:58 - Inspecting the File Size 12:20 - Adding Multiple Components 19:00 - Add to cart button in React 19:19 - Sending data from Liquid to React 23:14 - Interacting with the store from React 28:23 - Emitting Events from React to the Theme 30:48 - Lazy Loading