Class Central is learner-supported. When you buy through links on our site, we may earn an affiliate commission.

Skillshare

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

via Skillshare

Overview

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)

Syllabus

  • 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

Taught by

Christopher Dodd

Reviews

Start your review of Shopify Theme Development with Vue.js: Optimise Product & Cart Pages

Never Stop Learning.

Get personalized course recommendations, track subjects and courses with reminders, and more.

Someone learning on their laptop while sitting on the floor.