Clean Code?
By: Wilson Hadi
Tags: Clean Code, Flutter

In this 2020 pandemic season, everyone became more concerned with cleanliness. This is also something, us, programmers should have been concerned with about our code. Having a clean code will help ourselves, as well as other programmers who may later use our code too. This is especially important when working within a team. Clean code helps us navigate, debug and reuse code with much more ease.

What is Clean Code?

Clean code is a practice all programmers should apply. Dirty code is something all of us would want to avoid. According to Robert Martin, the author the Clean Code textbook, there are a few principles that distinguishes a clean code and a ‘dirty’ one.

Efficient Comments

Comments should be kept at a minimum. This is because you would want to focus on writing better understandable more efficient code instead of relying on comments to explain them. They should only be used for code that needs additional explanation, but not because they are poorly written.

An example case is instead of doing this:

// check if user filled form is valid already

if (descriptionTextController != null && dropdown.value != null) {}

do this:

if (formIsValid()) {}

Good Naming

When writing methods, variables, etc. we should have them be meaningful and describes its purpose and intention well. For example:

Widget button1 ...

Widget button2 ... void pressButtonOne() ...

To outside readers, they won’t understand their intentions or what they do. Instead, you can give more meaningful names. For example:

Widget loginButton ...

Widget signUpButton ... void login() ...

Here is an example implementation in my code:

good naming implementation

Effective Functions/Methods

When writing functions or methods, it can be easy to stray and write long ones. Long functions or methods are usually an indicator that it is not efficient. They should be small and concise because they should only do one thing. An example in my code is as follows:

Here is when the function was inefficient:

As you can see, this method body seems long and does more than one thing, which is to check for something using if statement and renders a Flutter widget according to the result of that if block. Instead, you can refactor the code to be concise by making new methods:

In this case, the new methods are the successDialog() and failedDialog() which will be responsible for rendering the widgets. Now all 3 methods does only one thing.

DRY (Don’t Repeat Yourself)

I believe this is a principle most programmers have heard of. This basically means to avoid duplicate code so our code is more reusable, easily refactored and extensible. In my app, I have found some examples of duplicate code:

This code to render a Flat Button Flutter widget was used 4 times in the same class (page), which meant that there are a lot of duplicate code such as for setting the padding, colour, size, etc. So I refactored it and made a new custom widget class. This way, the custom button can be reused without having duplicate code. Additionally, it can be reused in other classes or pages.

Here is the example usage after creating the custom button:

You can see that the code is now able to be used with less duplicate codes for all those padding, size, margin, etc. Furthermore, when used more than once in the same class, there are significantly less lines of code compared to before refactoring.

Exception Handling

Along the development progress, errors are bound to happen. We should anticipate this early by performing exception handling so the application does not crash. An example of this is by using try-catch blocks to catch the errors that might happen.

An example of exception in our team’s code:

The catch block catches the errors and returns a response instead of letting the application crash.

Layout Formatting

This principle focuses on the formatting on your code based on the programming language norms you are currently using. Formatting refers to your coding style and readability which will help your code’s maintainability. Not to worry, using Linter will help you with this. Linter a tool specialised to analyse your code, it can function to help you know when there is some mistake in your code format. In our team, we use Linter as so:

Lint:

stage: lint

script:

- flutter analyze

A most commonly encountered dirty example for me is whenever there is an unused import, for example:

Simply have your Linter tool capture these and you can remove them.

In conclusion, let us all strive to have cleaner code for everyone’s sake.