Shopify Theme Development From Scratch | Complete Course for Beginners to Advanced

Video Description

Learn Shopify Theme Development from beginner to advanced in this complete step-by-step course. By the end of this course, you will be able to: Build and customize Shopify themes confidently Understand the Liquid language deeply Work with Shopify’s powerful APIs (Cart API, Section Rendering API, etc.) Debug and optimize themes for performance Prerequisites: Basic knowledge of HTML, CSS, and JavaScript Understanding of Liquid templating language (basics) A willingness to learn Timestamps Module 1: Fundamentals & Liquid Templating 00:00 - Introduction to the course 02:45 - Overview of Shopify Theme & Theme Editor 17:35 - Local Setup with GitHub & Shopify CLI 20:35 - Shopify Theme Architecture Explained 43:40 - Connect GitHub Repository to Shopify Theme 57:35 - Liquid Templating Language In-Depth 1:15:40 - Locating Source Code of Any Element in a Theme 1:25:10 - Working with Form Tags in Liquid 1:29:25 - Shopify Liquid Tags & Filters Overview 1:42:55 - Shopify Object Map & Template Objects 1:44:55 - Introduction to Sections & Creating Basic Section 2:12:30 - Section Blocks Explained 2:23:22 - Q&A: Shopify Development Journey 2:30:00 - Metafields in Shopify 2:54:00 - Metaobjects in Shopify 3:09:40 - Creating Metaobject Page Module 2: JavaScript & Shopify APIs 3:14:42 - How JavaScript Works in Shopify Themes 3:35:12 - Live Debugging: Fixing Image Variant Change Bug 3:49:09 - Cart API Explained: How Items are Added to Cart 4:01:22 - Add to Cart Flow in DAWN Theme 4:12:55 - Shopify Section Rendering API (Deep Dive) 4:27:01 - Update Variant Info with Section Rendering API 4:53:00 - Introduction to Web Components in Shopify 5:04:24 - Practical Example: Web Components in Action Module 3: Build a Custom Shopify Theme 5:33:11 - Create Shopify Theme from Scratch (Homepage & Product Page) 6:01:25 - Add to Cart Functionality, Cart Page & Drawer 6:42:50 - Quantity Selector & Delete Functionality in Cart Drawer 7:15:48 - Create Collection Page & Mega Menu (Customizer Events) 8:03:34 - Update Quantity Bubble & Variant Selector on Product Page Tools & Technologies Used Shopify CLI Visual Studio Code GitHub Shopify Liquid JavaScript and DOM Debugging Tools Shopify Cart API and Section Rendering API Shopify theme development documentation: https://shopify.dev/docs/storefronts/themes Shopify cli: https://shopify.dev/docs/api/shopify-cli Shopify liquid templating language: https://shopify.dev/docs/api/liquid Shopify liquid objects: https://shopify.dev/docs/api/liquid/objects Sections assignment: https://docs.google.com/document/d/1b6z1_llq9bmQ3RypsquFcCWEyI7BuuVcEbR7Vg7PUSM Shopify theme repository std101: https://github.com/saadsaif97/std101 Car Products to import in Shopify store (please create the required product metafield in store as mentioned in video at 5:06:38, if the products are not imported as expected in your store): https://drive.google.com/file/d/1PSfOaGPw2Yn-nb-fMmWRdTlK66kgJVFw/view