Hacktoberfest! - Week 1

It's crazy to think about: Just a month ago, the only use I had for GitHub was downloading software from the release page. Now I am out here contributing to open source projects!

Hacktoberfest

It's Hacktoberfest time! I'm glad the course dedicated the entire October for this. It's just the push I need. For the first week, I was looking around for something simple, just to get an idea of what it's like to work with people. I joined the Hacktoberfest Discord server and stumbled across Distrochooser.

It's not a huge project but is quite well-known among the Linux community. One that I have used myself as well. distrochooser.de is a website that helps you choose a Linux distro by answering a guided questionnaire:

The Setup and My First PR

This project is a Django application. The maintainer provided some instructions on how to set it up. However, the instructions were very new and I ran into some issues with them.

The first one was very obvious: The instructions said to clone two different repositories, but they both have the same link. I went to the organization page and quickly found the correct repo. However, I noticed that the branch name provided in the instructions was also incorrect. I identified the correct branch, tested it on my machine and filed my first PR - A simple fix of the link and the branch name.

After cloning the repos, I followed the steps but ran into this error during the first step:

django.core.exceptions.ImproperlyConfigured: You're using the staticfiles app without having set the STATIC_ROOT setting to a filesystem path.

After some research, I learned that Django requires a STATIC_ROOT configuration, which states the root directory for its collected static files. I modified the settings and was able to fix it myself. However, in this case, I wasn't sure if this was an intentional decision or not, so I opened an issue. Later, the maintainer confirmed this bug and fixed it themselves.

My Second PR

Scanning through the [issues board](https://github.com/distrochooser/distrochooser/issues, a lot of them are UI/styling related. So I built the the front end requirements according to the instructions. Before I could get into the issues, I immediately noticed a styling problem: The content is extremely narrow on large screens and there's a lot of white space around.

I opened up developer tools on my browser:

This was a left-aligned flexbox with an empty <div> element to the left. In the class list, I recognized the Bootstrap grid syntax, and col-xxl-4 was used for the content. This explained why it was only narrow on a larger viewpoint.

I spent some time experimenting with different sizes right inside the developer tools. Eventually I settled on col-xxl-8 for the content, and col-xxl-2 for the empty space. Once I'm happy, I found the corresponding segment in the code, made the changes and filed the PR!

Before:

After:

Turned out I didn't need to dig in that far to find an issue to solve.

What's Next?

The first week was not a lot of coding, but I did spend some time looking for projects to work on. I've already had my eyes on a few, and I'm currently working on a feature request. I will talk more about it once it's done.

As for distrochooser, I had quite a pleasant experience with the maintainer. I'm sure I'll come back to it in the future!