Book Image

Skill Up: A Software Developer's Guide to Life and Career

By : Jordan Hudgens
3 (1)
Book Image

Skill Up: A Software Developer's Guide to Life and Career

3 (1)
By: Jordan Hudgens

Overview of this book

This is an all-purpose toolkit for your programming career. It has been built by Jordan Hudgens over a lifetime of coding and teaching coding. It helps you identify the key questions and stumbling blocks that programmers encounter, and gives you the answers to them! It is a comprehensive guide containing more than 50 insights that you can use to improve your work, and to give advice in your career. The book is split up into three topic areas: Coder Skills, Freelancer Skills, and Career Skills, each containing a wealth of practical advice. Coder Skills contains advice for people starting out, or those who are already working in a programming role but want to improve their skills. It includes such subjects as: how to study and understand complex topics, and getting past skill plateaus when learning new languages. Freelancer Skills contains advice for developers working as freelancers or with freelancers. It includes such subjects as: knowing when to fire a client, and tips for taking over legacy applications. Career Skills contains advice for building a successful career as a developer. It includes such subjects as: how to improve your programming techniques, and interview guides and developer salary negotiation strategies.
Table of Contents (5 chapters)

During a recent bootcamp teaching session where I was walking through a number of frontend development techniques, a student asked a great question. Referencing the CSS styles, she asked:

This is a vital question to answer, especially for new students. For example, if you look at the CSS documentation you'll find thousands of potential style options. If you're learning these styles for the first time that list can be pretty intimidating. And that doesn't even bring in the idea of learning how the styles work together with applications as a whole!

Obviously, this issue does not only apply to CSS styles. When it comes to learning development, whether it's a programming language or framework, you will be greeted with a large amount of information that you'll need to memorize, or at least know where to reference it.

At first glance, this may seem like a daunting task. And many aspiring developers have given up on their learning journey because it seems like an insurmountable challenge.

However, I'm here to tell you that it's completely realistic for you to learn how to work with a large number of complex concepts. And if you follow the system I outline in this chapter, you'll be amazed at how quickly you pick up on memorizing more information than you ever thought possible.

With that being said, it's important to know that, by itself, repetition is a slow and naive memory training technique. As a development student, imagine that I had a list of a few hundred method names and tell you to memorize them. If you were to simply stare at the sheet of paper and try to memorize the names, how do you think you'd do? If you're like me and the majority of the world, probably not very well.

The reason why dry repetition isn't a great way to memorize names is because it doesn't give you a frame of reference for the names.

So, when it comes to implementing the visual mental mapping technique, we're essentially tricking our brain into thinking that it needs to move a piece of information into long-term memory. In this process, we associate a visual image with the term that we want to memorize. A key prerequisite for this to work is that the visualization needs to be relevant to the term (or the behavior of the term).

Getting back to the developer's initial question. Let's see how we can use visual mental mapping to memorize a CSS style. I'm going to use the text-decoration property as a case study. In the world of CSS, the text-decoration element allows you to add or remove an underline style to a piece of text. With this in mind, I would create an image in my mind that would look something like this:

Implementing visual mental mapping

So, in this example I have an image filled with decorations. And on top of the image, I have some text that is underlined. And it's sitting on the decorated fireplace mantle. By creating this visual image, I've mapped:

And with this mental image in place, I don't have to think about the term text-decoration, instead I will think of a decorated fireplace with underlined text sitting on the mantle. This visual is much easier for my brain to accept into long term memory because it has a direct frame of reference.

The text-decoration word is no longer a foreign element trying to invade my memory. Instead, it's catching a ride on an image that already has a home in my long-term memory.

So visual mental mapping seems like a great idea. However, the idea of creating thousands of visualizations isn't very practical, which is why, when I'm learning a new programming language, I also focus on picking up on patterns.

Returning to our case study of memorizing CSS elements, let's take a look at the border attributes available in CSS3:

As you can see, there are 21 available attributes. And that's just for managing border styles on a webpage! As you can imagine, it would be pretty intimidating to memorize this list, especially when you realize that it's only a very small percentage of the available CSS styles needed for development.

However, if you start to analyze the list you'll notice a number of trends. For example, there are a number of styles that simply reference: top, bottom, left, and right. These styles are simply ways for giving a border style to a specific side of an element.

Additionally, you may also notice that each side also has a set of options for color, style, and width. So practically, if you know that these elements are all available to the border set of elements, this list can be shrunk down to 5 items:

This is more manageable.