Deploy static HTML pages using GitLab pages and CI pipeline (Custom domain setup)

Hello world,

This blog explains about how to deploy a static html page using gitlab.

Step 1: create a .gitlab-ci.yml in root folder and paste below code

image: alpine:latest

pages:
  stage: deploy
  script:
  - echo 'Nothing to do...'
  artifacts:
    paths:
    - public
  only:
  - master

Above code is for deploying a static page and default route https://example.com will point to index.html file in public folder. ( /public/index.html)

All the above steps can simply automate like below:

When you create a new project you can switch to create from template option, where select pages/PLAIN Html option

This will create all the gitlab YAML file + pipelines.

Step 2: pipeline and custom domain creation

Step1 will create a deafult pipeline.

Push your html files under public folder.

By this time you will get a gitlab pages domain like https://neoitotech.gitlab.io/akcaa from /settings/pages

Here example is my project name.

Now add your custom domain by clicking add new domain button in /setting/pages

Uncheck HTTPS option if you already applied your SSL through Cloudflare or any other network. Add your domain like below and click on create domain button.

Step 3: Add the A Record and TXT record like below in your DNS panel.

The above IP address points to gitlab.

Hit your domain in browser.
Ta da! your site is live.

Happy coding 🙌🏻

Subscribe to newsletter
Need more tech news? Tune in to our weekly newsletter to get the latest updates