Hey there guys, I'm Nadir Abbas and in this tutorial, I'll be showing you how you can enable auto deploy In Gitlab using Gitlab CI So what we want to do in this tutorial is when you push code to your Gitlab repo it should get built and deployed to your web server whether it's a VueJS app, Angular or React app or either a Laravel app Or any kind of application if it's a node.js app You can install all the dependencies and then deploy it. If this is a VueJS or a front-end framework app you can install dependencies as well as build it and Then deploy it. If this is a Laravel app You can migrate any new migrations after deploying it So let's get started We can divide this into three steps. The first is going to be installing a Gitlab runner, Gitlab runners are Services that run that sit on your server on your web server Where you want to deploy your code and they are typically Linux servers So you will install this runner on to your web server whenever there's a push made to the repositories and code is pushed Gitlab will automatically trigger a pipeline. And a pipeline can contain a lot of jobs and to run those jobs It's a job of this runner. Let's get started and install it Gitlab Docs, which tells us how we can install it--a Gitlab runner Binaries are available for Windows Mac OS and Linux for demonstration. I'll be using Linux server I will not be using in the actual Linux server. They'll be using a virtual machine Which will work fine This is a terminal okay, so we scroll down here and there's a list of commands that we wanted to run if you want to install the Gitlab Runner The first command being this: Let's copy that and paste that in here. Okay. This is--what this command did is It used the curl library to download a binary--from binary from this URL To this directory /usr/local/bin/gitlab-runner Now what we need to do is make this Binary executables so we can install it. Let's run this command The next command is to create a Gitlab CI user or in other words to create a Linux user a standard Linux user dedicated to running jobs On the runner So basically with the jobs that runner will run on your web server will use this user and not the root user. I Already have done this so I won't do it you can do it. Sure. The next is install actually installing that that finally we just downloaded and We're telling it to user Should be gitlab--It should use the gitlab-runner user To run its jobs. You can also specify any other user here root such as root here Here but that is not recommended So let's install it. It failed to install because I already have it now we will start it and It's already running step two is to Register the Gitlab runner on Gitlab. So I have got this repository It contains a VueJS app, which I just cloned from a github repo Okay, so we've got the app What we need to do is--we got the repository I meant, and we needed to register a good lab runner on--in this repository The runner we just installed here. We need to register that runner into this repository Let me go to settings and CI/CD We go into the runners section and then we first disable shared runners Because now we got a dedicated Runner, we don't need shared runners. Then we need to copy this token and then we need to go back to our server and Actually run register sudo gitlab-runner register https://gitlab.com Token, some description can be dedicated runner Make sure the tags are empty. Let's hit enter and Write shell here because we are using shell as the executors of the commands that will be building and installing dependencies We don't need docker here. So the runner is registered. Let's see let's verify that by reloading this page and see if it is you can see here and You can see caution sign before it that that basically means hasn't been connected yet That's because it hasn't got a job yet. It will get a job once we push some changes With a .gitlab-ci.yml file included in the root directory of our pro--of our project so Now we'll be creating a .gitlab-ci.yml file. What this file does, is, it contains all the commands that the runner needs to execute to successfully build an Application and install any dependencies, okay So first we define stages and you can have multiple stages with any names I will for simplicity have this this deploy stage? You can have build, test and deploy And In the script section, we will write the commands that need to be running So if this is a VueJs app, firstly we need to install all the dependencies Secondly, we need to build the app building in a--Vue app You get a dist folder here in the root directory, which you want to deploy. So what I will do is I'll grab every content of that dist folder and put in my Apache root directory where all gets served if I go into the server and go into Mozilla Firefox, you can see this page about Ubuntu default page and this is the IP address to that server so we'll be pushing code to get lab and the runner will build the app and This content as you can see here will change into that new app that you just saw here. So to do that After building we need to copy Recursively dist's everything that's inside this folder into var/www/example.com you need to specify your own path here. Grab everything from this put it here in example.com example.com/html, but we can make another check here that This, by the way, we are using bash syntax here so we can do an IF statement This is basically the branch name that is being pushed If it is the master branch then only then we want to deploy actually deploy the code, right? Otherwise, we don't make sure to end the if statement here. Let's save this file and Commit it and push it to Gitlab Once you have pushed you need to go to hover-over CI/CD and pipelines You can see here a job, which is in pending state Because it hasn't been picked up by the runner Which is sitting on this server We just need to wait also you can see that deploy job is pending a A Pipeline can have multiple jobs any stage here is basically a job and a pipeline Can have one or more jobs in a sequence They will run in a sequence based on how they were defined the order they were defined with as you can see now It is running and the deploys running You can actually click on that job to see its log you can see here first it initialized Git repository Then it ran npm install as you can see that the installer ran, and then build ran But it got an error at this--this expression it requires a semicolon here and then a "then" here. So I'll just quickly push. Our new job is running with the fix I Just made in the syntax and as you can see here The job has succeeded and now we go to our machine here You can see the same app built and deployed to that server So this is how you--how you add auto deploy to Gitlab. You can also--there are a bunch of these kind of Variables that you can play with you can check that out at gate lab. Thank you for watching the video
