Gatsby Tutorial #22 - Continuous Deployment

so another way that we can deploy our website using netlify is to set up something called continuous deployment and this is where we upload all of our project code to a github repo and then we can hook up our netlify account with that github repo so that it automatically deploys the main branch in that repo and then in the future if we ever make changes to our website we push those changes up to our github repository we merge those changes to the main branch netlify is automatically going to pick up on that change and it's going to rebuild our application and redeploy it so we don't have to manually do it every time we update the website so that's pretty nice so i'm going to demo this by creating a new repository which i'm going to call web warrior website like so now this can be public or private really doesn't matter i'm going to create this repository and then once we've done that we need to push up our code from this project to that repo so to do this i'm going to copy first of all these first two lines of code i don't want to push it right away so i'm going to paste those in to add the origin and to use the main branch and then what i'm going to do is add all of the changes we've made to this project so to do that i'm going to say git add and by the way if you want to learn more about git and github i've got a complete playlist on this very channel the link to that is going to be down below so git add and then i'm going to say git commit m and we'll just say site for the commit message really doesn't matter and then i'm going to push that up so git push origin main like so so we're pushing up that main branch and now hopefully if we come over here and refresh we should see if we do it again no we don't is it done yet okay it's still uploading so let's just give this a second all right cool looks like it's done so now if i refresh we should see that project right here okay cool let me just go into the source and make sure we have all of the pages yep looks about right all right so how do we then hook this up with netlify well pretty simple all we do is say we want to make a new site from git so this is for continuous deployment like we've said we're going to use github so it's going to authorize you right here and then you need to search for your repo now i want to search for web warrior website like so press enter and this is the repo i want to use so the main branch is the one we're going to deploy we don't need to change anything else we can just click on deploy site and netlify is going to hook up with that repo and try to deploy the main branch for us all right and then once that's done we can just click on this url and we should be able to see the website which we can and by the look of things everything is working awesome all right then so what if we wanted to make a change to the website well all we need to do is first of all we could come down here to our local project and we could check out a new branch so i could say git check out a new branch and we'll just call this home page to make changes to the home page all right so if i open up now the source folder and go into the pages then go into index which is the home page i'm just going to add a lot of exclamation marks to that so a simple change but just to demonstrate the process so now what i'm going to do is add all those changes that single change i'm going to commit that and i'm going to say home page text for the commit message and then i'm going to push it so get push origin and the branch was called home page so we're just pushing up a new branch here to our repo and then once we've done that we can go over to the repo right here we can see home page had recent pushes so let's compare and make a pull request um yep i'm going to make a pull request for this so we can merge it into the main branch so we'll merge that into the main branch but before we do that you can see there are some checks in progress and that's coming from netlify so it's just doing these checks first of all before we merge this into the main branch and then once those checks have passed we can merge this so let's merge it and confirm the merge right there and then once this is done we can then come over to our site overview over here you can scroll down here and see now we have a new build going on so once this is complete it will publish it for us and we should be able to see that update over here when we click on this address all right so now that's done we can scroll back up i'm going to click on this and we can see that update right here so my friends that is how we set up continuous deployment with netlify and that is also the end of this series so i really hope you enjoyed it and i will be doing more advanced series on gatsby in the future maybe with some kind of headless cms could be wordpress or maybe something like contentful we'll see but more advanced tutorials are coming in the future if you enjoyed the videos my friends please do not forget to share subscribe and like and i'm going to see you in the very next series