Shopify Theme Development- Online Store 2.0 + TailwindCSS

Shopify Theme Development: Online Store 2.0 + TailwindCSS, available at $84.99, has an average rating of 4.51, with 90 lectures, based on 1107 reviews, and has 7750 subscribers.

You will learn about Learn about the new Online Store 2.0 and the new theme architecture of Shopify Shopify Theme Development Liquid Programming (Tags, Objects, & Filters) How to use TailwindCSS in Shopify Theme Development Create Shopify themes using Shopify CLI Create an advanced product page w/ product carousels on mobile, variant selectors, and more! This course is ideal for individuals who are Beginner to Intermediate Shopify developers NOT web developers or Students who wants to learn how to create Shopify themes using Shopify CLI or Shopify merchants who wants to learn about Shopify themes or Web Developers who wants to learn about Shopify theme architecture It is particularly useful for Beginner to Intermediate Shopify developers NOT web developers or Students who wants to learn how to create Shopify themes using Shopify CLI or Shopify merchants who wants to learn about Shopify themes or Web Developers who wants to learn about Shopify theme architecture.

Enroll now: Shopify Theme Development: Online Store 2.0 + TailwindCSS

Summary

Title: Shopify Theme Development: Online Store 2.0 + TailwindCSS

Price: $84.99

Average Rating: 4.51

Number of Lectures: 90

Number of Published Lectures: 90

Number of Curriculum Items: 90

Number of Published Curriculum Objects: 90

Original Price: 139.99

Quality Status: approved

Status: Live

What You Will Learn

Learn about the new Online Store 2.0 and the new theme architecture of Shopify

Shopify Theme Development

Liquid Programming (Tags, Objects, & Filters)

How to use TailwindCSS in Shopify Theme Development

Create Shopify themes using Shopify CLI

Create an advanced product page w/ product carousels on mobile, variant selectors, and more!

Who Should Attend

Beginner to Intermediate Shopify developers NOT web developers

Students who wants to learn how to create Shopify themes using Shopify CLI

Shopify merchants who wants to learn about Shopify themes

Web Developers who wants to learn about Shopify theme architecture

Target Audiences

Beginner to Intermediate Shopify developers NOT web developers

Students who wants to learn how to create Shopify themes using Shopify CLI

Shopify merchants who wants to learn about Shopify themes

Web Developers who wants to learn about Shopify theme architecture

Shopify just recently updated their Shopify online experience and now they call it “Online Store 2.0”.

With this update, Shopify merchants can now customize their entire online store using sections & blocks. This opened a lot of doors not just for Shopify app developers but also for Shopify theme developers because now, you can add cool sections and blocks to the most commonly used pages like products page, collections page, blog page, etc.

If you’re a Shopify theme developer and you don’t know yet how to create a Shopify theme for Online Store 2.0, then this is the best time to learn because Shopify is now accepting Shopify themes to be listed on their Shopify Theme Store!

This means you can make money by selling your Shopify themes! So are you interested to learn more?

In this course, we’re going to learn how to create a Shopify theme for Online Store 2.0 using Shopify CLI with the help of TailwindCSS to design a cool online store.

In this course you will learn:

1. How to set up your development store

2. Using TailwindCSS to design a Shopify theme

3. Online Store 2.0 (JSON Templates)

4. Shopify CLI

5. Schema Settings

6. Search Engine Optimization (SEO) for pages like articles, products, etc.

7. Liquid language (Referencing asset files, loops, conditional statements, Shopify objects, filters, and many more)

8. Customer pages

Frequently Asked Questions

Q:Is this course beginner-friendly?

A:If you’re new to Shopify theme development, YES. However, if you’re entirely new to Web Development, then this course is NOT for you since I won’t be explaining how HTML works, how CSS utilities works, what is JavaScript, etc. If you’re entirely new to web development, I suggest learning it first before taking this course.

Q:What operating system are we required to use?

A:I have used MacOS in this course, so if you want to use a different OS, you can do that. However, make sure that you know your way around your system since yours is going to be different from mine (e.g. Terminal/Powershell/Shell)

If you think you’re ready to start, signup now, and let’s create the best Shopify theme together!

Course Curriculum

Chapter 1: Introduction

Lecture 1: Introduction

Lecture 2: Before We Get Started

Lecture 3: What is Online Store 2.0?

Lecture 4: What is Shopify Liquid?

Chapter 2: Setting up your partners account

Lecture 1: Creating Shopify Partners Account

Lecture 2: Creating Development Stores

Chapter 3: Installing Local Development Tools For Shopify CLI

Lecture 1: Read before you continue!

Lecture 2: Installing VSCode in MacOS

Lecture 3: Installing NodeJS

Lecture 4: Installing Shopify CLI on Windows

Lecture 5: Installing Shopify CLI on MacOS

Chapter 4: Getting Started

Lecture 1: Creating The Shopify Theme Project using Shopify CLI

Lecture 2: Logging in to your development stores with Shopify CLI

Lecture 3: Installing TailwindCSS to Shopify theme projects

Lecture 4: Fixing Shopify CLI errors with .shopifyignore

Chapter 5: Creating The Responsive Navigational Bar

Lecture 1: The Navigational Bar (Creating the menu links)

Lecture 2: The Dropdown Menus (Creating sublinks)

Lecture 3: The Mobile Menu (Creating mobile menu window)

Lecture 4: Learning how to customize the header with Section Schema

Lecture 5: How to hide/show customer login & register links

Chapter 6: Shopify Theme Project Management

Lecture 1: Using GitHub integration with Shopify

Chapter 7: JSON Templates

Lecture 1: READ! THIS IS ABOUT THE FOLLOWING LESSONS!

Lecture 2: [404]: Learning about JSON Templates

Lecture 3: [404]: Settings Schema

Lecture 4: [404]: Designing The 404 Page

Lecture 5: [Article]: Creating Blog Posts

Lecture 6: [Article]: Liquid To JSON Template

Lecture 7: [Article]: Settings Schema

Lecture 8: [Article]: Designing The Article Page

Lecture 9: [Article]: Comments Section

Lecture 10: [Article]: Search Engine Optimization (SEO) #1

Lecture 11: [Article]: Search Engine Optimization (SEO) #2

Lecture 12: [Blog]: Liquid To JSON Template

Lecture 13: [Blog]: Setting Schema

Lecture 14: [Blog]: Designing The Blog Page

Lecture 15: [Blog]: Paginations

Lecture 16: [Cart]: Liquid To JSON Template

Lecture 17: [Cart]: Making a Working Cart Page

Lecture 18: [Cart]: Making a Test Order for Development Stores

Lecture 19: [Cart]: Schema Blocks

Lecture 20: [Collection]: Liquid To JSON Template

Lecture 21: [Collection] – Designing The Collection Page

Lecture 22: [Collection] – Creating The Product Card Snippet File

Lecture 23: [Collection] – Creating Schema Settings

Lecture 24: [Collection] – Creating That Zoom Effect on Hover

Lecture 25: [Index] – Liquid To JSON Template

Lecture 26: [Index] – Featured Collection

Lecture 27: [List Collections] – Creating a Working List Collections Page

Lecture 28: [Page] – Liquid To JSON Template

Lecture 29: [Page] – Rendering The Page Content

Lecture 30: [Page] – Designing The Page

Lecture 31: [Custom Section] – Contact Form

Lecture 32: [Page] – Contact Page

Lecture 33: [Product] – Liquid To JSON Template

Lecture 34: [Product] – Creating The Necessary Products For Testing

Lecture 35: [Product] – Rendering The Product Medias

Lecture 36: [Product] – Creating Product Media Carousels

Lecture 37: [Product] – Creating The Product Form

Lecture 38: Lets Fix Our Code

Lecture 39: [Product] – Creating Schema Blocks for the Product Form

Lecture 40: [Product] – The JavaScript Side of Product Template

Lecture 41: [Search] – Creating The Search Bar

Lecture 42: [Search] – Rendering Products in Search Results

Chapter 8: Customers

Lecture 1: [Customer] – Login Page

Lecture 2: [Customer] – Registration Page

Lecture 3: [Customer] – Testing Forgot Your Password Form

Lecture 4: [Customer] – Reset Password Form

Lecture 5: [Customer] – Guest Login

Lecture 6: [Customer] – Account Page

Lecture 7: [Customer] – Order Page #1

Lecture 8: [Customer] – Order Page #2

Lecture 9: [Customer] – Order Page #3

Lecture 10: [Customer] – Addresses Page (Creating the interface)

Lecture 11: [Customer] – Addresses Page (Creating The New Address Modal)

Lecture 12: [Customer] – Addresses Page (JavaScript Side of Customer Address Form)

Lecture 13: [Customer] – Addresses Page (Creating The Edit Address Modal)

Lecture 14: [Customer] – Addresses Page (Set as default address)

Lecture 15: [Customer] – Addresses Page (Deleting addresses)

Lecture 16: [Customer] – Activate Account Page

Chapter 9: Shopify CLI, Theme Check, AlpineJS

Lecture 1: Fixing AlpineJS Blipping Issue

Lecture 2: Fixing Shopify CLI Errors

Lecture 3: Using Theme Check

Lecture 4: Fixing SwiperJS error and the media size

Chapter 10: Learning about 3D Models in Shopify themes

Lecture 1: Using 3D Models in Shopify

Lecture 2: What is Model Viewer?

Lecture 3: Setting up the product model custom element

Lecture 4: Setting up the product model modal window

Lecture 5: Creating JavaScript of <product-model> custom element

Lecture 6: Writing the CSS style of the Model Viewer to maximize its size

Lecture 7: Using the Model Viewer UI Feature of Shopify

Instructors

Bernard Polidario
Shopify Developer | Founder of WeeklyHow

Rating Distribution

1 stars: 20 votes

2 stars: 25 votes

3 stars: 80 votes

4 stars: 295 votes

5 stars: 690 votes

Frequently Asked Questions

How long do I have access to the course materials?

You can view and review the lecture materials indefinitely, like an on-demand channel.

Can I take my courses with me wherever I go?

Definitely! If you have an internet connection, courses on Udemy are available on any device at any time. If you don’t have an internet connection, some instructors also let their students download course lectures. That’s up to the instructor though, so make sure you get on their good side!