Week 1 : Project management

Week 1 assignment could be categorized as follows :

• Git & repository setup
• Personal website modification & deployment
• Image and video handling

Git & repository setup

Git is a system that records changes to files over time, that enables multiple users to collaborate, track history, and revert to previous versions if needed. In layman's terms, it's a version control system.

GitLab is a web-based platform that uses Git for version control for hosting Git repositories (like Github), but it's open-source. One of its key features is GitLab Continous Integration (CI), which allows users to define pipelines that automatically build, test, and deploy code whenever changes are pushed to the repository. Without the CI feature and the combination of user-defined yaml file (sets of instructions), changes are not automatically reflected - in this case the user's personal Fab Academy 2026 website - and repetitive manual steps need to be done to be able to see the changes that are made from the back-end to the front-end i.e. not live.

Making changes locally is easier than on a website, but to do so, a connection with GitLab (the remote repository) must be established. Four things that a user need (and recommended) to prepare even before the above could be done :

• Install Git
• Install code editors (e.g. VSCode, VSCodium - for example purpose, VSCode is used onwards). Configure Git at the code editor. Working only with the terminal/command prompt works, but code editors are terminal + better graphic interface
• Create a SSH key and add it to GitLab

Don't forget to configure Git

After installing Git, make sure to set username and email so that your commits are correctly attributed:

git config --global user.name "Your Name"
git config --global user.email "your.email@example.com"

The first, second and third item has been covered in many resources, and therefore only the creation of the SSH key and the settings at GitLab will be discussed below.

After logging into GitLab and navigating to a repository, a user is given two options for authentication for the connection with the repository: either SSH or HTTPS.

Useful GIT terms to remember and analogies

• Repository (Repo)

  Think of it as a project folder or a library where all your code, files, and history are stored.

• Clone

  Make a local copy of a remote repository on your computer or connecting the remote repository to the local computer for the first time Analogy: Making a photocopy of a library to work on at home.

• Commit

  Like taking a snapshot of your project at a specific point in time.

• Push

  Send local commits to the remote repository.
  Analogy: Uploading your updated notebook to share with others

• Pull

  Fetch updates from a remote repository (e.g., GitLab) and merge them into your local copy.
  Analogy: Reading the latest version of a shared notebook before adding your notes.

Source: Analogies and explanations generated with ChatGPT by OpenAI, January 2026.

Authentication using SSH is recommended over HTTPs to avoid repetitively entering username and password during the push/pull process. The SSH key could be generated with the following code by simply copying it to the terminal. User can of course change the "my-laptop-key-for-gitlab" part :

ssh-keygen -t ed25519 -C "my-laptop-key-for-gitlab"

Then press enter until such sentence appear "You public key has been saved in...."

The next step is to retrieve the public SSH key by copying the following code to the terminal :

cat ~/.ssh/id_ed25519.pub

It seems like it doesn't do anything, but user could for example open a notepad and click the paste button - the code is then visible.

So that this public key could be recognized by GitLab, user should :

• click profile image > Preferences > SSH Keys
• click "Add SSH key" > set a title (could be the same as the ssh-keygen generation name as above) > paste the SSH key > click "Add key"

To verify that the connection is successful between the local machine with GitLab, copy the following code to the terminal :

ssh -T git@gitlab.fabcloud.org

If successful, this message should appear :

Welcome to GitLab, @timothy-mintargo!

Users can then start working on their personal website after the git setup is done through VScode. Tutorials are readily available online.

Push updates after implementing changes by the end of the day

Personal website modification & deployment

The table below shows a summary of the three options suggested through the recitation week, comparing the difficulty to start from scratch (learning and actual coding) and the end result evaluated by the website's interactivity :

Tool	Difficulty	Interactivity
HTML & CSS	High (manual coding)	High (fully customizable)
MkDocs	Low	Low (mostly static content)
Docusaurus	Medium	High (supports interactive components)

MkDocs is thus chosen to balance out available time and quality of results.

The starting template to work MkDocs is available at the Fab Academy GitLab repo, and details on how to install the MkDocs as well as Material for MkDocs package are readily available online.

MkDocs is a python package and so a suggestion would be to install environment - the container of these packages - manager tool (e.g. miniconda/anaconda) so that dependencies on other packages could be automatically handled by it. Reasoning to use this tool is similar to VSCode vs terminal.

With the relevant package installed and the right environment activated, the following code could be inputted into the terminal

mkdocs serve

This will start a development server locally - the opposite is called production/live server in which changes made by the user will effect others as it's publicly accessible by anyone on the internet. Changes made by user would be automatically be reflected at the server. If everything is correctly set up, the following should appear at the terminal and the link could be open in the browser.

Remember to place the .gitlab-ci.yml file at the root of the repository, else it will be ignored

Image and video handling

100 Mb is the maximum storage limit for each repository, and so the following strategies are shared during the recitation :

• max 100 kb file size per picture. JPEG and not PNG
• 1-5 Mb for each video

For image compression, a screenshot of the web-based squoosh tool can be seen below :

Only by changing the width, size, fit method to contain, compression to browser JPG, and expected quality to stay at 95%, the file size of that picture is reduced from 270 kb to 75 kb (37% of its original size)

The main downside of the Squoosh tool is that it lacks support for batch or bulk image compression. This means images must be uploaded and processed one by one, which increases manual effort when preparing multiple images for the website.

A potential improvement to the workflow introduced in Week 1 would be the use of GIMP, which supports batch image processing through plugins or scripting.

For video compression, the app-based FFMPEG tool is used. There are a few ways to install the tool locally; the packages & executable files from gyan.dev was selected arbitrarily. Further details could be found online.

Yes, the website is like that

The baseline script that could be used at the terminal as the reference for future weeks :

ffmpeg -i input.mp4 -vf "scale=500:-2,setpts=0.5*PTS" -c:v libx264 
-preset veryslow -crf 28 -an output.mp4

Some descriptions on the command elements:

• -i specifices the input file
• -vf applies a filter chain, in this case scale of width 500px and -2 being an instruction to auto-calculate height, and speed up by 2x the "presentation time stamp"
• -c:v libx264 recommended default setting to encode video using H.264
• -preset controls encoding speed vs compression efficiency. Options available from ultrafast to very slow (smallest file)
• -crf controls video quality. Typical range between 18 to 28 (very compressed).
• -an disables audio completely
• output.mp4 name of the output file

Remember to navigate to the output folder location first through the terminal, by writing cd and copying the file path, then clicking enter, so that the compressed video file would be saved there