*NEW* Getting Started With Shopify App Development - CLI 3 + NodeJS!
ฝัง
- เผยแพร่เมื่อ 5 ส.ค. 2024
- In this video we get started with Shopify App Development by going through the basic setup and installation using the CLI 3! Please let me know in the comments down below if you have any questions or run into any problems while following along in the video, I'd love to help out in any way I can. Feedback and constructive criticism is also highly appreciated!
Follow me on Twitter! / devwithalex
📕 Chapters
-------------------------
0:00 Intro
1:11 Apps Overview
1:46 Shopify Partner Program
2:09 ngrok
2:34 Create App
3:08 Start Development Server
3:32 Install App on Development Store
4:37 Final Thoughts/Next Steps
🔗 LINKS
-------------------------
NodeJS:
nodejs.org/en/
VSCode:
code.visualstudio.com/
ngrok:
ngrok.com/
Shopify Partner Program:
www.shopify.com/partners
Shopify Quickstart Guide:
shopify.dev/apps/getting-star...
Shopify Devs Discord (I'm in there!):
/ discord
✉️ INQUIRIES
-------------------------
Email: contact@devwithalex.com
Twitter: / devwithalex
🙋🏽♂️ About Me
-------------------------
Hi there! My name is Alex and I have been programming (mostly self-taught) for over 4 years now. Programming has changed my life for the better, and I am on a mission to share my knowledge with you so that you can reap the rewards of a satisfying and fulfilling career in software development. My favorite thing about software development is that you are constantly learning, and I want to share the things I learn with you! I am always looking for ways to improve and new things to learn, so feel free to reach out or leave a comment letting me know where I can improve or if I should cover a specific topic! - แนวปฏิบัติและการใช้ชีวิต
![CAMPปลิ้น | EP.79[1/2] แก๊งไทบ้านพาบุกเมืองบั้งไฟโก้ ยโสธรรรร!!!](http://i.ytimg.com/vi/Ldr3_fvTEXk/mqdefault.jpg)
Make sure to subscribe for more content, I'll be putting out more videos soon on how to build your own app!
Great video. Clear and straight to the point. Well done!
Looking forward to the series!
Great video, Alex! Really helpful 👏
Great to see you making videos again, Alex. please keep posting videos about Shopify app development.
Great to see you making videos again, very helpful thanks man
Thank you! Excited to be putting out videos again 🙂
Excellent video Alex.
Excited to see more of this series :)
Thanks for the support! Excited to be putting out videos again 🙂
so clear, your sample, thank you
Thank you so much for the video, Alex! 🔥
Thanks Harshdeep, means a lot!
Thanks bro, please keep posting videos ❤️
Thanks buddy for the video
veryyyyy good
next tut waiting for it
Big up Alex! 💪🏻
Thanks man, appreciate it!
Good job baby 🥰
thanks
Really enjoying the content. Can't wait for more. As I'm trying to get a local dev environment setup, I am having issues getting ngrok, VS code and Shopify to play nicely together (mac). Seems there's isn't a lot of content on the web on this topic...at least the part about actually how to setup Shopify store URLs and ngrok including authorizations/keys. Any insight you can provide?
What issue are you seeing? `npm run dev` should take care of all the urls, start ngrok, etc.
@@devwithalex Yes, thanks...that's what I'd have expected. ngrok is working fine with my localhost, just can't seem to get Shopify to recognize ngrok. The run dev preview URL continues to reference cloudflare and despite me manually resetting the app settings in Shopify to the ngrok URL, Shopify reverts back to cloudflare.
Hi How to create a crud operation in the Shopify custom app with a database table connectivity.
shopify is recomending the cloudflare insted of ngrock, how to tunnel the development server with cloudflare , without any tunneling it shows as HMAC timestamp is outside of the tolerance range
Hi Alex how do we clone your Git Repo and create the app sync it? I'm struggling to complete part 2 because I started with the base template but when I copy the code over it won't run or copying select parts indicates there are modules missing
You have to make sure to run `npm i` in the project folder. You'll need to run that in the `web` and `frontend` folders as well if you're still getting errors about missing modules
Great Video
I need to know about access token
After installing app how to get access token
It'll be great if you can create video related this also
Hey mate, I'm glad this video series exists but I'm not sure if I have the skill needed to follow along. I've worked on the front end as a freelancer for half a year now, adjusting Shopify themes, adding custom Javascript and Liquid etc. But I haven't used react or learned any backend coding.
What are the steps to go from this skill set to developing a Shopify app.
I'm thinking I ought learn some react and node.js in that order before trying to follow your course.
Would appreciate your thoughts. I'd love to move towards Shopify app dev.
Hey! Yeah, this series is more of a high level walkthrough for people familiar with the tech stack, but I will be making more general programming videos going over React and node later. If you are familiar with JavaScript, then picking up React will be quick as it is just a framework for building more complex solutions using JavaScript. So I’d recommend starting to learn React now. Node is essentially just JavaScript on the server, so you’d just want to learn the basics of express which is a node framework for building servers.
Again, if you’re familiar with JavaScript then it won’t be too hard to pick up the rest from there. Thanks for watching!
@@devwithalex Thanks for your reply So react, node.js and express it is then. I will come back here once I have some grounding in those 👍👌
Not getting how to connect my app with ngrok
Hi, Please explain setuping shopify app backend along with authentication and how the mandatory webhooks works in the backend. Will be really grateful to you
Thanks for the request! We'll be building an app together through the next videos and I'll for sure explain all of that, I should get to those topics within a few weeks. Follow along and keep an eye out!
@@devwithalex Thanks a lot. Really excited for the app. Eagerly waiting for the next part of this series.
now the project structure has completely changed can you make a updated video please
Yes I’ve got one coming soon!
I dont have the map helpers and middleware
So the new generated CLI app has a different structure, to follow along exactly like in the video you can fork my repo here: github.com/RAAbbott/Build-A-Shopify-App
But, I'd recommend using the updated CLI template for any new apps
Hello RAA,
I am getting a ngrok not started error with no Url.
Can you please tell me how to fix it?
I am using the windows system.
Hey Pramod! Did you set your ngrok auth token already? It should have asked you that during the setup process
@@devwithalex Yes, I have set up the auth token.
Okay, if you want to send me an email alex@devwithalex.com I can help you out better there, with screenshots and such. Or if you are on twitter you can DM me @devwithalex
@@devwithalex Thanks. let me DM you in Twitter.
Nice stuff here, but my Windows terminal says there's been an error. It is necessary to install Git, so I did. Even after this, it still shows the same error! What the heck?!
What is the error you're seeing?
@@devwithalex Today I tried all again and I guess that it just needed a restart :D
One thing that was weird was that it didn't ask me for the auth token.
You missed the part where you have to run ngrok
With the template provided by shopify it's actually taken care of already when you run `npm run dev` 🙂
Alex could you make a vid Shopify app dev with Python please. There is not much help available.
Thanks.
Sai
I haven’t built a Shopify app with Python before and I’m focusing on NodeJS for now, so I won’t be making one anytime soon unfortunately!
Hello, i am creating an app with Cli version 3.30.1, i want to make my app non embedded. i already disable embedded app from partners account, also commented out the app bridge code and in shopify.js i have done isEmbeddedApp:false. and getting an error of Session was not valid. please guide me for this
Hey I am getting the same issue brother
Session handling is different for non-embedded apps, I've only ever done private non-embedded so didn't really have a need to do the whole auth flow there. I will look into this though and make a video going over it in the future!
In the meantime, take a look through the OAuth related docs since that's what you need to authenticate users for non-embedded apps shopify.dev/apps/auth/oauth
@@devwithalex thnaku for your response i will look forward to it. Also if you can assist me in making post request as it required headers. it would be grateful . thank you so much.
Now add Webhooks ! Documentation and Reality are far apart right now
I know they've made some updates recently so the documentation might not be caught up yet or something. I'll be making a video for webhooks for sure though!