Learning to Code and Keeping a Growth Mindset: how tough weeks mean you’re making progress

Rachel McTavish
Nerd For Tech
Published in
5 min readMar 22, 2021

Some weeks, it is more than hitting a wall, taking time out and then re-focusing to figure out the solution with a fresh perspective. Sometimes it feels like you’re banging your head against the same wall attempting to program or solve a problem that is different than what you have ever had to do before. It means scrapping code, debugging and getting something to work only to realize it is not solving the problem you intended, or it is technically working but not the way you need it to.

How do we as developers not only “get through” these problems, projects and days/weeks? By not only fighting imposter syndrome (yes, often still there lurking in the background), but by trying to keep a growth mindset perspective. This is not easy, but it is helpful. It’s more than just a cliché of “it’s the journey not just the destination” because quite honestly, we still need to get to the destination and often on a deadline.

People with lightbulb heads on laptops and phones with electricity string between them. Showing thoughts passing back and forth.
Image by Mohamed Hassan on Pixabay

Lessons Learned from this Week in Learning to Code:

Let’s start with the “progress” or “growth” mindset”. For me, this has been a week that has been the epitome of not just hitting a wall but banging my head against it to the point that I began thinking perhaps I may not be cut out for “real programming”. The type where it is actual problem solving, even if I can get the syntax down.

In this case, I was able to get through my homework and build terminal games, getting help that I understood from my classmates and feeling positive.

But for the past 10ish days I have been consistently working on a more complicated GUI than I have ever attempted. In this case, there were drag and drop features, with rules for selection and where/if a drop was allowable, along with all the fun flexbox provides (I really do enjoy using flexbox).

Now, I was in a situation where there was no boiler plate template, and everyone I could find on the internet who had created similar UI’s for games came up with completely different solutions.

So, I started by doing even more research, reading, time spent scouring StackOverflow, docs, playing in CodePen and reaching out to everyone in my coding network for help and advice.

This meant scrapping my code and starting fresh multiple times. Which was honestly getting a little disheartening. But by going back through, tweaking and then realizing it was not approaching the problem how I needed or wanted it to, I kept learning and researching other topics that were beyond what I had been learning in coding classes. Beyond diving deeper into the DOM and JavaScript functionality, the aspects that were not directly impacting my GUI functionality were probably the most useful to learn. These were the parts of programming that are so ingrained into professional developer’s mindsets and habits that they are often not directly discussed or explained in beginner tutorials or classes (e.g., code planning, javadocs).

There were multiple times where I felt that ever-looming imposter syndrome rearing up, I had to fall back on the reminder that I am learning and growing. Trying to keep a growth mindset was helpful. Keeping a growth or progress forward mindset is helping me to remain motivated to learn beyond jus the minimum for classes. In this way, I have spent the week incorporating growth into my coding journey.

I am on my way to pushing myself further and even though this means more bugs, changing the way in which I am attempting to solve a problem, etc.

For some helpful videos on growth mindset in programming:

https://www.youtube.com/watch?v=tvuD0W_Dt88

Now, what are some examples “cold hard programming knowledge” I learned this week?

Here are some answers to example interview questions!

What is the main difference between a forEach loop and a .map() loop? When would you use either one?

Both go over a loop, but forEach returns the original array, while .map() creates a new array. So, forEach mutates the array, and .map() creates a copy of the array and simultaneously applies those changes to this new array.

Essentially, the choice between these functions comes down to if we want to mutate the original array or do we want to change a duplicate array?

What is the difference between Bubbling and Capturing?

Bubbling means that in the DOM, an event generates from the item that was clicked (child) up to all its parent tree, starting from the nearest one.

Capturing is the opposite: the outer event handlers are fired before the more specific handler (e.g., on a button).

In the example below, bubbling would be when the button fires before the container. Capturing would be the container fires before the button.

<div id=”container”>

<button>Click me</button>

</div>

Here are three great resources for more examples:

https://javascript.info/bubbling-and-capturing

https://flaviocopes.com/javascript-event-bubbling-capturing/

https://developer.mozilla.org/en-US/docs/Web/API/Event/bubbles

What is the definition of a higher-order function?

Higher order functions: any function that accepts and/or returns another function.

This is due to the fact that in JavaScript, all data can be stored in variables, arrays, properties, and methods.

Examples: .map(), .sort().filter()

Additional resources:

https://www.youtube.com/watch?v=H4awPsyugS0

https://www.codecademy.com/learn/game-dev-learn-javascript-higher-order-functions-and-iterators/modules/game-dev-learn-javascript-iterators/cheatsheet

ES6 Template Literals offer a lot of flexibility in generating strings…

Template literals are enclosed by the backtick (` `) instead of double or single quotes.

They can include placeholders. The expressions in the placeholders and the text between the backticks (` `) get passed to a function. Example: (${expression}).

Expanded explanation: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Template_literals

What Is an “associative array” in JavaScript? Do they exist?

Yes, associative arrays do exist in JavaScript, but not in the same way as other languages.

Associative arrays are objects in JavaScript where indexes are replaced by user defined keys. They do not have a length property and cannot be navigated using normal for loop.

Explanation from: tutorialspoint.com.

Why to NEVER use new Array in JavaScript…

Since JavaScript is a continually updated language, it is no surprise that there has been updates since new Array was used. These days, programmers create a variable and set it to an empty array. That way we can name the “new array” something descriptive to help us keep track of what we intend our arrays to contain/purpose to serve.

I hope this helps anyone who is working diligently on some tough programming projects/bugs or feeling nervous about when will you figure out the problem-solving aspect to programming.

Have a good evening / weekend / time, and I hope you take some refresher breaks to pat yourself on the back for keeping with it!

Your friend in code,

Rachel

--

--

Rachel McTavish
Nerd For Tech

I am an avid adventurer taking readers on my latest journey in learning to code. Let’s get started from 0 experience to programmer!