DEV Community

loading...
Cover image for Hacktoberfest 2019: My First Leap Into Open Source

Hacktoberfest 2019: My First Leap Into Open Source

Ian Peterson
Coding bootcamp grad passionate about software development and being a difference-maker. Always learning.
・11 min read

Oftentimes, I've heard from many in the tech industry of the impact open source contributions can have on one's resume. This especially has been said a lot with regards to those early in their careers.

Even outside of finding a job though, getting into open source still has been a major goal of mine, and yet...

One does not simply meme from Lord of the Rings

It's true. Making that first leap into open source is an intimidating endeavor. Knowing where to start is extremely challenging because of how open-ended open source can be. This is especially the case for junior developers like myself. So then, how does one actually get started with open source?

The Problem of Open Source

Likely the first thought that comes to mind is to pick a library or framework you're familiar with and start there. The problem with this approach though is these libraries are very likely massive pieces of work adopted by countless enterprises the world over. If you're a coding bootcamp grad like I am, you know this struggle well. Just try looking through the mass of issues for React. Doesn't seem very approachable, does it?

This is but one of many problems with getting one's feet wet in the open source world. The barrier to entry is enormous, whether that be intentional or not. While there are programs like Outreachy that try to introduce new developers to open source through their internship program, it's not enough.

Sometimes though you just need to jump right in, even if the water looks all green and filthy. Sometimes that means having the right moment or motivation to prompt you to action and make that big, scary first step towards your inevitable doom open source. Perhaps that means waiting around for the most frightening month of the year where you must learn to face your fears lest you become some foul beast's early (not for Canada!) Thanksgiving feast.

Maybe that means you need what I needed to get started. Yeah, probably.

Table of Contents

Enter Hacktoberfest 2019

For me, that kick-in-the-rear to get into gear opportunity was this past month's Hacktoberfest. It is an event dedicated to promoting involvement in open-source software. You may even get some nice swag for having participated! It's simply swag-tastic and certainly a great opportunity to facilitate more contributions to open source!

Yes, I know what you're thinking. It's November! That's true... that is, unless you're one of those time travelers I've been hearing about. A strange bunch, they are. Be careful around them... They have a tendency to break reality as we know it. Frightening! They're a dangerous lot indeed...

It was, to say the least, the motivation I truly needed to get started. The enticement of shiny loot along with having that sense of triumph over the fierce leviathan that is open source was a prospect too great to keep me at bay.

While a tad late to share my adventure of open-source hacking across the land, the time has finally come to tell the tale!

My Fabulous Four Pull Requests

This year, the requirement for successfully completing Hacktoberfest was to make 4 valid pull requests. Whether or not they actually get merged didn't matter; as long as they're valid, good faith attempts, all was good. If you're interested in the particulars, feel free to view the official rules.

With that said and without further adieu, let's talk pull requests!

1: Junior Dev Struggle Blog: Post Description Duplication

My first pull request for Hacktoberfest was made to the Junior Dev Struggle Blog website. In it, I applied a fix to blog posts that were rendering blog post descriptions twice when viewing the post itself. The change I made was simply to remove the extra line where the component rendered this data twice. While a pretty small change in itself, everyone's got to start somewhere, right?

Fix for duplicated blog post descriptions plus a style update #72

This pull request fixes #71, removing the duplicate blog post description that appears after the author and date text in blog posts. I also added a special treat by adding some bonus styling so that the blog post description stands out a bit more.

Let me know if there are any problems! Thanks.

So, what even is the Junior Dev Struggle Blog? As you can imagine, it is a blog dedicated to the struggle of the junior dev, but also much more. It is part of a larger community based in the Seattle area that meets a few times a month to help support the local junior dev community. Many of the members themselves are also junior developers who, like I did, attended coding bootcamps to skill up. Together, we've formed a network to help lift each other up into new and exciting careers in tech.

The group itself is known as the Junior Dev Struggle Bus, a Meetup group and also now a nonprofit in Washington state. The blog site is but one of their open-source community projects in an attempt to help expose new developers to open source and give them experience writing code in a collaborative environment. Although I've only participated in the community for a few short months now, they've been incredibly supportive and have been a big boost to my morale as the job search trudges on.

It is because of them that I decided to go for it and had a genuine opportunity to participate in Hacktoberfest as well as make my first ever pull request. I'm very happy to have been able to contribute to such a wonderful group and there will certainly be much more from me (and there already has!) to come in the future!

2: Junior Dev Struggle Bus: Undefined Venue Object

Next up was a contribution I made to the Junior Dev Struggle Bus' other website: the group's primary website itself! Shortly after I made my first PR, an issue with the website was brought to the attention of the JDSB Slack that was making the Events page fail to render. It turns out event venue information retrieved from the Meetup API was missing! My fix was to handle missing event data by providing default values in their place.

Fix for the Events page property of undefined venue object error #34

I'm applying a more stable, long term fix to issue #31. My change simply just makes sure the venue object exists before trying to grab the name property from it, which was causing the prior error.

Do note that this PR updates package-lock.json as well. This is because I got a vulnerability warning after npm install and I figured updating those vulnerable packages would be wise.

As was the case with the first, this second PR was also made to one of the JDSB community projects. It proved to be a bigger step up from my first PR, but even so, I found the fix to be relatively easy. Unfortunately, I wasn't exactly able to test the results of my change because one of the organizers of the group deleted the event causing the error as a stopgap measure. Still, it was all in all a pretty basic issue and a type of issue I've encountered multiple times before.

The website itself acts as a general summary of what the group is all about and a portal to some of the other community sites, projects, and resources. While I've only recently begun to participate in the community, some big things are on the horizon for this group! I myself have begun working on plans to help other community members more easily begin contributing to our projects as well as open source in general. This is surely only the beginning though!

If you are also based in the Seattle area and are a junior dev or you want to help out junior devs as a mentor and help this community lift others up, feel free to join us at one of our events! We're a friendly bunch who love to help each other out, and we can certainly use the help no matter if you're just starting out or are a seasoned developer. All who care about making tech a more inclusive place and creating opportunities for others will fit right in.

3: Victory: Applying Axis Orientation From Theme

Finding other open-source projects to make contributions to was very hard. Even though the official Hacktoberfest website had a plethora of resources for finding newbie-friendly issues to work on, I still struggled to find something approachable. I instead decided to look into some of the open-source libraries of a local company I knew of and found an issue that looked approachable enough to make an attempt at. The issue involved a failure to properly apply axis orientations on charts created by Formidable Labs' Victory library.

Apply axis orientation from theme in getOrientation #1415

I applied a fix that addresses #1413 for applying alternative axis orientations for customized themes. However, I'm not certain that this solution adequately resembles the intended behavior for setting axis orientations via customized themes. That said, I would really like to try and resolve this issue properly, so please feel free to point me in the right direction so I can apply a proper fix if need be. Thank you!

Upon reviewing the docs and comments specified in #1413, it was specified that themes and props should be "merged". I'm unsure as to the meaning of this since theme and its properties are attached to props from the start. I noticed that Helpers.modifyProps in the VictoryAxis's render method does appear to be doing some sort of combining and flattening of props values, but this occurs after the call to getOrientation where axis orientations are obtained. I couldn't see anywhere else where it would be suitable for props.orientation to apply an orientation supplied by a theme, assuming that is the intent.

I am brand new to this library/codebase and to making pull requests generally, so I apologize if I am overlooking something obvious or failed to adequately review the information available to me.

Victory itself is a data visualization library for React that allows you to build all sorts of charts and graphs for the web. It was created and is maintained by Formidable, a JavaScript consultancy company headquartered in Seattle with other offices in Denver and in London. They also happen to be an organization pretty open about open source, and it definitely shows.

Unbeknownst to me at first, I was surprised to learn it was a library used by a lot of major companies. As someone already familiar with React and with an interest in the data side of things myself, I was excited to be able to contribute something to such a significant library. I would also be lying if I said I didn't have a teeny tiny itty bitty ulterior motive to poke my nose into a library by this particular company... but that's another matter! Let's just say that I'm available and awesome, k?

Formidable logo

My result, however? Failure. Oof. I suppose it had to happen eventually, but it doesn't change the fact that having your pull request rejected is not a pleasant experience. It was also an issue I put a lot of time into to try and understand, and to my credit, I did technically fix the issue, just not in the way it was meant to work. I certainly don't fault them for rejecting my PR and they were very nice throughout the process. It was also my first attempt at contributing to a massive library that I was also largely unfamiliar with beforehand. Of course I failed.

Even so, I got a lot out of the experience and still ultimately achieved a working result, albeit the incorrect one. It was also still a valid PR despite not being merged. Thus, I got another notch in my belt toward tasting that sweet, sweet Hacktoberfest victory. Onward!

4: Victory: Contributing Document Code Block Formatting

Well, wait. I guess I wasn't done contributing to Victory after all. While my original PR resulted in a hit and miss, I stumbled upon another problem: their contributing document. There was also no issue posted about it that I could find which I found odd given the size and popularity of this library. The issue? An example code block wasn't formatted correctly. My fix? Literally just adding one character: a missing tilde.

Fix contributing document code block format #1416

There was a third tilde missing in one of CONTRIBUTING.md's code blocks, resulting in some improper formatting. I've added it back in to correct that formatting issue.

There's no doubt I would've liked to have made a contribution to the code itself that powers many companies' visualizations. That would've been pretty cool. Still, I'm a stickler for proper formatting and fixing things that are out of order, so it was a tiny fix that I was happy to resolve, and no issues required! Besides, open-source projects need clear contribution guidelines, and syntax errors of any sort, even if it's just in the docs, can make open-source software just a bit harder and unpleasant to work with.

Before I even knew it, I was done, pending a challenge to my otherwise (mostly) successful Hacktoberfest attempt. I certainly wasn't expecting a problem like this to be my final PR (literally just one character, might I remind you), but it nonetheless came with a notable achievement of its own, too. I made a successful, merged PR to a major open-source library. The first of what will one day become many.

A Hacktoberfest of Spoils

Coming into this month (except for you dastardly time-travelers), I found myself a Hacktoberfest victor. I successfully etched my name into the Hacktoberfest stone and solidified my place in history. Maybe.

Screenshot of my contributions made during Hacktoberfest

As with all victories, so come the spoils, right? True, but don't be mistaken. Not all treasures are material! What I came away with was a key milestone in my young career: open source contributions! I also got the opportunity to engage more deeply with my local developer community through a number of Hacktoberfest Meetup events as well as contribute to a great group with an even greater cause.

It was also a great opportunity to poke around in the inner workings of major open-source libraries. It was cool to see how popular libraries and tools used throughout the developer community are stitched together. It is the kind of work I aspire to one day become a key part of and thus made it an outstanding learning experience.

Last but not least, I vanquished the menacing foe that is getting into open source itself. It was the kind of victory that will surely echo throughout the ages for all of eternity. Maybe.

Okay, but what about the REAL spoils!? I imagine that's what you're thinking right now. Worry not! Do you like t-shirts?

My Hacktoberfest 2019 t-shirt

It's pretty nice! If only my phone wasn't a potato, you'd get to see how nice it is in person. Unless, of course, you also got a t-shirt for participating in Hacktoberfest, in which case, congratulations, fellow victor! It's a really great shirt, I swear. Even though I haven't worn it yet. Don't worry, I will! Eventually...

That's not all, though! How about some stickers!? Is it wrong for an adult to be excited about stickers? ...Nah! Enjoy!

Assortment of Laptop stickers obtained from Hacktoberfest 2019

I get it. One of them is actually a coaster, not a sticker. Still cool though! Devs get thirsty too!

You thought I was done, huh? WRONG! I saved the best for last! There's one more thing Hacktoberfest participants got, but it came with a very important catch: having a DEV account! As you can probably (hopefully, I mean have you looked at what site you're reading this on?) guess, I am also one of those people! Cool, right? Not as cool as THIS!!!

DEV.to account badge for having participated in Hacktoberfest 2019

Exciting stuff! Very shiny. So hexagon. Much purple. Quite badge. Wow!

What Hacktoberfest Truly Means

While all of the participation trophies I got were certainly very nice, the true purpose of Hacktoberfest is about much more. By putting on events such as these, it promotes and generates involvement in one's own community, whether it be online, in person, or like me, both. In my case, it formally introduced me to the world of open source by giving back.

DigitalOcean logo

Not only does it have the potential to elevate people's careers, but also their livelihoods. Much of the world's technology is supported by open-source software, but oftentimes this goes unnoticed and unrewarded. You might think a career in software development is a lucrative one, but the truth is, it isn't for everyone and it's important that we recognize that, give thanks, but also give back as well.

Hacktoberfest serves and achieves that very purpose. While swag is nice, and I will certainly enjoy mine, it is definitely not what's most important. At the center of everything we create as developers is for people. They, in turn, are what makes our work so valuable. In fact, it would not even have value were it not for how it affects us. Our lives are better because of it.

DEV.to logo

I'm proud to have been a part of such a great event put on by both DigitalOcean and of course the awesomeness that is the DEV community. I enjoyed having the opportunity to expand my horizons, meet new people, and also give back to the technology that enriches our lives.

Oh, and I hope you enjoyed my puns! I sure did.

Discussion (0)