Intro to Shopify App Development with React, Node & GraphQL

4h 10s
English
Paid

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.

Read more about the course

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.

Requirements:

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

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

What you'll learn:

  • Developing principles for using React for Shopify Apps
  • Shopify App Development using React, Node, GraphQL
  • Developing principles for using Node for Shopify Apps

Watch Online Intro to Shopify App Development with React, Node & GraphQL

Join premium to watch
Go to premium
# Title Duration
1 What we'll be building 02:18
2 Introduction 06:51
3 Building App Scaffold using Next.js and React 07:17
4 Adding scripts to run Application 02:29
5 Embedding app using Ngrok and OAuth 09:30
6 Restarting Ngrok & localhost 03:05
7 Install required NPM packages 01:52
8 Setting up Node.js (Koa) Server 06:46
9 Authenticating and Testing App 03:21
10 Shopify Polaris Overview 04:46
11 Install Polaris 00:29
12 Setting up an EmptyState with React and Polaris 07:38
13 Products Button Setup 13:34
14 Importing Koa Shopify GraphQL Proxy 02:48
15 Overview of the Shopify GraphiQL App 11:53
16 Save Product ID's 04:02
17 Creating Query using GraphiQL 05:30
18 Quick Apollo Overview and Installation 02:07
19 Building out the ProductList 08:31
20 Polaris for ProductList 06:56
21 Introduction to Script Tags 16:26
22 Creating, Displaying, and Deleting Script Tags 18:20
23 Creating Fixed 01:16
24 Adding Polaris to Script Page 14:20
25 Create Function Fixed 2 00:42
26 Displaying data from Server to front-end of store 14:51
27 Creating POST endpoint 10:53
28 Sending data from Shopify Admin to API endpoint 09:02
29 Fetching data from Shopify Admin 06:44
30 Overview of the Application 07:12
31 Displaying Products on Storefront using jQuery 21:15
32 Next steps in your Shopify Journey 07:26

Similar courses to Intro to Shopify App Development with React, Node & GraphQL

Full Stack Advanced React + GraphQL

Full Stack Advanced React + GraphQLwesbos

Category: React.js, GraphQL
Duration 15 hours 43 minutes 10 seconds
React Query

React Queryui.dev (ex. Tyler McGinnis)

Category: React.js
Duration 7 hours 1 minute 30 seconds
Fullstack ASP.NET Core and React Masterclass | Learnify

Fullstack ASP.NET Core and React Masterclass | Learnify fullstack.io

Category: React.js, C Sharp (C#)
Duration 20 hours 40 minutes 31 seconds
The Modern React 18 Bootcamp - A Complete Developer Guide

The Modern React 18 Bootcamp - A Complete Developer Guideudemy

Category: React.js
Duration 20 hours 35 minutes 57 seconds
React Query - Essentials (v2)

React Query - Essentials (v2)Tanner Linsley

Category: React.js
Duration 2 hours 54 minutes 5 seconds
Node with React: Fullstack Web Development

Node with React: Fullstack Web DevelopmentudemyStephen Grider

Category: React.js, Node.js, MongoDB
Duration 25 hours 36 minutes 19 seconds
Building Applications with React 17 and ASP.NET Core 6

Building Applications with React 17 and ASP.NET Core 6udemy

Category: React.js, C Sharp (C#)
Duration 19 hours 28 minutes 31 seconds
Go Full Stack with Spring Boot and React

Go Full Stack with Spring Boot and Reactudemy

Category: React.js, Spring Boot, Spring Security
Duration 11 hours 43 minutes 36 seconds
MERN Stack React, Socket io, Next.js Express,MongoDb, Nodejs

MERN Stack React, Socket io, Next.js Express,MongoDb, Nodejsudemy

Category: React.js, Next.js, Node.js, MongoDB, Socket.IO
Duration 13 hours 2 minutes 12 seconds