Open Source - Wei Huang

Hacktoberfest has finally ended today, the experience was great. Contributing to open source project was a challenging task, but it also provided a great opportunity to work with real world projects that people actually use.  In the final week, I worked on two issues from the same project. This project is another web application,  it utilizes a npm package called "youtube-audio-stream" to allow users to search for YouTube videos to add to their playing queue. The first issue I worked on was to change the queue Card(React-Bootstrap) layout, all I had to do was to change the react bootstrap attributes and make the Card objects in the queue larger and display more characters of the video title. After I was done with this issue, I felt like this was a good practice but it was not good enough for a 4th PR for the Hacktoberfest event, therefore, I decided to take on an extra issue, since the repository had a bit over 20 issues, I selected one that was about the right difficulty for...

Finding an issue for Hacktoberfest has been tough, It took me long enough to find an interesting repository, but luckily, I came across this project called Awesome-Adoption, it is a Pet Adoption web application developed using React. The repository owner requested for a new feature to be added to the web application, initially, each pet detail page only displays a single picture of the pet, my task was to try to implement the ability to view all available photos of the pet by adding two buttons to navigate between photos. Since I have worked with React library back in the WEB-422 course, I felt pretty confident starting this project, but it didn't take long for me to realize that this something I have never worked with before. Back when I worked with React, class based components were used, but absolutely 0 class component were use in this project, this had me confused, time to learn something new again. After a bit of researching I found the video " Learn useState In 15 Minut...

This week in OSD-600, more git features were introduced to me, the main focus of the week and the lab is on the rebase feature of Git, this is an extremely powerful tool and what it is capable of doing is amazing. Once again, I was asked to modify the DLCheck tool project codes to further improve it, not only improvements in the codes, but also improvements in the git commit history. To begin the improvement attempt, I took a close look into my project, and it didn't take long for me to find a couple issues. The first issue was obvious and I have thought about making this change for a while, that is to move some of the functions into an independent file instead of leaving them in index.js. Therefore, I created another file called displayMessage.js, moved the display message functions into that file and exported them using module.exports, now the index.js file looks cleaner and it still has access to those functions. The second change I made to the project is simply changing a varia...

 Hacktoberfest is still ongoing, this week I have made my second contribution to real open source projects, I have decided to go with the same method I used last time to look for issues, which was applying the "hacktoberfest" label and sorting by the issue post date. After a bit of browsing, I decided to pick up an issue from a small project. It is a weekly calendar app developed using a JavaScript front-end frame work called Svelte, the issue indicates that the project could use a clipboard icon on their web app and an click event handler to allow users to copy contents to the clipboard. This project was easy to set up and configure for testing, since I already have most of the tools required to work with it, all I had to do was to install the dependencies and get it running locally by using the "npm run dev" command. Thanks to the project owner who posted the issue, he specified the exact file to add the feature to, which was very helpful, without the instructions...

This week we have worked on the same project and added another new feature to allow ignoring certain links. However, this time I worked with a new partner! Since I have never worked with his project before, I spent a fair amount of time viewing his code before I began trying to add the feature. Luckily, we both used Node.js for this project, therefore it didn't take me long to get the program running and tested. While working on his project, I have ran into problems, adding a feature could be difficult, I had to make modifications to some of the original function rather than simply creating new ones. Although certain parts of the update had me stuck for a while, I was able to find all the information and resources I need from the web before I had to reach out for help in the Slack community. Using Git for this lab was somewhat difficult, I was a bit confused when trying to follow the instructions on using git remote, it was a mess since I was putting in invalid commands. I ended up...

 This week the Hacktoberfest event has finally started and I had the chance to contribute to real open source projects. Finding an issue that I can fix took way longer than I thought it would, most of the issues were either taken or they were too complicated for a first time contributor. After a while of searching around GitHub repos with "good-first-issue" labels applied, I found a couple repositories that seemed interesting to me. One of the repositories requested for a new URL redirects in their projects, I thought this was an easy fix, but that it was more complicated than I thought it would be, the original repository had no instruction on how to run and test the application, therefore, I had to leave a comment in the issue asking for instructions. As it turns out a test must be written first before adding any code to the project, and when I ran the initial test before adding anything into the project, I was already getting testing errors, it seems like a challenging one...

Lab 3 of the OSD-600 course provided a great opportunity to practice using Git and GitHub, beginning of the assignment was a huge mess, I was forgetting to switch between branches and one of the new features  took me quite a while to complete because of how the previous version of the DLCheck project code was implemented, I ended up having to make some changes to the previous existing code instead of simply adding new code. After a bit of playing around with Git and re-watching lectures to refamiliarize myself with the commands, it all became very clear to me how branches work and how to utilize various git commands, such as git log, git checkout, git status etc. For this lab, two new features were added to the tool, one of them being allowing command line arguments such as --good, --bad, -all to be passed to filter the output by the URL's response status code.  The other feature is to check the environment variable CLICOLOR before displaying the URLs back to the screen, if th...

Since I partnered up with 2 people for lab 1, I have decided to do this with the same people again for this lab. I spent a good amount of time to read and tried to understand the logic and purpose of code before I began updating the project. As I read the lab instructions, I realized that the goal is to add an extra feature to other's project, this is amazing because we get to make real contributions to other's work. It was easy for me to decide what to add onto my partner's codes because I knew a crucial part that his release 0.1 lacks, which is the timeout settings and error catching when making requests to the URLs. In his project, the Axios module was used to make those requests, I did a little bit of research and found out that the default timeout for an Axios request is 0, therefore, some links may keep the program waiting for a long period of time, which may cause the program to freeze, therefore I added in the timeout setting in the request to make the tool display ...