Lesson 0: Beginners Mistakes

Before we get to learing the main refactoring techniques, there's some common beginner mistakes people make that aren't even on the list.

Indentation

By far the most common mistake is strange and partially missing indentation. If someone pastes code from online, sometimes they won't bother checking the indentation. HTML doesn't have tabs in text nodes, so when you copy, it just gives spaces, therefore making stolen code stick out like a sore thumb.
Whenever someone asks me to debug some code for them, if they haven't indented it properly, I just can't look at the code until it is. It's like writing a paragraph without capitalization or punctuation; Without indentation, code is straight up illegible.

Tabs vs Spaces

The main reason for using spaces over tabs is that

1. Why bother hitting the smaller button when my thumb is already on the big button?
2. Tabs are magic voodoo. They make no sense. How do they align things?
3. How is one character the width of 8 characters? That's too big.
4. Spaces play nicely with the code I steal online.
   

I'm going to explain each of these bullet points, starting with the button.

1. The tab key's only job is to indent.

If you don't use the tab key, why is it there?
Is it the IDE autocomplete key? Is that just the github copilot key? If so, I don't blame you. Good for you for getting your moneys worth out of your keyboard. I've seen people make double tapping the spacebar their tab key. It is important that you are using the tab key for something. What's more important is the competition of tabs vs spaces isn't about using the tab key, but using the tab character.

2. The tab character's only job is to indent.

The tab key isn't just 8 spaces. It's a single character that takes up 8 spaces. I'm not touting the space savings of the tab key, it's entirely negligable with a

of O(8*t*l) where t is the maximum indentation level and l is the number of lines of code, which means it's the same as spaces' space complexity of O(t*l).
Tabs let you select a one whole indentation space. Have you ever tried to mouse over to a certain space in the indentation just to miss it? Tabs give your mouse cursor (or text cursor) aim assist. Highlighting multiple tabs is also easier than highlighting multiple spaces. Deleting multiple tabs is easier than deleting multiple spaces. Have you ever been on a terminal text editor, and are forced to delete a lot of highly indented code? You'd know that the spaces are the longest part of deleting What matters is that you use the tab character for indenting. If you're searching a code file for something at the start of the line, (without having to use regex), you can search for the tab plus the string you're looking for. The reason why tabs can be difficult at times is because it's impossible to line some things up that you might want to.

A feature of tabs is that they will try to align with other tabs if you indent after writing text. This feature is justifyably bad (pun intended), or at least is terribly implemented. The

s or text viewers could have done some code to fix this, but... didn't. The IDE in theory could use the tab as a field separator and work out how much spacing is required, but that requires effort on their part, so it's a no go.

As long as you don't type anything to the left of a tab character (which should be never), this will never happen to you while programming. If you want to do some of this alignment for visual stuff like comments, you should ironically be using spaces. If IDEs actually put effort into the alignment feature of tabs, then it would be fine, but somehow they made it worse than having tabs be a fixed width.
So, if I just make all my tabs single spaces, wouldn't that solve all my problems? Can't this weird aligning bug, my cursor, highlighting, and deleting problems all be solved by using spaces?

3. You can make all of your tabs a single space.

Yes, that's right, you can make the width of a tab a single space wide. I get the play on words was misleading and ambiguous, but that's the point. The width of a tab is defined in the text editor you use. Who cares if a space is a tab or a tab is a space if you can make them look and act identically?
I'm not actually suggesting to make each tab one space wide, because that again defeats the purpose of the tabs. Hitting the tab key multiple times is bad because one tab is supposed to equal one indentation level, which will be really large on anyone else's computer. If you want to slim down your tabs to make it fit on your 4:3 screen, then make the tabs width 1 to 4 characters wide. If you have an ultrawide and want to take advantage of the horizontal real estate, you can make your tab characters 10 to 15 characters wide (this is very chaotic and cursed, but I've done it and boy does it work).

Main takeaway here is that

• Arguing spaces are better than tabs is pointless when tabs could be spaces.
• It's pointless for tabs to be spaces because they can't do the things tabs can.
• Arguing tabs are too wide is pointless when you can change how wide they are.

Lastly,

• Don't steal code (and if you do, at least replace the spaces with tabs).

Variable proximity

This website goes into broad detail about how moving related code together will make code more readable and reduce over all eye strain. While proximity is very important, it is less important for functions. Functions already are forced to be outside the main method of most languages, but they can be at the very top of the file as define macros, in a header file, or even another source file.

A common mistake that gets made is defining variables far away from where they get used. I they teach this in beginner programming languages like Coral, but they do it to show that those variables have been defined elsewhere in code. Like how in practice our example code would have more functions and classes, in practice variables get defined as close as they can possibly get.

Scope

Variables should be defined in the smallest

where they are needed. This wouldn't be as much of a problem if we took a couple minutes to think about every variable name, but sometimes we just want to use `i`. Sometimes there will be instances where you'd like to define a variable in a certain scope, but can't.

There's one main problem with this method, and that is it's ugly. When using braces, you expect to find some statement the braces refer to, but these empty scopes lead nowhere, which can cause confusion.