How to Build a Shopify App with Node and React

In this video, Jennifer will show you how to use the Shopify App CLI to create a simple app that access products from a development store and can run in your local environment. She’ll walk you through how to:
- install and set up the App CLI
- embedded your app into the Shopify admin
- build an interface with Polaris
- add React components to your app

Contents:

0:00 Introduction
1:20 Using the Shopify App CLI
7:18 Creating an app
14:40 Building a UI with Polaris
21:10 Accessing React components
26:30 Update resource picker

--------------------------------

[ephraimmulilo]

For some reason, I decided to skip this tutorial at the start of my development journey and just brute force my way to making a Shopify app. A few weeks later I came back and finally watched the full thing and boy, most of the stuff I was struggling with are made so much easier in here. Don't skip the tutorial people.

[jonathangardn]

One of the best tutorials about building Shopify Apps. The CLI looks great, the biggest struggle of setting all up it's over with this.

[SoshJam]

This was super helpful! I've been scratching my head trying to figure this out for ages but this is the first tutorial that's actually worked.

[arjunkjayan]

very informative session, i have a query regarding the resource picker, How can we list the preselected products in the resource picker..?

[MKorostoff]

Thanks Jennifer, great video. I had the time of my life and I never felt like this before.

[onetapmediaofficial]

Much appreciated, this cleared most of my questions on how to start an app with react/Next with Shopify. Thanks for the great video. keep up the good work

[ringreen]

Thank you for this tutorial. What's really interesting for me is the same workaround, but in TypeScript.

[knconvert]

Great video! A continuation to that tutorial would be awesome, i.e. How to connect to the GraphQL Admin API, does it have to be through getServerSideProps, or a React Context, or what?

[peterdaze]

Great tutorial Jeniffer!, question, I want to give this a try so, if I'm building a site for a client, should i use their credentials to create the Partner's account, or is it more a thing of creating the account then creating different stores for different clients and then give them the credentials for the store.

[J-HAYER]

Thank you for this tutorial. A TypeScript Starter Kit would be awesome!

[davidswingley]

Perfect, thank you for your clear understanding of how and where to start in my Shopify App journey.

[lwebdesign]

Such a superb tutor! Thanks for this useful and understandable tutorial

[groovebird]

Hi, how can i handle Updates of my App? The App is live and the url's where i host the app are registered in the backend but i have to change the url if i develop locally on my computer.

[zacharywong]

Can this work on only on Visual Studio Code, or can it also work on Intellij.

[xingyahao]

Very informative! Would CLI comes with ts and react hook optionals in the future?

[frankthoeny]

I like Shopify App Bridge and Polaris when working with React pages. It's a year late, but thank you for this video.

[CodeWithPaulIo]

Really great video. The CLI is very intuitive, so useful to have a component lib too. Looking forward to building Shopify Apps.

[Archalia]

Thank you for the video. In this case you are displaying content in the Admin dashboard of shopify, how do you add content within the storefront directly ?

[LawrenceTaur]

That oauth flow looked effortless. We've been struggling to get our app approved with a React frontend and Dotnet Core backend, because the oauth flow works for us but doesn't work for the app approvers. Could the next video talk more about the oauth flow please?

[billblair]

Hello Jennifer. Thank You, Very Much, for the video tutorial. Really appreciate. You were great, very informative and professional in Your presentation. One of the few video tutorials where the code actually worked. I think I'm in Love. Just kidding. I also read some of the comments below. While some of them were on point, requesting additional elaboration upon GraphQL requests, ..., as a teacher, I also understand the importance of staying with Your intended focus of instruction. Kindly, I humbly request, that You respond to the comments by continuing Your excellent approach to presenting the video tutorials and provide more videos related to the comments and requests below, including promises, array data extraction/manipulation and UI Development. Thanks, again, Very Much.
Most respectfully submitted. P.s. You will never be able to please anyone. You're Great! Thx