Workshop · hands-on

DevOps Essentials — Git & GitLab Lab

Practice the core Git workflow — clone, branch, revert, commit, push — and GitLab collaboration features. Everything happens inside Visual Studio Code, using its integrated terminal and the telekom-app test project.

← All courses
0 / 10 done
Prerequisites — check these before you start
  1. You must have an active gitlab.com account
  2. You must share your GitLab email with the instructor using the Share your GitLab email form, so you are added to the lab repository
  3. You must have a local Visual Studio Code installation
  4. You must have Git installed locally — VS Code's Git features (Source Control, branching, Graph) run on the git binary underneath. Verify with git --version in any terminal: Windows, macOS: brew install git, Linux: sudo apt install git-all
PART 1

Basic Git functionality — inside VS Code

Clone the project with Git in VS Code’s terminal, work on your own branch, fix history, and push your changes.

Create a GitLab Personal Access Token
This token is the “password” Git uses to authenticate with GitLab — you will need it for cloning and pushing.
GITLAB
1. Log in to GitLab

Open gitlab.com in your browser and log in to your account.

2. Open your preferences

Click your profile picture in the upper-right corner and select Preferences.

3. Open the personal access tokens page

In the left menu, hover over Access and select Personal access tokens.

4. Generate a legacy token

Click Generate token and then choose Legacy token.

5. Name it, set the permissions, and save the token

Give the token a name (e.g. workshop-token) and check the required permissions under Scopes: read_repository and write_repository. Generate the token, then copy it immediately and save it somewhere safe — GitLab shows it only once (it looks like glpat-…).

Why a token? Git over HTTPS cannot use your GitLab web password — the Personal Access Token is what you type when Git asks for a password.
Clone the repository & open it in VS Code
Clone https://gitlab.com/telekom-devops-workshop/telekom-app.git using VS Code’s integrated terminal.
VS CODE
1. Open Visual Studio Code and the integrated terminal

Open Visual Studio Code, then open the integrated terminal: View → Terminal (or Ctrl+`).

2. Run the clone command and give your credentials once
Terminal — VS Code
# store credentials on disk, so Git asks only once
git config --global credential.helper store

# clone the project
git clone https://gitlab.com/telekom-devops-workshop/telekom-app.git
Credentials — give them once: if asked, the Username is your GitLab email and the Password is the Personal Access Token from step 1. The credential helper saves them to ~/.git-credentials — afterwards they are never asked again, not for clone, pull or push.
Security note: the token is stored in plain text in ~/.git-credentials. Fine for the workshop machine — just keep it in mind on shared systems.
3. Open the project

Open the cloned project: File → Open Folder… → select the telekom-app folder.

Create your own branch and switch to it
Name it workshop-<participant_name> — e.g. workshop-john.
VS CODE
1. Open Source Control and create a branch

Open the Source Control view (Ctrl+Shift+G), right-click the branch name at the top of the view and choose Create branch.

2. Pick a name for the branch

Type your branch name: workshop-<your_name> (e.g. workshop-john) and press Enter.

3. Switch to the branch

Confirm the switch — the status bar (bottom-left) now shows your new branch workshop-<your_name>.

Prefer terminal?
$git checkout -b workshop-<your_name>
Revert the bad commit “Quick code refactor”
Locate the bad commit in VS Code, copy its hash, then undo it with the revert command in the terminal.
VS CODE
1. Copy the hash of the bad commit

Open the Source Control view (Activity Bar icon), expand the Graph section, right-click the last commit“Quick code refactor” — and choose Copy Commit Hash. The hash is now in your clipboard.

2. Revert it from the terminal

Open the integrated terminal and run the revert command, pasting the copied hash in place of <hash>:

Terminal — VS Code
git revert --no-edit <hash>
Check your work: the Graph should now show a new “Revert …” commit on top of your branch.
Create notes.txt and ignore it via .gitignore
Add a personal notes file and tell Git to never track it.
VS CODE
1. Create a notes.txt file in the repository

In the Explorer sidebar, click New File… in the repository root and name it notes.txt. Add any text you like inside.

2. Add notes.txt to the .gitignore

Open the .gitignore file and add this line: /notes.txt. Save the file with Ctrl+S.

3. Stage the change and commit

Open the Source Control view (Ctrl+Shift+G), stage .gitignore with the + (Stage Changes) button, type the commit message Add notes.txt and ignore it and click ✓ Commit.

Verify: notes.txt does not appear in the “Changes” list — Git is ignoring it.
Prefer terminal?
$git add .gitignore notes.txt git commit -m "Add notes.txt and ignore it"
Change the greeting message in home.html
Update the greeting in public/html/home.html to Telekom careers service! and commit it.
VS CODE
  1. In the Explorer, open public/html/home.html
  2. Find the greeting message and change it to: Telekom careers service!
  3. Save the file (Ctrl+S)
  4. Open the Source Control view (Ctrl+Shift+G) and click the changed file to review the diff (before vs. after)
  1. Stage the change: hover over home.html and click the + (Stage Changes) button
  2. Write a meaningful commit message, e.g. Update greeting to Telekom careers service, and click ✓ Commit
Prefer terminal?
$git add public/html/home.html git commit -m "Update greeting to Telekom careers service"
Push your branch back to GitLab
Publish your local branch — with all your commits — to the remote repository.
VS CODE
  1. Open the Source Control view (Ctrl+Shift+G)
  2. Click the Publish Branch button (on first push it appears instead of Commit — or use the cloud icon in the bottom-left status bar)
  3. If a sign-in window appears, complete it in the browser to connect your GitLab.com account
  4. Confirm the push and wait for the success notification
Credentials: if asked, Username is your GitLab username, Password is your Personal Access Token from step 1. Git usually remembers it afterwards
Prefer terminal?
$git push -u origin workshop-<your_name>
PART 2

Using GitLab.com features

Collaborate through GitLab’s web interface: merge requests and code review.

Log in to GitLab and open the telekom-app repository
Browse to the telekom-devops-workshop/telekom-app repository on gitlab.com.
GITLAB
  1. Open gitlab.com in your browser and log in to your account
  2. Use the search bar at the top (or Projects → Explore) to find the telekom-devops-workshop/telekom-app repository — or open it directly: gitlab.com/telekom-devops-workshop/telekom-app
  3. Open the repository page — you should also see your pushed branch under Code → Branches
Open a merge request: your branch → main
Request to merge your workshop-… branch into the project’s main branch.
GITLAB
1. Open the merge requests section

In the repository page, click Merge requests in the left menu.

2. Click “New merge request”

Click the New merge request button at the top.

3. Select source and target branch

Set Source branch = workshop-<your_name> and Target branch = main, then click Compare branches and continue.

Tip: your pushed branch may also show a “Create merge request” banner right on the project page — clicking it pre-fills source and target for you.
4. Fill in details, assign reviewer and create

Add a Title and a short Description of your changes. In the right sidebar, find the Reviewer section, click Edit and pick a teammate (or the instructor). Then click Create merge request.

5. Your merge request is created

The merge request overview page opens — your changes are now ready for review. Done!