2. Project management

Fab Academy sites

We logged into our Gitlab accounts to access our projects and familiarize ourselves with the operation of the website and the repository.

We learned that the websites were generated using mkdocs, a site generator programmed in python. The individual webpages were created in a language called markdown. This language is very minimalistic and easy to learn compared to HTML and CSS. In order to begin formatting my site, I consulted this github repo that contains a helpful guide on the usage of markdown.

Signing the agreement

We used the web IDE to paste, sign, and commit the agreement in agreement.md to the master branch.

For some reason, however, the commit prompt automatically defaults to creating a new branch instead of committing to master branch.

Everytime we try to commit to the master branch using the web IDE, we must be careful to tick the master branch option each time.

Updating the website

We attempted to decorate our website by utilizing themes. In order to do so, you add the python package as a prerequisite in requirements.txt and set the name of the theme in mkdocs.yml using the web IDE.

mkdocs.yml:

themes:
  name: bootstrap4 # Theme name goes here
  # see https://squidfunk.github.io/mkdocs-material/getting-started/#color-palette
  palette:
    primary: "deep"
    accent: "indigo"
  font:
    false
    # text: "Ubuntu"
    # code: "Ubuntu Mono"
  feature:
    tabs: true

requirements.txt:

mkdocs
mkdocs-material
# Python package here

I set my page to the bootstrap4 theme and added the mkdocs-bootstrap4 package as a prerequiste.

After each commit, you have to wait for the pipeline to update the website. It usually takes about half a minute.

However, we quickly found out that many themes were broken and outdated.

All photos were incorrectly scaled and all the tabs (except for the home tab) did not redirect to their respective pages. The paragraph symbols next to headers were not supposed to be visible. The assignments tab dropdown was not populated with links to any assignment page. So, I just reverted the theme back to material.

Then, I populated the About page, the homepage, and the week02 page using the web IDE.

Just to add a little bit of customization I fiddled with theme customization in mkdocs.yml. I made the primary and accent colors orange.

mkdocs.yml:

theme:
  name: material
  # see https://squidfunk.github.io/mkdocs-material/getting-started/#color-palette
  palette:
    primary: "orange" # Primary color goes here
    accent: "orange" # Accent color goes here
  font:
    false
    # text: "Ubuntu"
    # code: "Ubuntu Mono"
  feature:
    tabs: true

Here is the result:

Git Version Control

By working on several programming projects, I already had experience using Git. However, for the first time, a remote repository required me to use an SSH key in order to push and pull. Previously, I had only been exposed to Github, which allows users to use their Github account credentials to authenticate.

So, I followed Gitlab’s guide to setup a SSH key on my computer. Since I have MacOS, no additional software was required to be installed.

First, I opened a terminal window and issued a command to generate a new SSH key pair. I added a comment saying that this SSH key pair was for Gitlab

ssh-keygen -t ed25519 -C "gitlab"

When prompted for the file to save the SSH key, I pressed enter to use the suggested path. When prompted for the password, I entered and reentered my password.

Then, I issued a command to copy the SSH key to my clipboard and pasted it into the corresponding textbox on Gitlab (User Settings > SSH Keys).

pbcopy < ~/.ssh/id_ed25519.pub

To test to see if the SSH key works, I issued a command to connect to Fab Academy Gitlab via SSH. When prompted to trust Gitlab, I entered “yes” and then the terminal printed a greeting with my Gitlab username.

ssh -T git@gitlab.fabcloud.org