Hacktoberfest: Part 4
The finale
October has almost vanished. Snow flurries are appearing and we’ll have an extra hour of daylight next week. While I certainly don’t welcome the colder weather, it means that I’ll just need to layer up some more.
To help stay warm, I’ll have some new t-shirts soon. In addition to completing the main challenge set out by DigitalOcean, GitHub, and Twilio, I managed to complete additional challenges from Microsoft, Auth0, Twilio, OpenEBS, Hasura, and Nexmo. The result? Seven shirts are on their way to my door!
On that note, bring on the cold 👊🏽☃️
Finding the final contribution
Between practicing Go and learning more of an advanced React codebase, I wanted to finish strong with a contribution to a project that I’ve been involved in for sometime — Mozilla’s AMO frontend.
With a quick scan through the issues labelled contrib: welcome, this one caught my attention:
Fixing the feature
In web development, an API exposes its endpoints (called “routes”) to allow you to retrieve, create, update, or delete data (ideally from a database of some kind).
An example of a route that retrieves a dog GIF from a database may look like:
api/v1/dogs/1, where the 1 value represents the unique ID of the GIF:
In code, this is represented as:
api/v1/dogs/:dogID, where :dogID is what we call a path parameter.
It essentially says “Hey! I want to retrieve the dog GIF that has an id of what the user says!” A new problem now arises — the user can enter some bonkers value for :dogID — like #SenecaSockCrew.
In that case, we’d want to reply to the user and tell them “That isn’t a valid value! Please try again” but that involves a ton of error checking code. It’d be great if React had something to do the validation for us… enter regular expressions.
React has a Route component that has a path property which accepts a regex of acceptable values, delimited by a pipe character (|). What this means is that we could allow only numeric values, like so:
<Route
path="api/v1/dogs/:dogID(\d)"
component={ShowDoggo}
/>Now, we can remove any validation code for dogID — like checking if it was a number or not. In the case where it wasn’t valid, the user would be redirected to our 404 endpoint, denoting that we couldn’t find a particular resource:
<Route
path="*"
component={NotFound}
/>With that explanation in hand, head on over to my PR for AMO:
Final Thoughts
22 pull requests, 2 mentored bugs, 1 conference talk and 0 candy later, Hacktoberfest 2018 has come to a wrap for me. I’ve done a lot this month, from continuing working with Go, to growing even more with my AMO friends — it’s been jam packed. I’ve experienced most of my growth with my approach to writing these blogs. They’re no longer massive essays, and omit many technical things that cater to a smaller audience.
In all honesty, my previous experience blogging was very difficult as I was sometimes forced to post about experiences I wasn’t interested in. I realized that my posts became “artificial” and “forced” to a certain degree. This time it was different and it really showed for Part 1 and Part 3.
I guess this means that I should continue doing what I’m doing, right? Except the part of authoring this post at 12:30 am on a school night:
Cheers,
Sean 👨🏽💻
