shopify developer store
Published on: February 4 2023 by pipiads
Table of Contents About shopify developer store
- How to use Shopify CLI 3.0 for Theme Development and deploy themes to different stores.
- 02 - Creating Fresh Development Store Shopify Theme Development
- 🔥 Shopify For Developers ✅ Shopify Developers In 2023
- Becoming a Shopify Developer in 2022 (The Truth)
- Shopify Functions - a new way to customize Shopify
- How to make a Shopify App
How to use Shopify CLI 3.0 for Theme Development and deploy themes to different stores.
Globe again. in today's video we're going to speak about Shopify CLI 3.6, 3.2, whatever you want to call it, and before we get started, I just want you to know that I have tried it, I have give it a shot and it's really awesome and you will see we will get to all the features in a second. so bear with me. and you will also need to know that the old version will no longer be supported until, uh, like, I think it's 31st May of next year and usually some people still use 10K because, well, some Futures, teamkit has some advantage over the old CLI version, especially for team development. but now, with 3.x, it's really you will see that I think everyone will make great to 3.6 once, once I show these Futures. so, yeah, I'm really, really excited because you will see all the features in this in a second. but before we get started with the code, you will actually need to migrate to the newest version and to migrate they have. if you click Shopify CRI in the documentation, they have a really easy migration guide and especially if you are on Mac, since Michael you have to do, if you have installed it with Homebrew, all you have to do is really click home brew, upgrade Shopify CLI. if you have never installed Shopify CLI in the first place, all you have to do is just Brew, I think, add Shopify CLI and it will go to. it will install the latest version, which is um, which is 3.22 for me. so, yeah, if you are on other uh machines like Linux or revi or, excuse me- or Windows, you probably have installed it with Gem and if you have to, if you had installed it with gem, you need to uninstall the old implementation and install the new, the new implementation using uh, using npm or yarn or pnpm, whatever you like, since it's now hosted on npm because it's a typescript package, it's a node package and it's no longer a ruby package, since the newest version is actually built using a typescript. the old version is using Ruby. the newest version, if you, if we check the GitHub, you will see it's Rewritten in typescript. it's not fully Rewritten in typescript, it's actually a wrapper, especially for the teams part. it's a wrapper over the typescript implementation, over the old Rabbi implementation, sorry. so, yeah, uh, now all you have to do is just click here on global ads at Shopify and it will add Shopify. you will need to install the core package, which is shopifycr day and then install the plugin. yeah, it's a plugin. uh, you will see how the Shopify team commands all are a plugin. it's actually a plugin that is added to the core CLI to support Shopify team Commons. so now, if I actually, once you do that, you will have the latest version. and once you do that, um, you can also still use the old version of the Shopify CLI. uh, but you will have to call it to change the pads, especially if you are, if you have installed it with Homebrew, you will have to change the naming using the pads, like, like we do if you are, if you're ever used python, for example, we have python 2 and python for python 3.. that's, that's reminds me of that. um, the old implementation can still be used. however, as I said, it will no longer be supported until, uh, after May 31st of next year. so, yeah, um, so yeah, let's get started. this Ally is actually can be used to develop apps and develop custom storefronts using hydrogen, so it's an all-in-one solution, which is really awesome, because now we can use once Ally for everything, which is cool. now let's get started. uh, one of the first. before we get started, I just want to make an overview of the commands that we have now, if you actually type Shopify in your command line interface, you will see that we have my platform, my version and my nude node version. also, you will see we have topics. yeah, we have plugins. we have team, which is all the the plugin, which is actually a plugin that is responsible for all the team commands, and you have commands- hello, which is the commands inside the commands of these topics. for example, odds has is. that is a plugin which handles Authentikation. hello is actually a plugin that I've made in jaroc. It's actually an official Shopify plugin which is created to create Tunnels for uh Shopify apps, because if you, if you want to develop Shopify apps, you actually need https and interlock helps you tunnel your, your local developments and teams. and we have a plugins to to list all the plugins that we've installed. and we have basic commands like upgrade. and also now, if you actually before to upgrade shop of iclr, you actually need to to upgrade it with the method that you've used: install it. for example, if I want to upgrade with using Homebrew, I need to type Brew upgrade shop of icli. but now it's really easy. you just have to type upgrade and that will work. and it will. it will also upgrade the plugins, which is cool. I don't have to optimize each plugin one by one. now it will also upgrade all the plugins. that, just like what would you do if you've installed all the packages? you click your yarn- upgrade. it will upgrade, upgrade all node modules. and now with the plugins, we can. if you actually type Shopify plugins, it will list all the plugins. for now, I only have one plugin that I've tried testing it. it's called Tailwind plug-in, which I've made, but it's not finished yet. it's just a basic plugin. I will show you the use and basically what I'm trying to do is to create a way to use Tailwind with Shopify teams and to use the plugins. it's really easy. you have hello, which is like the command that they've created, and Shopify. if you type Shopify, hello world, it's basic plugin, so don't judge me. it prints: it's basic, a basic plugin. all right, it doesn't have any use. but Shopify plugins is really awesome. it's a nice future because now you can really extend Shopify, the CLI, to whatever you want. and now let's discover team commands. uh, by the way, if you and if you want, for example, to add plugins, all you have to do is just plugins, ads, and in the name of the plugin, for example, us. it's the same way you would do if you want to install it using npm or something. but if I type this, for example, it will add the plugin to my list of plugins. and that way, when I type Shopify help, I will make a more in-depth video with with how to use plugins. but now if I take Shopify help, it will actually show the command in the description of the command and what it does. and, for example, if I type Shopify hello, help, it will do. it will do the same. I think. now give me a second help. think I need dash, dash help. yeah, it will show all the like. for example, Shopify hello. the plugin is hello and now I have all of this. it will show all all the examples, the description, all of that for that specific plugin. uh, I will make a video. how about how to make plugins later. so, yeah, let's get started with Team Canada. this is the important part: the team command. now, if I type Shopify team, it will show all the commands that are available. now, if you check this, you will see that some commands were deleted, some were renamed, for example, uh, before, now we have Shopify team Dev. before we had Shopify team serve, which I actually like the renaming, the decision to rename it div, because all the starters- like, for example, vidstarter react, for example a create app react or something, the all uh have a diff command and before I actually create an npm script which I uh to to run the Shopify team serve command and I always call it right yarn, Dave or something I always call the script, the div script. but now we have Shopify team Dev, which is really nice to name, because now we have Shopify T app Dev and Shopify team Dev, which is, which is a good convention. we also have a Shopify team info, which is basically the same. uh, it's not the same, it's. it's not actually the same, but it does the same job. I think with Shopify team am I just like this? uh, before, if you type this command, you will get the info, and now if I type Shopify team info, it will show me all the details. uh, I think it will show also sensitive details like your IP address or something, but now it shows, uh, the store- I think that is configured- and the platform and other informations and we
02 - Creating Fresh Development Store Shopify Theme Development
hey, welcome to another video. in this video we are going to create a fresh um development store on the shopify partner. so far, uh, this is like the starting point and i assume you have watched 10 video in this playlist. if you already know how to use shop shopify, how you can create a partner account, on how you can kill development store, you are good to go. but if you are not, please watch 10 video in this series, because for the rest of it i assume you already know how to navigate around shopify partner. now here we are in the development tab. from here we are going to create a store. just click add store. and here you have two options: either you go manage store, manage your storage for the client, you send a request to them and they accept. you bring changes to the resource. but we are going to create a development store, so let's give it a name, and the name could be anything, as long as someone already is not like getting that name. so, uh, by that they are going to add this extension of that, my shopify. it will be always free to use, but the front page of your store will have a password. no one can see it. that is the limitation. previously, like one year ago, you could disable the password, use development issue for yourself. it had http, it had the domain. you could connect your custom domain and shopify realized a lot of people use it as a landing page and that's why they put the password. you cannot disable the password, which is not a good move, but still, i'm going to give it a name code: inspire. so because this is already taken by someone i don't know, but i can call it div. this is also like reserved, so i should find something that which is not reserved. so i'm going to call it team. yeah, this one is not taken. uh, this is going to be my domain, my email, and then let's enter a simple password. so i will use a basic password. using this password, you can log in directly. so make sure you remember your password and it does not match. let me enter the password again. when i type in front of the camera, i don't know, it is a bit annoying if someone is watching me typing something. that's the same thing. now, here is the option in here: preview, developer preview. if you enable this one, there are some developer apis which is available on the development store and you can not transfer your store, which which means you can create a development store later in the future. you can transfer it to a client. but if you enable this option, you cannot transfer it to a client. so if you are building the whole administrator for the client, adding a product theme and all sorts of this stuff, you should not check out, like, check this one, but i will enable this one. uh, this is where you are going to search for, like, which of the feature you want to check out. i don't want to select anything. i don't know if this is required, but let's go with none. the development preview. this is the address, not my current address. so if you send anything here, it's not going to be me. so, and here is the purpose, i'm just playing around or testing key mode app, so let's save it. it will take a few seconds. i'm not going to update the password, because it will update my partner password. i know which password i use. it will take a few seconds to create the development store for you. so yeah, it is success. let's see if it redirect us to the story one and throughout the course, we are going to use the shopify dev uh documentation extensively. the reason for that is because i want to show you how to navigate around. this is the kind of fusing part. the documentation is not really like a step-by-step guide. all you have to do is, like you have to play a lot with the documentation and you have to find where things are. that's why i want to show you around and how you can navigate, find things. that way you will be more experienced once you finish the course. so this is my development store, just the basic. here is where you see the order, product, customer analytiks, apps, discount and this is where we uh focus a lot. in the theme section under android store, you can see there is one theme called down, which is already here. this is the store 2.0 theme that shopify created. there is a lot of thing we will change in this theme we can like. this is the starter theme. shopify also says: if you check out the documentation, they tell you that you can start using the down, building your own team in here. this is what what we will do, but i promise i'm going to write 50- or not like 40- less good than down, and still our theme will function the same as brown team, because i have checked down. there is a lot of code which is extra, even joystrips, css, all of them i will. i'm going to remove the extra code for you. i'm going to like recreate that and you will notike how much code we can like save we can. we do need a lot of it, but beyond that, it is also about maintaining the team. when you build the theme in the future, your client want to maintain it, like some other developer is working on that. that is also the important thing. a lot of people don't care about that part. they just create the team and say, okay, it is working, fine, nobody is going to extend it in the future. the extending or adding more feature is more important because in the future, um, someone is going to work on that. i want that part to be very easy for you. that's why the theme is open source. if you build it for your client, it will be much easier to to just copy a feature and put it in another theme with zero configuration. so that is what i will do in this video. but here you can preview, you can duplicate your theme and you can preview your duplicated theme. you can download it, you can edit the code. the code editor online is not the best, but it is really good, and you can edit the language, rename the theme if you would like to. but for now let's check out our story in here and this is our store with new product. these are just the placeholder. there is no product. if i go to the products, you can see there is no product and in the next video we will start um configuring our theme and i will show you what tool we can use to configure our theme. there is like which routes we have to go and there is cli, team kid, and we will discuss more about that in the next video. i hope this video has been informative. thank you for watching. i will see you in the next video. you
More:Top 6 Social Media Predictions for 2022
🔥 Shopify For Developers ✅ Shopify Developers In 2023
shopify for developers. hey guys, welcome back to the channel. in this video, i'm going to be showing you how you can use shopify as a developer and what are the different ways that you can use shopify as a good ecommerce platform and a web development platform. so let's get into it now. first off, as a developer, you can go onto shopifydev and start developing for shopify, and this is not going to be the focus of the video. i'm just letting you guys know ahead of time. the focus of this video is going to be how you can use shopify as a tool to sell your services. but if you want to provide this specific service of creating applications, themes, custom storefronts, marketplaces and all of that stuff, you can choose to do that from shopifydev, and that is for people that are very interested in development and are not interested in one-on-one work. but, moving on, make sure that you do click on the link in the description box down below to get started with shopify and start your 14 day free trial with shopify, and i have a link in the description box for you to get started with your ecommerce journey, whether it might be in development or anything else or any product or service that you would like to sell. so, moving on to our actual shopify platform now, once you have logged on to shopify, this is going to be your basic dashboard. now, to create your shopify account, all you need is your email and a store name, and once you have done that, this is going to be your dashboard. on your left, you're going to find your entire navigation plane, then you have your settings at the bottom and then, on your top right, you have your account. now, as a developer, what i like to do is i like to create a website or a ecommerce front for people that want to work with me. so that is the basic purpose that i like to use shopify for, and i find it to be very helpful when i have a storefront where people can already get good estimates of my pricings and of how i do work and how i carry- uh, how what kind of rates i have and what kind of work i'm doing- and to get a good portfolio of my web development skills. now for this, you can just keep it simple and start by designing your online store. so you're just gonna click on online store over here and then i'm gonna click on navigation over here on the bottom left, and then you're going to change your menu, so i have my main menu, and what i like to do is i'm just going to delete these filters that i have created already and i'm going to create my own menu sections. so i'm going to delete all of these, and what i like to do is, first off, i like to add a menu button that says my services, which would actually be the products that i am going to add to my shopify store, and this really helps simplify. you know how you're going to sell different services. maybe, if you do like a certain amount of code for a certain amount of time or money, then you can easily communicate that via the product section on shopify. so you're just going to click on add menu item. now what i'm going to do is i'm going to add the first section, which is going to be my services, and then i'm going to link it to the product section. it is going to be all products and this is going to be all of my services. and then i like to add another menu item called contact, and then i like to link it to my contact page that i have created. i'm just going to click on add and you can create different pages as well. so if you go on to the pages section, i'm going to save these navigations and if you go onto the pages section over here, you can create different pages to communicate any information. so i can add, like a page called my work, and i'm just going to save this page. and once i have saved this page, i'm just going to go on to the navigation and i'm going to click on the main menu and maybe i want to illustrate my work to the people that are interested so i can add a my work portfolio and i can just link the page that i just created called my work. it's gonna take a few seconds to appear over here, but i'm just gonna link the navigation menu item to the page that i created and obviously on the page you're gonna input all the information about your work. so my work portfolio, and i'm just gonna link to pages and now you have my word- my work- and i'm just gonna add that over here. now i'm just gonna save this navigation bar and now i can go on to the online store and i can just click on customize over here. if you're a web developer, obviously you can create your own store with html, but to save time, you can go the easy route and use a template. that is what i'm going to do. so, first off, i'm just going to click on this and you can remove sections by clicking at the bottom left over here. but i'm just going to edit the text over here and i'm just going to write sarah's development portfolio and i'm just gonna click on save and i'm gonna change the bottom text as well from over here- over three years of exp- and i'm just going to go back now. this is going to be my basic home page. now, at the top center you're going to find on your website editor, you have your navigation panel where you can browse different sections of your website. so you can see i have my my services section. so if i go over here, i have all of my products which i haven't added yet, but you can see how it's going to look like. so i have contact, my work portfolio. obviously, in your contact you have the contact form where people can contact you, and then you have your work portfolio and i added my work. i didn't add any specific work, i just added the empty page, but that's just to show you guys how you're gonna do it when you guys are creating your own store using shopify and make sure you use the link in the description when you create your own store for shopify. now what i'm going to do is i'm going to change the name of this and i'm going to start adding my product. so i'm just going to click on save over here and i'm just going to go back. i'm going to go on to the product section over here and i'm going to click on add product. and you might be wondering: okay, i don't provide products. well, you provide services and you're going to add your services on the product. so what i'm going to do is i'm going to add, like website development, and then i can add a description about the work and add some media files as a sample, and then i can add the price, so it could be 50, and then i can. obviously, this is not a physical product, so i don't need to track quantity. and for shipping, you're going to deselect this as well, because this is not a shipping. this is not a product that is going to be shipped. so this is a feature that i find really helpful in shopify, because you can not only sell physical but also digital products. now i'm just going to save this over here, and once i have saved that, i have created my first product. now this is how you create a simple product. now, obviously, you can add, like application development, all of the services that you provide, and now i'm going to show you, guys how you actually change the store name. so what you're going to do is you're going to scroll down on the left, you're going to click on settings over here, you're going to go into store details and you have your basic information and you're going to edit that over here and then you can change your store name to whatever it might be- so it could be sarah's development studio, and i'm just going to click on save over here. and now, if i go on to my shopify store, you can see over here i have like a basic portfolio website up and running. if i click on my navigation over here, i can go onto the my services section, like so, and right now my services haven't been added. so i'm just gonna go into my online store and i'm just gonna click on customize and i'm going to go on to my product section. i'm just going to scroll down, i'm going to go on to my services and what i'm going to do is not only add collection, but i'm going to also add my product. so i'm just going to go back. i'm going to go on to my navigation. i'm going to go into my ad main menu.
More:names for dropshipping business
Becoming a Shopify Developer in 2022 (The Truth)
are you thinking of becoming a Shopify web developer? you're not quite sure how to get started and what is a proven process to start as a freelance Shopify developer or an agency owner. well, in this video, we're gonna tok about exactly that. we're going to cover which programming languages you need to learn, but also how to get your first sales, how to price a project and how to make sure you have a constant flow of projects so you can really take off as a Shopify web developer. what's more, we're going to cover which services are best to offer as a Shopify developer, because it's not just teams and custom themes and installing Shopify for clients. there's actually much more to it, and there is a service that is much more profitable than just selling themes, so it will also cover that. so why should you listen to anything that I say? why am i a credible source for information? well, I just spend nine years on up work myself. it used to be called oDesk, and after that I've also taught many people- over 700- how to also get started as freelancers and agency owners. so we have some pretty good data on how to become a Shopify web developer. so let's dive right into the content. but before we do that, Lee's hit the subscribe button and the Bell notification icon to support the channel and also to get future updates on which services to sell as a developer and how to get there. so what's going on right now is companies are starting to figure out that they need to have an online presence and not just a website or a WordPress website. what they're looking to do is they're looking to sell products on the Internet, and for this, the best current platform is Shopify, because it allows you to have an e-commerce presence on the internet. that is essentially the number one thing that Shopify developers sell. it is not the only thing, as I'll mention in a few minutes, but it's the number one thing and as the first thing a company needs, and it is an online presence, an ecommerce store. so, regardless of the current circumstances, what's actually going on is this industry is growing very rapidly because companies actually have no choice but to get started online, because they're closing shops and they're opening web shops. so let's dive a little bit deeper into how to sell them a project that's between six thousand and twenty five thousand dollars. so let's focus on three services. the number one service is, as I just said, Shopify themes and custom themes. but then there's a second service, and that is CRO, which is convert rate optimization. so once a client has an online shop Shopify store, they will need a conversion rate optimization, which is essentially how to make the website, how to make the e-commerce platform that they have, how to make it convert and not just be pretty, which is equally as important as setting up the shop in the first place. and you can charge for this monthly recurring, but we'll tok about pricing in a few minutes. and then there's a third service, which is the most expensive service that I know of in the Shopify ecosystem, and that is Shopify amps. now, Shopify apps is something you can get into once you are good and delivering stores, and Shopify apps are essentially extensions to the stores. they're extensions to what shop, if I can do, and it's essentially like a mini sass that you're building inside of the shop Shopify platform, and Shopify will promote the sass eater for your client or for yourself if you launch it yourself. if you're just starting out, it's probably better to sell the apps to other companies that are building apps instead of trying to launch the app yourself, because it's quite complicated and requires serious marketing dollars to launch an app yourself, but to sell it as a service, to sell Shopify apps to clients that are currently launching Shopify apps, is very accessible to most developers who have a lot of time on their hands and want to build a real business, or who wants to freelance. so let's tok about the programming languages that you wouldn't have to know as a Shopify developer. so the first one is for Shopify stores and Shopify 8 themes, and that is liquid. you need to know liquid to be able to work in that. also, you need to know html5 and css3. so which framework and programming languages you need to build Shopify apps? now there's a lot of choice here. however, the easiest to start with is Ruby on Rails, because there's a lot of examples and skeleton apps that are built in Ruby on Rails, so that's usually the easiest to store it. however, you can also use PHP, so it doesn't just have to be PHP or Ruby on Rails. really, anything that uses Jason REST API with auth will work. so for conversion rate optimization, this is a service that is a combination service of marketing and tik, because it's something that people buy after they need to build the Shopify store, because then the store needs to make money. it needs to actually convert into sales. now the best way to do conversion rate optimization is to have best practikes in place by looking at the best stores out there and also by testing. now thing is done with tools like Optimizely and also with Google content experiments, and of course, you also need to have Google Analytiks installed on the website to do CRO. so what you do in CRO, in a very short summary, is to test multiple versions of the same page in an a/b test them to see which one converts best for a certain type of traffic. as you can see, this is highly related to marketing. so if you're also interested in marketing, you should also offer conversion rate optimisation as one of your services. so let's tok about getting clients as a Shopify developer. so the easiest way to get started at the Shopify web developer is to join freelancing platforms which have already done the work of generating leads for you, in the sense that there are many projects on there where they're looking for developers and they're looking for freelancers and agencies to create Shopify implementations for them. now what are they looking for? all kinds of stuff, and they're not entirely sure how to explain it. however, if they're looking for Shopify and they're looking to install a Shopify store, optimize it and then build Shopify apps. that is essentially what you can do and you can offer that service, which is in very high demand right now, especially considering the circumstances- is growing. it's exploding. there is low supply and high demand, which means trisys can range between six thousand and twenty five thousand dollars. now if you're selling Shopify stores on upwork or a different freelancing platform, then only then does it make sense to start selling Shopify apps. you really need to understand how a Shopify store implementation works, what clients care about, and then you can create things like Shopify app, because it's a whole ecosystem on apps, just like with Android or Apple, but it is for an e-commerce platform essentially. so you really need to understand what is going on and for this you need to start creating Shopify stores as your first project that are in the range of $6,000, before you can get those big juicy 25k projects that our Shopify apps next up. I have a more detailed tutorial for you on how to get started as a developer on up work, so click the video right here, which goes into great detail, along with many other videos in the playlist, to explain exactly how to use up work and how to become a very successful developer on up work or an agency owner also have many other videos in the same playlist, so click Subscribe and watch the playlist right here now. if you have any questions, I would love to respond to them, so please comment in the comments below and I'll see you in this video right here on how to get started as a web developer on up work.
Shopify Functions - a new way to customize Shopify
hey everyone, jan here codingwithyancom, shopify functions a powerful new way to extend or customize shopify features by writing your own backend code. and yes, you heard that right. for the first time ever, shopify opens up parts of the backend logic for us developers. now, saying it like that probably also raises a few questions like: how does it all work, exactly what do i even mean by back-end logic, how are functions different from traditional apps and how can we get started. but no worries, my friend, because coincidentally, that's exactly what we are going over today and i really hope you find some value in this. so then let's have a look. alright, so then let's get started by answering the how does this all work? and therefore, let's first consider the typical dev stack, which was also beautifully illustrated on the shopify devs channel, so we can think about a store in three simple layers. first of all, we have the database, so that's where all the data is stored, like historic orders, customers, the products that have been created, all the store settings and, yeah, just everything, or every bit of data that needs to be saved or stored somewhere. on top of that, we then have the back end, so this is where the website logic runs, like managing products, incoming orders, new customers get created, and so on and so forth- like all the behind the scenes logic, and the backend also writes the corresponding data into the database or reads it from there. like, for example, if you were to delete a product on the back end, it would also be deleted in the database, right? so that's just one example of the logic that's implemented behind the scenes. on top of the back end, we then also find the front end, which is usually built by using a theme, but it could also be a custom storefront completely built from scratch, and this is where we showcase our products or different data from the store. so the front end could be called the presentation layer. now, on each of these layers there are also different tiknologies that allow us to make customizations or work with the available data. like, for example, on the front end we could use liquid or hydrogen, and the database is directly accessible through the shopify api. now, historically, the only thing where we couldn't make any changes or augment anything is the backend logic, and it's also pretty much where apps would come into play, because they could implement your own routines, write your own logic and then, via the api, you could still read and write data from or to the database. so it's kind of similar to what the backend does, and apps already provide a great flexible way of extending the native features. but they also come with a few drawbacks. first of all, there are certain parts and areas of a storm that you just can't reach by using normal apps, like, for example, the checkout discount logic or the checkout shipping logic, because you can't just inject code right there. and that's already one of the key differences between the new functions and then traditional apps, because with the new functions you will be able to reach these areas, and actually the checkout discount logic is the first place where the backend logic is opened up, and then other key areas will follow over time, and i would also try to add a small list of like upcoming areas somewhere here on the side. the second drawback with traditional apps is that you would need to figure out your own hosting, which in and of itself is not too much of a problem because it's actually not too difficult. but if your app solves some time critikal tasks, then you might face some issues with limited bandwidth if your server can't skate up that quickly. and it's actually very important because with shopify websites, scalability is never an issue. you can have like 10 visitors per hour, but you can also have 100 000 and the website just doesn't crash. and that's actually funny because while i was still working in the agency, we had tons of clients who went to the german equivalent of the show shark tank. so this is like people would present their product ideas, searching for investors, and then all these websites had huge traffic spikes because it was like broadcasted on television during prime time and then our websites never had a problem with that because shopify takes care automatikally. but other wordpress websites were like crashing left and right and developers would be like crawling through the pieces that have once been called their website, begging us like: hey guys, how did you build these websites? and we were like playing it cool, yeah, just just use shopify whatever- and i mean, of course, slightly overplayed here, but based on true story man. we had a good time working in the agency, but anyways, what i'm trying to say here is that if your app solves the time critikal task, then it shouldn't be the bottleneck of the website and you just have to ensure performance. and that's also a new major benefit with shopify functions, because they literally run on shopify's infrastructure and can execute less than five milliseconds, and they also scale up yup to pretty much the largest sale events on the planet. so how cool is that? all right now, the last key difference i think you should be aware of is that, with shopify functions, we can now seamlessly integrate our settings into the admin dashboard. so, for example, if we're toking about a discount function, you can also have the settings or the interface to configure your function right at the discounts, where it actually makes most sense. and with traditional apps, you would always have to go into the apps tab, then bring up your app and then configure everything there. so i think that's an improvement. however, it's very important to understand that the settings for your functions or the interface to configure everything still has to be served through your own server. so that's exactly the same as with traditional apps, and only the time critikal scripts will actually run on shopify's infrastructure. so that's the difference here. and, yeah, i think it's also important to understand that shopify functions are installed through normal apps. so that's a commonality. you can share and distribute everything via the app store, which is awesome because it's like a super large audience. and, yeah, maybe the best way to think about them is that shopify functions are not a completely different thing. it's more like a new feature or something you can add to apps. and if that was confusing by any means, let's have a look at the following lifecycle diagram, because that will make things crystal clear. alright, so it all starts with the app developer, who adds a function to an app. then, when everything is ready, you can deploy the app so that a merchant can install the app on the store, and it's also where you would configure everything using the settings, and these settings come from your app server. then, when everything is configured, the app developer or the app makes an api call with the current configuration of that function. so this is kind of where the function gets uploaded to shopify's infrastructure and then when a customer interacts with the website, let's say, adds a product to the card, that's where your function gets actually executed on shopify's infrastructure. and i think this diagram is the best overview you can get, and it's also available in the shopify docs and if you're looking for that, the link is in the description. okay, so now that we have a high level understanding of how everything works- and i know there's a lot of information to take in also takes me quite a bit to do these summaries here. but now that we understand that, the question would be: how can we practikally get started? what are the best first steps? and first of all, we need to understand that shopify functions are not any different from like normal functions we know from programming. now you have an input, then you have the actual function where you write the logic, and then an output. in order to get started, you just need a few things up front. so first of all you have to pick
How to make a Shopify App
all right, guys. so today, fastest way to build a shopify app from scratch- which at this point might also be the best way to start your own system as a service business or a sas business- because it's actually way easier to build a profitable shopify app than would be to, let's say, create the next profitable android or ios app. and that's mainly because your main target audience is purely merchants, who have money to invest in their business, and if your app solves a problem for them, you can justify a higher price point. now, before we get there, i absolutely need to understand what you're getting into here, because app development is quite advanced and it's not even remotely as beginner friendly as freelancing, for example, and that's why i put together this extremely important comparison just to give you a better overview and some more realistik expectations. so here we are in the powerpoint of truth and justike, where we have apps versus freelancing, and we're going to start with freelancing because there's a little less to cover. and if you want to get into that, you would need to learn html, css and javascript, which is basically the web development stack, and then you would also need to learn shopify liquid as shopify's back-end templating language, and on top of that. you would also need to learn all the ins and outs of shopify as a platform. so that is to say, configuring all the settings like taxes, shipping, creating stores from scratch, setting up good looking or professional looking front ends, knowing about the best themes you can use, knowing about different apps for different use cases, or delivering services like store speed, optimization, migrations, code customizations and theme customizations. so then you would need to learn about theme files, shopify sections, all these kinds of things. but once you become good at all of these, you're pretty much ready to hit the market, and from there you would need to learn how to find clients, how to tok to them, how to position yourself, how to send a good proposal, how to price your services, which can be a bit tricky or overwhelming, especially in the beginning. but i believe, if you commit to learning all of these, that's one of the fastest ways, how you can get to a sustainable income online. okay, now, how does this compare to apps? on this side, the first thing you would need is a good idea, or, to be more precise, you need to solve an in-demand problem, because otherwise your app won't be in demand and you also don't want to be guessing what the market wants. uh, you need some sort of data or reference on this, and there are actually different ways to accumulate that. but, honestly, one of the easiest ways would be that you have worked with real world clients before, because then you see or you get to experience first hand what merchants struggle with, and if you notike the same issue across multiple clients, then it's very likely that there's like a bigger audience or a bigger pool of people having the same issue, and that would be the easiest market to tap into. okay now, given that you have a good idea, then follows the tiknical implementation and you would need to learn html, css and javascript as well- although i would say you need to learn javascript in much greater detail, but it depends a bit on the type of application you build. and then you would also need to learn about shopify as a platform- not as much in detail as with freelancing, but you want to learn about theme files, different features and the different apis. and then you would also need to learn one back-end tiknology or back-end language, and this could either be nodejs or ruby on rails. basically, it could be any back-end tiknology could also be php or something, but these two are the most popular in the shopify space, so i would recommend picking one of these. and then you might also want to learn a front-end framework like react, because that helps to build the interface of your app. and then you also need graphql in order to make api calls, so then you can communicate with the shopify system and update or fetch data. and speaking of data, your app also might need a database, if you need to store customer data, for example. but then you also want to get into the basics of security, because you don't want to publicly expose that data or leak customer data. and then, lastly, you would need to figure out your own hosting, because your app has to run on a dedicated server. so all of this is pretty much the tiknical implementation, and from there you can hit the market. so then your main tasks become marketing. you want to get your app in front of as many people as you can. you need to do customer support as soon as you get the first few installs, and it's going to be a little less if your app solely acts on the back end, and it's going to be a bit more if it also works on the front end, because then it has to seamlessly integrate with a lot of different themes and eventually, later down the road, you can build a team to outsource that or automate that or have something like a first or second level support. but in the beginning you're going to do it all by yourself, and then you will have maintenance, like fixing smaller bugs, or you might also want to deploy new features. yeah, so that's it for apps. so, as you can see, this whole apps topic is quite complex, and that's also why, inside free mode, we focus on the right half side of things, because there we can get your results much more consistent and predictable, and i mean we literally guarantee that we have a 30-day money-back guarantee in place. if anything feels off, you get your money back. so there's like zero incentive for me to sell you something that doesn't work. so keep an eye on that. and with that i think we've accomplished the longest intro in the history of this channel, but i think it was super important. so let's get started. [Music]. hey, jan, here codingthencom. let's get straight to the meta at hand. here's the infrastructure of what we're building today. so we're going to have the shopify site, we're going to have our local pc and we will have a dedicated server where our app runs. so, for example, this could be myappcom, and, yes, you can imagine this to be just a regular website, and the only thing special about it is that only shopify sites can log in here, and once they do so, they get to their dashboard, which contains all the functions and numbers and whatnot. and even though this might look similar to the shopify admin dashboard, we always have to keep in mind it's not. it's myappcom and it's a completely detached website, and it only looks similar to create this cohesive design experience and like the best user experience. and when someone goes to the admin dashboard and clicks on apps and then opens our demo app, what really happens behind the scenes is all this authentikation process and then shopify just embeds our website, myappcom, into their website with an iframe, so they just display our website inside their website and that way, as a user, we can kind of interact with both, and we will get more into the tiknical details, but for now, this will be good enough to get started. okay, now, besides that, we also need to prepare a couple of things in advance, and one thing is your shopify partner account. you can sign up for free, and then you also want to create a development store. that's a store where you can test your app. mine is called how to write an app, and, as you can see, i currently don't have any apps installed. and then the last thing we're going to need is the shopify app, cli. that's an additional piece of software that helps to prototype these kinds of apps, and here you can find the installation process and the requirements. so, for example, you need to have ruby installed on your pc. and don't get confused here. we are not building a ruby on rails app, we are building a nodejs and react app. but the app cli is just built on ruby. so in order for us to use that, we gotta have ruby installed, and then you can just follow the installation process for your operating system and just like with every o.