Developer 1.0.1

In March 2018, I joined the team at Rabid Tech and when asked to contribute a blog, I wondered what I could share with readers that might help them better understand life as a junior developer. There is plenty already written – guides, forums, tutorials and lessons learned that may help a graduate or junior developer adapt to their new work environment – but this is not one of them. Instead, I aim to give you a genuine recount of some of my ‘moments’ over the last few weeks at Rabid. First a reflection, then a theory and finally a small piece of code.

Agile

I recently remarked to a colleague that my job at Rabid is the first I have had (and I have had a few) that I wake up every working day, excited about my day ahead.

How do I represent a day at Rabid? The following sketch (Fig1.) best illustrates some of my tasks, up-skilling and events. Developers can imagine the sketch as an array matrix.

Fig1. Word cube. A graphic representation of a day at Rabid.

Just like a Rubik’s Cube Master is adept at solving the puzzle, I aim to become more agile and to be a better developer.

Ripple

I had been interested in Rabid long before I started working here. Having heard of their good reputation locally, I was also aware of their involvement and interaction with other Enspiral businesses and the wider community in Wellington. I’ve seen firsthand that the values held at Rabid enable a supportive internal culture, a commitment to contributing to the open source community and championing ‘feel good’ projects. Rabid works very hard at maintaining and building upon these values. You can read more about Rabid values and projects on the Our Work page.

If a software company has a product or service they feel truly good about they must ask themselves: Do we influence the right choice? Do we really help our diverse users and clients? Are we doing the right thing? Are we a catalyst for change? The responsibility for change lies with me as a developer as well. Some of those responsibilities include: helping build more secure applications, writing better code that considers the privacy of our users and to create software that is designed and developed not to offend users. Rabid is doing all that and more.

Shuffle

For those non-technical readers, if we did not have the Document Object Model (DOM), you would not be able to read this blog. Recently I forgot the DOM. The requirement is: use Javascript to render my colleagues’ profiles (image and description) in a random order when the About Us page loads. There are many 2+ line jQuery functions that do just this but for me these functions abstracted what exactly was happening. I opted to use pure Javascript but didn’t want to reinvent the wheel so used the Fisher-Yates Shuffle.

I had asked a colleague – why is it that I could see by my minimal Node.js console (Fig2.) testing with a hardcoded array of numbers that the function worked, but I could not understand why my colleagues profiles were not being displayed in a random order with the same function?

Code Snippet
Fig2. Node.js console output of calling the shuffle function with the numbers array passed as an argument.

Without even looking at the code my colleague kindly remarked that I had forgotten the DOM. The same function that output the above numbers array is used to output the HTMLElements collection as shown in the following image (Fig3.).

Code Snippet
Fig3. Browser console output of the shuffle function with the html collection of Rabid profiles passed as an argument.

Although an HTMLCollection looks like an array – it is not. You can loop over the collection elements with a number but you can not use array methods like push() or pop(). I have been treating and thinking about the HTMLCollection as if it were an array. Hence the verbose language used in the shuffle function (Fig4.) to access the html elements with Javascript.

function shuffle(childProfilesArray){
var currentIndex = childProfilesArray.length;
var temporaryValue;
var randomIndex;
while (0 !== currentIndex) {
randomIndex = Math.floor(Math.random() * currentIndex);
currentIndex -= 1;
temporaryValue = childProfilesArray[currentIndex];
childProfilesArray[currentIndex] = childProfilesArray[randomIndex];
childProfilesArray[randomIndex] = temporaryValue;
}
return childProfilesArray;
}
shuffle(childProfilesArray);
Fig4. The shuffle function. The code has been edited for brevity.

Thank you Rabideers for your kind welcome, support, patience and generous sharing of knowledge – and Tim Berners-Lee (credited with inventing and gifting us the world wide web).