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