GitLab Advanced CI/CD - Hands-On Lab: Review Apps

This Hands-On Guide walks you through the process of creating review apps

The purpose of this lab is to create a review app from a Node.js application. A review app is a temporary application environment automatically created for each merge request in a project. It allows developers and stakeholders to preview and interact with proposed changes in a live, isolated environment before merging them into the main branch.

Estimated time to complete: 15 minutes

Objectives

Create a review app from the Node.js application

Task A. Creating a Web App

For this task, we will be creating a web application to run in our review environment.

Navigate to your project repository.
Select Build > Pipeline Editor.
When we add express code into our index.js file, our tests will no longer be able to run against index.js, since running this will create a webserver that waits for connections. Thus, let’s remove the install deps, test binarysearch and the test linearsearch jobs from the file. Remove the jobs from the .gitlab-ci.yml file, and select Commit changes.
Navigate back to your project repository.
Select your index.js file.
Select Edit > Edit single file.

Remove the binary search and linear search methods, and add the code below, which will run our web application:

const express = require('express')
const app = express()
const port = 4001

app.get('/', (req, res) => {
  res.send('Hello World!')
})

app.listen(port, () => {
  console.log(`Example app listening on port ${port}`)
})

Commit your changes.

Task B. Creating a Review App

In the left sidebar, select Operate > Environments.
Select Enable Review Apps.

Copy the provided script, which will look like this:

deploy_review:
  stage: deploy
  script:
    - echo "Add script here that deploys the code to your infrastructure"
  environment:
    name: review/$CI_COMMIT_REF_NAME
    url: https://$CI_ENVIRONMENT_SLUG.example.com
  rules:
    - if: $CI_PIPELINE_SOURCE == "merge_request_event"

If for any reason GitLab does not display this script when clicking Enable Review Apps, just copy the reference script above to use.

Navigate back to your code repository.
Select Build > Pipeline Editor.
Paste the copied deploy_review job at the end of the .gitlab-ci.yml file.
For our example, we will alter the URL slightly to use an IP address as the URL. This variable $ip is a group level variable created when you redeemed your invitation code. To use this variable, we will also remove the HTTPS since our server only uses HTTP. Below is our finished deploy_review definition:
```
deploy_review:
  stage: deploy
  script:
    - echo "Add script here that deploys the code to your infrastructure"
  environment:
    name: review/$CI_COMMIT_REF_NAME
    url: http://$ip:4001
  rules:
    - if: $CI_PIPELINE_SOURCE == "merge_request_event"
```
Add the deploy stage to the .gitlab-ci.yml file.
```
stages:
  - deps
  - test
  - deploy
```
Now, we can deploy our changes to the Review App. In your deploy_review job, add an image of ubuntu:latest.
```
deploy_review:
  stage: deploy
  image: ubuntu:latest
```

Directly above the script of the deploy_review job, add the following before_script:

  before_script:
    - 'which ssh-agent || ( apt-get update -y && apt-get install openssh-client git -y )'
    - eval $(ssh-agent -s)
    - chmod 400 "$SSH_PRIVATE_KEY"
    - ssh-add "$SSH_PRIVATE_KEY"
    - mkdir -p ~/.ssh
    - chmod 700 ~/.ssh

Finally, update the job script to match the following job definition:

  script:
    - ssh-keyscan -t rsa,ed25519 $ip >> ~/.ssh/known_hosts
    - ssh root@$ip 'mkdir -p /www'
    - ssh root@$ip 'sudo apt-get update'
    - ssh root@$ip 'sudo apt-get install nodejs npm -y'
    - ssh root@$ip 'cd /www/ && npm init -y'
    - ssh root@$ip 'cd /www/ && npm i express'
    - ssh root@$ip 'cd /www/ && npm i -g pm2'
    - scp index.js root@$ip:/www
    - ssh root@$ip 'pm2 start -f /www/index.js'

Here is what your final job script should look like:

deploy_review:
  stage: deploy
  image: ubuntu:latest
  before_script:
    - 'which ssh-agent || ( apt-get update -y && apt-get install openssh-client git -y )'
    - eval $(ssh-agent -s)
    - chmod 400 "$SSH_PRIVATE_KEY"
    - ssh-add "$SSH_PRIVATE_KEY"
    - mkdir -p ~/.ssh
    - chmod 700 ~/.ssh
  script:
    - ssh-keyscan -t rsa,ed25519 $ip >> ~/.ssh/known_hosts
    - ssh root@$ip 'mkdir -p /www'
    - ssh root@$ip 'sudo apt-get update'
    - ssh root@$ip 'sudo apt-get install nodejs npm -y'
    - ssh root@$ip 'cd /www/ && npm init -y'
    - ssh root@$ip 'cd /www/ && npm i express'
    - ssh root@$ip 'cd /www/ && npm i -g pm2'
    - scp index.js root@$ip:/www
    - ssh root@$ip 'pm2 start -f /www/index.js'
  environment:
    name: review/$CI_COMMIT_REF_NAME
    url: http://$ip:4001
  rules:
    - if: $CI_PIPELINE_SOURCE == "merge_request_event"

Select Commit changes.

Task C. Verify the review app

To test that your review app works, let’s create a new merge request.

Select Code > Branches.
Select New branch.
Set the branch name to test_review and select Create branch.
Create a merge request for this branch.
Once you have created this, open the Web IDE from the merge request by selecting Code > Open in Web IDE
Select your index.js file.

Update your res.send to display any message you like. Below is an example:

const express = require('express')
    const app = express()
    const port = 4001

    app.get('/', (req, res) => {
      res.send('Our app is running!')
    })

    app.listen(port, () => {
      console.log(`Example app listening on port ${port}`)
})

Select the source control icon. Enter a commit message, then click the Commit and put to… button to commit your code change.
Wait for the pipeline to complete.
Open your merge request.
Select View app after the pipeline completes.

Lab Guide Complete

You have completed this lab exercise. You can view the other lab guides for this course.

Suggestions?

If you wish to make a change to the lab, please submit your changes via Merge Request.

Last modified March 25, 2026: Make labs more consistent with pipeline editor fix (ba0c6a76)

View page source - Edit this page - please contribute.