A lot of times, there are dependencies or prerequisites that need to be installed on a machine before a code or program can be executed. Recently, I came across a problem where I tried to build a font package from the drawing I have. I found FontCustom, which is very cool. It can convert all the vector drawing (*.svg) and package into a font (*.ttf). So you can design your own font set.
First thing I’ve tried is to install all the dependencies based on the official website. But I soon reach a problem, a roadblock. I found out that the requirements stated on the website are quite outdated and some tweaks are required. After some searching on Google, I am finally able to successfully made it work on Ubuntu 14.04 LTS.
I was then curious of another question. Can I make use of CI/CD offered by GitLab to make my job easier? so that I can always focus on only the graphic design work and not bother about the coding, compiling etc?
Not everyone in the team understands computer programming very well. Almost every lay man uses Windows. But the required script relies on Ubuntu. If I can make use of CI/CD in GitLab, then the only thing required is to let team members work on the graphic drawing and. With that, the output can then be downloaded from CI/CD pipeline artifacts. This is an ideal solution.
CI/CD
Lets take a look at the snippet of my .gitlab-ci.yml to help me compile my font collection.
The only command to compile the font is fontcustom compile. But before the command can be used, we need to make sure all the prerequisites and dependencies are installed. You can see most of the startup script required are placed at before_script section while there is only one single command at script section in the yaml file.
Publish to Docker Container
At this stage, we are fine because the build solution is now decoupled and handled by GitLab CI/CD. What if there is another person in a team who wants to build his own font using fontcustom? He or she simply need to clone and put the .gitlab-ci.yml at the project root. However this is not a perfect solution. What if there is an update or fix to the dependencies again in future? Once the original copy of .gitlab-ci.yml has changed, everyone who clones it has to make the same changes as well. So this is not a good solution when multiple parties need to be in sync with the same script.
Thus, let me introduce you to Docker. In this scenario, Docker will be able to fix the problem easily. Let’s continue to simplify .gitlab-ci.yml by pointing it to another docker image.
What is Docker
Docker is a visualization technology that is similar to the concept of a Virtual Machine (or you can just treat it simply as a Virtual Machine). It is able to split into multiple layers and automate some scripts and all will just operate as if you have an additional virtual machine on top of your host machine.
This is very cool and advanced. Imagine, you only have one physical Windows OS machine. By installing Docker for WIndows, you are then able to have an apache web server, MySql, php, nginx etc running on top of your Windows 10 now. You can even have an Ubuntu running on top of your Windows. There is no need to have a real physical installation on your host machine, The compartmentalization means your Windows OS will not be affected. Instead, all the other OS installations and setup scripts will go into the docker container/image.
Another benefit to have docker on your machine is you could test your application/programs to run on different environments like Ubuntu 14 or Ubuntu 20. Or try the same piece of code and see if its able to run successfully on PHP3, or with the latest PHP7 before you roll out to the world. And all of these testing is very crucial to make sure our code is free of bugs. This is cool since I’m able to achieve multiple platform testing on a single machine.
Run Docker
After you installed docker on your Windows machine. Navigate to your working folder and create a new file name as ‘Dockerfile’.
This is a snippet of my Dockerfile.
First line means we’re pulling the official docker image of Ubuntu 14.04 LTS from the official docker hub. Second line means we mount the working directory to be same with the checkout location. Third line means to copy all the checkout files into the docker container. Lastly, the RUN command is for installation of all dependencies in before_script from .gitlab-ci.yml previously.
Launch a new terminal (Powershell or command prompt in Windows) at your working folder. And run the command docker build -t ubuntu14 . to build a container and name it as ‘ubuntu14’. Remember there is a dot after the space. Give it some time for the building process to complete. After completion, you can enter another virtual machine by executing docker run -it ubuntu14. If everything succeeds now you’ll see your terminal enter into a new session on your machine. You can call any Ubuntu command to try it out like ls, apt-get update etc.
Deploy to GitLab Container Registry
Now, we need to tell GitLab CI/CD to deploy this docker container to GitLab. Here is an working example of .gitlab-ci.yml.
After deploying successfully, you may find the container address under your GItLab project > Packages & Registries > Container Registry. Press the copy button beside the Root Image label to copy the image address.
Until this stage, you have learnt how to build and run the docker container, and also how to deploy to the GitLab registry.
Now the original .gitlab-ci.yml can be simplified as below.
Look at the code, its so much cleaner now compared to the one earlier in the article. So now everyone in the team can point to the same docker image and every time there is a change in the docker container, everyone can automatically get the same modifications. Sweet~
You may find my project in https://gitlab.com/filpals/docker-fontcustom as your reference.
Conclusion
To summarize the procedure and approach I took here.
- Test it on a local computer.
- After success, convert it into .gitlab-ci.yml.
- Further improvement by conversion into Dockerfile.
- Go back to the original project, point image to step 3 in .gitlab-ci.yml.
- Done.
Point of Interests
You may ask if building the docker container based on Ubuntu image is not exactly a good idea because of the big size of image, thus taking longer time to build in CI/CD pipeline. For this concern, there is a good slim Linux image we can start from called Alpine. It is only 17MB. So you can try to build the image from alpine and start restoring back all the dependencies required from there
P.S. : After writing the article above, I found a better docker image published in docker hub — https://hub.docker.com/r/thomaswelton/fontcustom. Awkward! But looking at the bright side, I am satisfied because without knowing the third party image I am also able to build the solution myself. Now, how about you give it a go to try to build your own docker image?
Further reading
Please leave your comment below if you have any ideas or thoughts. Thanks.
FILPAL is a RF and Microwave solution provider that designs, builds and manufactures affordable software and hardware for Cellular, Satellite, Military, Academia and Test & Measurement applications. Our ultimate goal is to advocate digital equity and empower humankind by addressing the technology gap and providing everyone access to the state of the art in RF and Microwave technologies and tools to produce them.
In FILPAL, we believe not only in providing the best products, but also the spirit of knowledge sharing and learning. We hope these articles would benefit you greatly!
Originally published at http://filpal.wordpress.com on May 2, 2022.
