Kicking GitLab’s Tires: Launching a Static Website
Is GitLab really so easy to use?
GitLab.com is gaining a reputation for being a simple, streamlined version of not only its Git version control competitor GitHub, but also many other CI/CD tools including Jenkins and Docker.
Let’s try to build and deploy a static website on GitLab.com. All you should need is a GitLab account and a credit card for validation when prompted.
Let’s see how easy it really is!
Step 1: Login and Click “New Project”
First, log into your GitLab account and go to your Projects page. Click the “New project” button on the right end of the page:
The next screen you will see will give you options on how to create your new project:
- Create a blank project,
- Create from template,
- Import project, or
- Run CI/CD for external repository
For this tutorial, we are testing how easy it is to launch a website using GitLab, so we will use the “Create from template” option.
Clicking this option will take us to the following page; a list of the built-in project templates GitLab has to offer:
I will try using the “Pages/Plain HTML” template. Clicking on the blue “Use template” button will take you to the following page, where you can enter a project name, project description, select the visibility level, and adjust the project URL:
After entering your desired values, click on “Create project.” After the template is imported, you will be taken to the page for your new project. Note the pre-existing contents of the project: a “public” directory, the .gitlab-ci.yml file (required to enable CI/CD on GitLab), and README.md. The public directory contains two files: index.html and style.css.
Step 2: Run the Project Pipeline
Navigate to the CI/CD tab on the left project menu, and click on “Pipelines.” The project branch and any variables to be used in your run may be entered here. Click on “Run pipeline” to initiate the run.
The following graphic will show the progress of the current pipeline run, which was “running” in my case:
Then turned to “passed” when the pipeline run was successful:
In your list of pipelines, GitLab will show the current status, pipeline ID, triggerer, commit, stage, and duration of the newly created pipeline:
To view the template’s index.html webpage, navigate to the “Pages” tab of the project and click on the project link you configured earlier under “Access pages”:
My run of this project template resulted in this webpage:
For me, this whole process took less than five minutes! Pretty painless and quick for setting up a project that can be utilized and expanded with GitLab’s impressive suite of CI/CD tools.
Of course, starting with a template is merely the beginning of building a project that suits your particular needs. If you have cloned the template repository, you may edit the template files to your specifications.
Thanks for reading, and have fun exploring GitLab!
Connect with me on LinkedIn: www.linkedin.com/in/jay-van-blaricum/
