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

Published: 31 March 2024
on channel: Stacking Context - Shopify Development Tutorials

7,852

178

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 - / @stackingcontext

Resources
Vite - https://vitejs.dev/
Hydrogen - https://hydrogen.shopify.dev/
Shopify Headless - https://shopify.dev/docs/custom-store...

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

On this page of the site you can watch the video online Shopify Liquid Development - Using Javascript Frameworks (React, Vue, Svelte, etc) with a duration of hours minute second in good quality, which was uploaded by the user Stacking Context - Shopify Development Tutorials 31 March 2024, share the link with friends and acquaintances, this video has already been watched 7,852 times on youtube and it was liked by 178 viewers. Enjoy your viewing!

91,416

6.9K