Sign in

This is my 3rd and final series of the release 0.4 blog post. If you have not read previous ones or want to refresh your memory, here is the plan and the progress I made so far regarding this issue

In my last blog, I talked about my research and now we are going to put those research into code. The guideline I used to make the structure is how the queue look like when it has song in it:

Creating Placeholder object for first row

The first row has 5 components in it:

  • PlayQueueButton
  • ShuffleButton
  • DisplayModeButton
  • ClearButton

In the placeholder objects, we…

Last week, I shared my plan for release 0.4. Now, let’s take you guys on a ride of my progress so far.

The issue I chose was I asked the main contributor to assign the issue to me and got a quick reply of an encouraging YES.

In this issue, my main task was improving the “queue” page when there is no queue.

Setting up the project

To set up, I followed their It was straight forward. I cloned the project, did npm install for backend and frontend, ran their backend and frontend at the same time with npm run dev

Finally, it came to the end of the term and end of my lab sessions working with link checker tool. This was a crazy wonderful journey! ( note: not a goodbye post…we still have a long way to go! )

For this last lab, I got the chance to work with publishing my link checker tool so that it can easily be installed and run without going through the hassle of cloning the repo and following lists of instructions. The process of accomplishing it is easier than it sounds.

As I used node.js to build my tool, the approach I…

After successfully finishing on release 0.3, it is time to move on to the next release. For my previous releases, I had been working with Grommet, Telescope, and many more. For this release, I wanted to try something new and exciting!

I started my hunt on GitHub. I always have hard time finding issue that I would enjoy. Either the issues are too easy or too difficult! After some unsuccessful attempts, a thought came to mind, “Why not look at other’s contribution on release 0.3?” And, this is how I found out about this repo, Qasong. …

This week had been another new learning experience. I learned about automated testing, different testing framework, various test cases, code coverage analysis and continuous integration. To apply my very amateur knowledge about writing test, I started coding in my CL tool, find-broken-link(fbl).

Testing framework/tools

The testing framework I chose is Jest. It is a popular Javascript testing framework and as my project is in node.js, I felt this framework is perfect for me. Another reason I chose this framework is because of abundance of example available online.

Set Up The Framework

To set up Jest in my project , I took following steps:

For my external project PR, I continued working with Grommet Community which I contributed on my release 0.2. After my first contribution on release 0.2, I decided dive more into the similar issue. It was organizing the stories based on its component types.

As I worked before with this community, the set up had already been done. The first PR I made was organizing Header/stories by type of its component which is Layout. The task was similar like I did for release 0.2: export the components, access them form separate file and define a layout.

As a result, I thought…

For my first ever Telescope contribution, I chose one of the issues regarding validation schema with express-validator instead of Ajv .

I have never worked with express-validator , so it was a great chance to learn about it. As a result, my first step was familiarizing myself with how express-validator works. I found there was not many great examples available in internet. Only option is availabale is their official documentation. Though the documentation is well made, it lacks more advanced examples.

Anyway, after installing express-validator , I had to search what options were available in express-validatorwhich can be replaced with…

We all want our code to look beautiful, consistent, bug free and elegant, but nobody wants to do those tasks manually because it takes a huge amount of time. We already pressed for time to fix “real bug” and making our code runnable. We wish what if there was automatic tool who can check for our “silly” bugs, fix them, organize our code in a prettier way. Well, the wish is now REALITY! Someone also had the same regret and they made the tools for us which are called Static Analysis Tooling.

This week I had the chance to work…

This week was getting to know Telescope week.

Setting up Telescope

I used mac to set up Telescope because I was aware that how painful it is to setup Telescope in Windows. Hence, I avoid it and I am glad that I did that. Because of that, it went smoothly. I installed docker which makes easier to run Telescope. So far, I did not encounter any major issues 🤞

Lab 6

The task of this lab was working with Telescope REST API. We have to grab the last 10 blog posts and check all the link inside each blogs. I could have just done it…

Just a few hours left until the thrilling Hactoberfest to end!! So far I have worked on adding documentation, fixing bug and removing unused code for my other 3 PRs. For my last PR, my goal was to code and make noticeable changes. I found the perfect issue on this repo named Grommet.

My last contribution for Hactoberfest

This is my first time working with storybook but their documentation has enough details to guide me. The issue was working with front-end and format different components based on their type. They have different components such as box, card, header, footer and so on. All of them…


Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store