DEV Community: Henry Cook

Takeaways from my first group project.

Henry Cook — Sun, 30 Aug 2020 16:29:55 +0000

I just finished my first group project! I am used to building things on my own, so this was a completely different adventure. Here are four things I learned:

1. Planning the order in which components are built is critical.

I'm sorry experienced people, I know this is super basic. However, this wasn't immediately clear. When working alone it's pretty easy to say "Oh yeah, I need that thing, let me build it real quick". When working in a group I realized that you need to plan for those "extra" things ahead of time. The front end of our project was built in React, so we needed to make sure that all of the routes were completed. This allows everyone to test their components while they build them. Sure, maybe it would only take 5 minutes for someone to build out our app.js, but having it completed before divvying up tasks is much more efficient. The amount of "extra" things can build-up, and cause a lot of wasted time.

Also, this generally makes things easier to debug. Personally I have sat looking at the screen scratching my head wondering why I can't make an API call, only to then realize that I never even built the API config file.

Here is my advice to anyone relatively new (like me), before building any project you should sit down and write out a plan. It sounds so basic, but it is so important. Trust me, we had a much better and more efficient experience once there was a plan in place. I would recommend GitHub projects to help with this, it's pretty easy to get the hang of and it streamlines the whole process (I would love to hear people's alternatives).

2. The nice thing about building something with other people is that the work is split up!

There isn't any advice here, It's just super nice to not have to build everything yourself. I am a detail person, so I liked being able to focus on each of my tasks down to the smallest feature. This allowed me to produce higher quality components.

Also, our team met on zoom anytime we would merge our branches together. I loved merging everything and then seeing all of the new pieces fitting in and working together. It felt like we were progressing in giant leaps, rather than monotonously chipping away at some behemoth.

3. Pair Programming is great.

Pair programming helped us tremendously. This honestly made our team 10x more efficient. We pair programmed by having one person share their screen and one person watch (I don't actually know how people do it professionally, maybe like this? let me know.) This dramatically reduced my pretty routine spelling and syntax errors. It was also really cool to plan out the logical steps for any solution with someone else.

Another reason I liked pair programming, is that it was fun! This isn't a very professional reason, but it was. I had a good time working with someone else and creating something together.

Sometimes learning to write code can be a pretty solitary thing. My partner and friends have very little interest in listening to me describe anything I'm working on. Pair programming allowed me to work with someone who is passionate about the same things.

4. Communication is probably one of the most important parts of group work.

This is a big topic, I've listed a few examples:

Actually listening to people when you ask for help.
Taking everyone's opinions into consideration.
Monitoring your ego to ensure that you aren't deluding yourself into thinking you know what's best.
Keeping calm during a disagreement and looking for a diplomatic solution.

I could write a whole blog post about ways to improve your communication skills (oh wait, I did!) so I won't go into a lot of detail. I think it is important to mention that a lot of the disagreements that can crop up in a team environment are "I'm the one who is correct" power struggles. Things like this are not conducive to progress. My advice here is to listen to everyone, recognize that you may be wrong and that is not a reflection of your intelligence, and learn to trust your teammates.

I love building things by myself, I can listen to loud music and disappear into the code. I was nervous when I started this project, and I didn't know what to expect. However, it actually turned out great! My biggest takeaway is that group projects can be quite enjoyable and collaboration can help you build bigger and better things.

Another Post on Bubble Sort

Henry Cook — Sat, 01 Aug 2020 22:45:36 +0000

Let's talk about bubble sort, again. Well, okay, for some of you it's again, but I'm new around these parts. Why am I talking about an algorithm that's used very little outside of the classroom? Because spending time with it, regardless of efficiency has helped me chip away at the barriers between logical thinking and my brain.

What is Bubble sort?

Bubble sort is a sorting algorithm. It loops through an array and the largest values will "bubble" to the end until its completely sorted. If you dislike this term, you are not alone. I am a visual person and placing elements towards the end of an array doesn't give the appearance of bubbling up. Unfortunately, the "Placing elements towards the end of the array as they get sorted sort" isn't as catchy.

Let's jump into it. Here is the basic premise of Bubble sort:

Our input is an unsorted array.
We loop through the array comparing the first element to the second.
If it is larger than the second element we swap them.
Repeat until the array is sorted.
That's it.

The keystone of this algorithm is the swap. You can write this as a function, or just throw that puppy in there.

Here are two different ways to write a swap function:

//The OG: 

function swap(arr, i, j) {
let temp = arr[i];
arr[i] = arr[j];
arr[j] = temp;
}

//The ES6 version:

const swap = (arr, i, j) => {
[arr[i], arr[j]] = [arr[j], arr[i]]
}

The first one, in my opinion, is more readable so I will stick to using that. However, I will include a solution at the bottom that includes the second.

In the first swap function, you can see that we set a temporary variable let temp = arr[i]; This allows us to store the element at arr[i] so we do not lose its value. Then we set arr[i] to equal arr[j] and finally set arr[j] to temp. It's pretty straight forward, but the first time I tried to solve this it took me a second to think of adding a third variable. It's important to mention that people with experience would add a third variable without much thought, but if you are coming from a place that doesn't include much logical thinking(ahem, me) something small like this can be difficult.

The next step in creating this algorithm is to add a nested for loop. Usually we want to avoid this kind of thing, but with Bubble sort, we need it. I am going to start with the version of Bubble sort that is not optimized. Trust me, it's better to start this way and then step through the logic of optimization.

Here is the code:

function bubbleSort(arr) {
  for (let i = 0; i < arr.length; i++) {
    for (let j = 0; j < arr.length; j++) {
      if (arr[j] > arr[j + 1]) {
        let temp = arr[j + 1];
        arr[j + 1] = arr[j];
        arr[j] = temp;
      }
    }
  }

  return arr;
}

bubbleSort([4,7,2,1,7,5,9])

 => [1, 2, 4, 5, 7, 7, 9]

Please note that I did not use a swap function, as mentioned above, I just threw that puppy in there.

The first loop will start from the first element in the array and continue towards the end. The inner loop does the same. Within the inner loop is a conditional that checks if the targeted element is greater than the one to the right if (arr[j] > arr[j + 1]), If it is greater then they swap! This happens until the array is completely sorted. Woohoo!

Unfortunately, this method is even more inefficient than bubble sort already is. Add a console.log right after the second for loop and you would see two things, the first being that we are comparing elements that have already been sorted, and second, being we are comparing the last element to an undefined element.

Example showing elements being compared:

4 7
7 2
7 1
7 7
7 5
7 9
9 undefined
4 2
4 1
4 7
7 5
7 7
7 9
9 undefined

To address this problem we set the first for loop to count down the array. Then we set the second for loop to run until the last element that was added to the sorted part of the array. Remember that we are placing elements(bubbling them) towards the end of the array.

It looks like this:

function bubbleSort(arr) {

    for(let i = arr.length - 1; i > 0; i-- ) {
        for( let j = 0; j < i - 1; j++) {
            if(arr[j] > arr[j+1]) {
              let temp = arr[j+1];
                arr[j+1] = arr[j];
                arr[j] = temp;
            }    
        }
    }

    return arr;
}

bubbleSort([4,7,2,1,7,5,9])

 => [1, 2, 4, 5, 7, 7, 9]

This makes sure that the inner loop doesn't include any of the elements that have been sorted.

Almost there. We can optimize Bubble sort even further. There is still one issue that we haven't talked about. If the array is nearly sorted at the beginning of the function(like this: [1,2,3,4,6,5]) our for loops will not stop looping until their conditions are met. So we have to add some logic in to stop the process when the arr is completely sorted.

Here you go:

function bubbleSort(arr) {
  let didNotSwap;
  for (let i = arr.length - 1; i > 0; i--) {
   didNotSwap = true;
    for (let j = 0; j < i - 1; j++) {
      if (arr[j] > arr[j + 1]) {
        let temp = arr[j + 1];
        arr[j + 1] = arr[j];
        arr[j] = temp;
        didNotSwap = false;
      }
    }
    if (didNotSwap) break;
  }

  return arr;
}

bubbleSort([4, 7, 2, 1, 7, 5, 9]);

If you can tell we introduced a variable let didNotSwap;. In the first loop, we set this to true. Then after the if statement in the second loop we set it to false. The last piece we added was if (didNotSwap) break;. If there was not a swap then we break out of the loop and return the newly sorted array.

All done! While Bubble sort is not a very efficient algorithm, It does help add to the foundation of logical thinking.

Thank you so much for reading this!

Also here is the extra solution as promised:

function bubbleSort(arr) {
  let didNotSwap;
  for (let i = arr.length - 1; i > 0; i--) {
    didNotSwap = true;
    for (let j = 0; j < i - 1; j++) {
      if (arr[j] > arr[j + 1]) {
        [arr[j], arr[j + 1]] = [arr[j + 1], arr[j]];
        didNotSwap = false;
      }
    }
    if (didNotSwap) break;
  }

  return arr;
}

bubbleSort([4, 7, 2, 1, 7, 5, 9]);