Shopify Theme Development with Vue.js: Optimise Product & Cart Pages

In today’s class, we’re gonna learn how to integrate the Javascript framework Vue.js into the product and cart pages of a Shopify theme.

This class is ideal for those of you who have taken some of my other classes on Shopify Theme Development here on Skillshare.com and are ready to take their theme development skills to the next level.

With Vue.js, we’re able to bring Shopify data structures onto the front-end and allow for the user to live update elements without reloading the browser.

Using Vue.js over other Javascript libraries like jQuery, we can create a more optimal experience for both us as developers as well the end users of our eCommerce store.

Links Mentioned

--------------------

Shopify Theme Programming (Click on lesson 8 for my tutorial on the cart AJAX API)

• Introduction
• Required Knowledge
• Why use Vue
• How to Use Vue on Shopify Themes
• Setting Up Our Project
• Using Vue on the Product Page
• Using Vue on the Cart Page
• Cart Upsells and Animations
• Bonus: Storing Cart Data with VueX
• Bonus: Adapting to JSON Templates
• Conclusion & Class Project