For the first half of the course, we will be following the official Shopify Documentation tutorial on setting up a React and Node Application. After which we will take things into our own hands and modify the server and add awesome functionality to our app!

Building App Scaffold using Next.js and React

07:16

Adding scripts to run Application

02:28

Embedding app using Ngrok and OAuth

09:29

Restarting Ngrok & localhost

03:04

+ – Building Essential App Components

3 lectures 11:56

Install required NPM packages

01:51

Setting up Node.js (Koa) Server

06:45

Authenticating and Testing App

03:20

+ – Introduction to Shopify Polaris

4 lectures 26:23

Shopify Polaris Overview

Preview 04:45

Install Polaris

00:28

Don't forget to do npm install @shopify/polaris

Setting up an EmptyState with React and Polaris

07:37

Products Button Setup

13:33

+ – Shopify GraphQL API

4 lectures 24:09

Importing Koa Shopify GraphQL Proxy

02:47

Overview of the Shopify GraphiQL App

11:52

Save Product ID's

04:01

Creating Query using GraphiQL

05:29

+ – Building out App functionality

3 lectures 17:31

Quick Apollo Overview and Installation

02:06

Building out the ProductList

08:30

Polaris for ProductList

06:55

+ – Shopify GraphQL Script Tag

3 lectures 50:52

Introduction to Script Tags

16:25

Creating, Displaying, and Deleting Script Tags

19:27

Adding Polaris to Script Page

15:00

+ – Changing Server to add Endpoints using Koa

2 lectures 25:42

Displaying data from Server to front-end of store

14:50

Adding a POST endpoint to our API

Creating POST endpoint

10:52

+ – Fetching product data from Shopify Admin

3 lectures 22:55

Sending data from Shopify Admin to API endpoint

09:01

Fetching data from Shopify Admin

06:43

Overview of the Application

07:11

+ – Creating Storefront App view using jQuery

1 lecture 21:14

Displaying Products on Storefront using jQuery

21:14

1 more section

Requirements

Knowledge of JavaScript or another programming language
Interest in learning about the Shopify Platform

Description

This is the first course of it's kind on the internet! Learn how to make professional applications for the Shopify Platform using React, Node, Koa, GraphQL, Apollo, and the Shopify ScriptTag API.

In this course we will using data from the Shopify Admin and injecting it into the Storefront using the Shopify ScriptTag API.

This course is made as an extension to the Shopify React + Node tutorial available in the Shopify documentation. We will be diving deeper into the documentation where I will be explaining the concepts in more detail and additionally showing how to use the Shopify ScriptTag API to create a concept application that is able to inject custom code into the front-end of a store.

Average annual earnings for the top 25% of Shopify app developers is $272,000 (source: Shopify developers website)

Who this course is for:

JavaScript, React, or Node JS Developers
Beginner Developers looking to learn about Shopify App Development
People curious how Shopify Apps are made

Featured review

Hamed Al-Khabbaz ( 2 courses, 2 reviews )

a month ago

would like to see the mongodb part and billing. Overall since it was non existant anywher in the web, this deserves a lot of the stars. Very easy to follow, would also like it if it was more in-depth and more best practices but quick and dirty is what I was looking for