Highlight your pitfalls before you fall into the hole

Code quality often falls wayside when it comes to projects with tight deadlines. When we’re new to a language, framework or library, it’s easy to slip into a state of spaghetti thoughts, especially when you’re just trying to work things out.

You don’t know what you don’t know, and sometimes, this can lead you down an unnecessary road of major refactoring further down the line.

It’s a common issue, especially in JavaScript-based projects where many developers tend to pick things up without actually knowing JavaScript at all.

In part, this is because JavaScript is easy.

You can write something and it’ll just work without protest. There is no compiling. No bright red errors or yellow warnings. Libraries and frameworks like Angular, React and Vue might throw in some structural and architectural suggestions — but this doesn’t always guarantee that your code is robust from the get-go.

If you’re a Visual Studio Code user, the ability to install and use extensions is one of the reasons why the code editor is so popular amongst developers. There are multiple tools that are available for making your coding life easier, but there is a particular one that’s helped me become a better developer and it’s called Tech Debt Tracker.

Awareness in the moment

The perks of pair programming is that your partner has the opportunity to point out the blips in your thought processes and potential code related warning signs.

However, not every developer or engineer has the chance to get their code reviewed live by a more senior developer. Tools like Tech Debt Tracker gives you the alerts and warnings that you need about your code while you’re coding.

The thing with JavaScript-based development is that there is no requirement to code in a particular way. You could write a function with five-hundred lines and the produced output wouldn’t even bat an eye.

Your app can have the appearance of working just fine. But when it comes to inspections under the hood, you’d find that the wiring is not quite right.

When it comes to creating code, we are the human bridge between ideas and machines. In order to do this effectively, we need to learn how to communicate and connect the ideas together properly via code.

So when someone else sees five hundred lines worth of gibberish, you have failed yourself as a developer. Code is a communication and in order to communicate effectively, other developers need to understand what it is you’ve written.

To you, the code may make sense. But to the future and improved you, this code may actually not be at the quality and level you need it to be.

Tech Debt Tracker’s rating system prevents this, to a certain degree, from happening. It does this by assessing your code based on a series of six metrics — length, argument count, complexity, understandability, nesting depth and comment density.

Why it matters

There is a common misconception that the fewer lines of code you have, the better your code is.

This logic doesn’t work if you apply it to the minified version of the same code. When it comes to minification, everything sits on one line. But this doesn’t make the code’s quality any better than the original.

That’s just formatting.

True code quality often starts with the six metrics above. Length is not about your line count — but how long your actual code is. For example, the longer a function, the higher the chances for it to interface an error or unhandled side effect. Complexity is linked in with length.

The perks of Tech Debt Tracker is that it’s an extension that runs locally in the background, giving you live updates on your code quality scores. This means that you can consistently establish the quality of your code against pragmatic standards that can be extended to other team members with ease. It also means that in a team setting, you’re able to self review your code against a standard before committing or running your CI/CD pipeline.

If you are developing a project on your own or are just starting out without someone to review your code, the VS Code extension unwittingly turns into your free personal code tutor, pointing out where and why you’re going wrong.

What’s your code story?

Learning to code is like learning to write a novel — you’re creating a series of systems and rules, where your user is the active protagonist in the tale. They are experiencing the story which unfolds based on a series of actions.

As the code creator, you are creating a world that needs to be systematic in approach and simplified in a way that is accessible by others.

Juniors to a new concept, framework or library, often fall prey to overthinking, over-creating and over-engineering the code. They may end up writing an unnecessary amount of loops, promises, callbacks, nested functions and declaring variables in strange places with insider-knowledge names.

Sometimes we fall into bad patterns because of our preconceptions. Things that may work well in other spaces and languages may not be exactly transferrable. It takes practice to recognize our own bad patterns in context, something which many among us don’t realize we have.

How to use Tech Debt Tracker as a prototyping and learning tool

Tech Debt Tracker is made for teams, complete with GitHub collaboration features but I’ve been using it as a code improvement tool.

Inadvertent debt is a type of technical debt that is impossible for every developer to avoid. It is the type of debt that’s coded in due to lack of skill or awareness of a particular idea, knowledge topic or latest developments in the industry.

This kind of debt is not always the developer’s fault and can occur at any level. Tech Debt Tracker brings awareness to the process of coding and addresses potential issues before they become entrenched.

It can be hard when you’re coding by yourself with no one there to guide you. You may be self-taught, still in the process of learning, picking up something new and out of your main realm of expertise — but you can’t know what you don’t know. It gets even harder if you don’t realize you’ve got bad habits or major gaps in knowledge.

Using tools like Tech Debt Tracker can help increase your code awareness. It can also teach you a few things about code quality and how to achieve it. The tool is free and can be implemented at any point in your development process.

Final thoughts

The issue with many solo projects is that we often take code quality as the last point of consideration. A lot of us, especially newbies, stop when it starts working.

But if it works, why go further?

If you chose to ignore code quality as a facet of your development process flow, it is akin to building your app with sticks rather than bricks. The structure may appear to work under the current conditions, but if it ever gets stressed through requirement changes or the addition of new features, your code may collapse into itself over time.

It’s easy to write bad code. It’s harder to get into the right habits and mentality — something which Tech Debt Tracker can help guide you over with and get your code right the first time around.