Reference CI-Codes for Hosting Static Sites / Web Applications over Gitlab Pages

January 22, 2022 | Arunachalam E

NOTE: The following docs assumes that you have basic knowledge on hosting, how CI/CD works and Gitlab pages. If not please head over to our docs which would help you in getting started with some of these topics. To understand about CI/CD and Gitlab pages hosting

.gitlab-ci.yml reference for handling application/site built using core HTML/CSS/JS

# This file is a template, and might need editing before it works on your project.
pages:
  script:
    - cp -r . .public
    - mv .public public
    - rm -r .public
  artifacts:
    paths:
      - public
  only:
    - main # Update your branch name accordingly

.gitlab-ci.yml reference for handling handlebar application/site

# This file is a template, and might need editing before it works on your project.
# For specific version change the version number and to use latest version use - node:latest
image: node:14.18.1 

before_script:
  - npm install

# This folder is cached between builds
# http://docs.gitlab.com/ee/ci/yaml/README.html#cache
cache:
  paths:
    - node_modules/

pages:
  script:
    - npm run build
  artifacts:
    paths:
      - public
  only:
    - main # Update your branch name accordingly

.gitlab-ci.yml reference for handling application/site built using Gatsby

# This file is a template, and might need editing before it works on your project.
# To contribute improvements to CI/CD templates, please follow the Development guide at:
# https://docs.gitlab.com/ee/development/cicd/templates.html
# This specific template is located at:
# https://gitlab.com/gitlab-org/gitlab/-/blob/master/lib/gitlab/ci/templates/Pages/Gatsby.gitlab-ci.yml
# For specific version change the version number and to use latest version use - node:latest
image: node:16.13.0

# This folder is cached between builds
# https://docs.gitlab.com/ee/ci/yaml/index.html#cache
cache:
  paths:
    - node_modules/

pages:
  script:
    - yarn install
    - ./node_modules/.bin/gatsby build --prefix-paths
  artifacts:
    paths:
      - public
  only:
    - main # Update your branch name accordingly

.gitlab-ci.yml reference for handling application/site built using React library

# This file is a template, and might need editing before it works on your project.
# To contribute improvements to CI/CD templates, please follow the Development guide at:
# https://docs.gitlab.com/ee/development/cicd/templates.html
# This specific template is located at:
# https://gitlab.com/gitlab-org/gitlab/-/blob/master/lib/gitlab/ci/templates/Pages/Gatsby.gitlab-ci.yml
# For specific version change the version number and to use latest version use - node:latest
image: node:16.13.0

# This folder is cached between builds
# https://docs.gitlab.com/ee/ci/yaml/index.html#cache
cache:
  paths:
    - node_modules/

pages:
  script:
    - npm install
    - npm run build
    - rm -rf public
    - mv build public
  artifacts:
    paths:
      - public
  only:
    - main # Update your branch name accordingly

NOTE: Most of the cases the above code samples would operate without any issues unless some code tampering is done to meet your needs.