What is Shopify API & How To Build An App, Seriously

so what is Shopify API this is one of the questions that I kept hearing for years and today I will be giving you a brief and quick explanation of what it is but in order to fully understand what is Shopify API you need to know first what is an API so API stands for application programming interface which for non-t people won't make any sense at all I mean what even is that but basically API is a way for two or multiple computers to communicate with each other now let me give you an example let's say you're rich Let's just let that sink in for a little bit okay so let's say you're rich and you have an office with Alexa and you can talk to Alexa and say Alexa please turn on the lights or play my favorite music and finally Alexa will follow those instructions and it will communicate with other apis since you ask it to play a music as an example then it will also talk to a music API to get those music and play it through your speakers so that's just an example how API Works basically just computers talking to each other just to give you what you want so now let's use Shopify API as an example now let's say you're a web developer and you're developing an app or a web application that will display the products from your Shopify online store how can you do that that's right you're going to use Shopify API so that being said what is Shopify API Shopify API is a collection of apis that allow developers to extend Shopify online stores built in features there's the admin API which is the core of Shopify this is the API that you'll be using to read and write products customers content Etc there's also the partner API where you can access the data of your partner's account there's the storefront API the messaging API the customer account API and much more now this is where you will need the knowledge of web development and also you should know the ecosystem of Shopify because in order to communicate with Shopify API you will need to authenticate yourself because obviously you can't just ask Shopify API to give you those data without its approval now with the release of Shopify CI it made it very easy to develop a Shopify app and all of this authentication that I'm talking about it's not really a big problem in because they're all built for you out of the box well that's what I'm going to show you next but before we begin if you notice I'm wearing weekly how merch if you're interested you can check out our merch down in the description below or it should be shown under this video you can check it out you know it's a good um present for yourself and you know this Christmas yeah I actually really like it it's very comfy it's simple uh what else to say say I mean you can just go to the description below and use the coupon code Shopify API to get 10% off also we are finally doing live stream so if you want to join us it will happen every Friday Saturday and Sunday but I will inform you guys on how it's going to be because it can change obviously but yeah we're finally doing that our first live stream it was really fun so shout out to everyone who joined me last time you guys are appreciated but anyway enough of talk let's start and use Shopify API okay so we're back here in our computer now the first thing that we need to do is to use Shopify s to create a new Shopify app however I'm going to correct myself because now you no longer need to install Shopify CLI to create a new Shopify app now according to Shopify the requirements are just the following you need to install node and its version is 18 or higher and you should have no. JS package managers like npm yarn or PNP pm and last but not least you should have get installed the browsers by default I assume you already have those and if we scroll down here according to Shopify if you're building a Shopify app you don't need to install Shopify CI globally instead you can just use the following command npm in it and the package at Shopify app latest so that's what we're going to do next let's go back to vs code and here in my Shopify apps directory I'm going to create a new project by running that command so new terminal and here I'm going to type npm space init space at Shopify slapp at latest and then it's going to ask me for a name let's call our Shopify app weekly how and then next up it's going to ask you get started building your app using remix or by adding your own extension your first extension now it's recommended to use start with remix so let's select that and then next stop is going to ask you which language do you want to use is it JavaScript or typescript let's use JavaScript and then after that it's going to start downloading the template from shopify's GitHub repository it's also going to start installing the dependencies now this is going to take a while so while we're waiting make sure that you're sub to the channel and hit that like button and make sure that you turn on that notification Bell button so you won't miss my next upload and once the finished it should give it the following success and then the name of your app is ready for you to build now the next step is to run the following commands see the weekly how and this one is just optional except the npm Run Dev so that we can see and install our Shopify app to our development store so let's start by changing our current directory to the project folder so here in terminal type CD and then the project folder and now we are inside of our project we can now start running npm run Dev however before we continue let's open our project and notice that we have now the following files the file that I want to open here is the Shopify app. TL or toml and you will find here the following Scopes and this is where you'll be adding your access Scopes if you want to access your Shopify themes then you'll put here right themes or read themes if you want to read the products you should have here read produ products but if at the same time you also want to create products using your Shopify app then you will add wror products I mentioned that if you want to access your Shopify themes that you can also add read uncore themes and if you want to write or customize your Shopify themes using your Shopify app that you can also write themes just like that and now we can go back to our terminal and run npm runev and after that it's going to ask you which Partners organization is this work for for you should select the partner's account that you have in your account I'm going to select development next up is going to ask you would you like this to be created as a new app or do you want to connect it to an existing app now I'm just going to create a new app so I'm going to select yes and then it's going to ask me for a name if you selected the existing app then it's going to ask you which app would you like it to be connected but since I selected yes I want to create a new app it's going to ask me for a name I'll just type the name of my Shopify app and now notice that my Shopify app. toil file is updated going back here in the terminal it's going to ask you which store would you like this to be installed I'm going to install the Shopify app to my weekly how live coding session development store so I'll just press enter and lastly it's going to ask you would you like Shopify to automatically update your app's URL you can either select yes or if no then you will have to manually update it yourself s I'd like it to be automatically updated and we're finally done the next is to install our Shopify app to our Shopify development store so you can do that by pressing P or by clicking this URL here it's much easier to just press P so just press p and that should open a new browser Tab and it's going to give you the following installation Page by going back here in the terminal you'll find information about what's happening inside of your Shopify app so let's go back here in the browser and try to install our Shopify app now one of the things that should be shown in your terminal is the following Shopify app info it's basically saying that the online store hasn't installed this Shopify app yet therefore the Shopify app is going to talk to the Shopify API and tell it to hey I want you to authenticate this online store before it can access our data that's why we had that installation page and the Shopify API is also going to inform the developer or you that hey after this authentication you will have access to this online store another example that I can show you is creating a product using Shopify API by going back to the Shopify app you will see this generate a product button by pressing this button your Shopify app is essentially talking to the Shopify API saying hey Shopify API I want to create a product and give it to this online store can you do that and then it's going to load for a little bit waiting for Shopify APS response and voila it will give you the following response and that's pretty much it for this video If you guys enjoy this video let me know by liking this video smash the like button I'm pretty sure that thing is going to light up because that's how YouTube works now did it light up I hope it did light up but anyway thank you so much for watching if you have questions or comments let me know as well in the comments below and once again we're going to do live stream every Friday Saturday Sunday but obviously it can change I'll also inform you in the community page so don't forget to check it out as well anyway thank you so much for watching and I'll see you next time bye

Channel: WeeklyHow

Views: 10,274

Keywords: shopify, weeklyhow, shopify cli, shopify developer, shopify development, weeklyhow shopify, shopify remix, shopify app development, shopify apps, shopify app store, shopify api, application programming interface, what is shopify api, what is shopify app, what is an api, shopify programming, ecommerce api

Id: aX4zHLlkk4M

Length: 10min 9sec (609 seconds)

Published: Tue Dec 19 2023