Kunji Meena

7 Rules for Writing Beautiful and Maintainable Code

By Kunji Meena on November 2, 17 , Category: Programming
beautiful and readable code

 
Every good developer knows that maintenance of code is as important as building it. First thing to understand about maintaining the code is that it should be readable and reusable.
 
If you are one of those developer who doesn’t think about the future of the code and wants to just get the job done and not cares how ugly your code is. then, you really need to follow this article.
 
This article includes practical points that can be used with any programming language. Following habits can make your code readable, reusable and beautiful.

 
 
 

1. Use a good text editor

 

Using plain text editor is like learning to cook on a camping stove. Using a good Text Editor improves the productivity and makes the work effortless on some level. Use a fancy Text Editor like Sublime Text Editor, Atom, WebStorm, Visual Studio Code or any other that you like.

 

Bad Practive

ugly code
 

Good Practive

text editor for beautiful codes
 
 
 

2. Always use indentation and spaces

 

Indentation is a programming style. It is to put some colors on the code. It is an aesthetic choice. If you follow proper space and indentation then a most complex program can also look like a poem. Many programmers don’t use it but directly or indirectly it affects your productivity. In simple word its all about keeping things neat and organized so that your code can survive better. It plays huge role when other developers try to read and modify the code.
 
Indentation makes code easier to read, understand, modify, maintain and enhance. If the role of your program is to look at it once then, you don’t need to use any spaces and indentations but in most cases we have to read, understand, debug and modify the code frequently. There is no point of not using indentations. Make it a habit and it will be fun.

 

Bad Practive

server.get('/todos',function(req,res,next){
database.getAll(function(todos){
getAll(function(data){
var todos=_.filter(data.todos, function(todo){return todo.id !=id; });
data.todos= todos; commit(data); resolve(data);
});
}
}

 

Good Practive

server.get('/todos', function(req, res, next) {
   database.getAll(function(todos){
       getAll(function(data) {
          var todos = _.filter(data.todos, function(todo) {
              return todo.id != id; 
          });
          data.todos = todos; 
          commit(data); 
          resolve(data);
       });
   }
}

 
 
 

3. Use proper comments

 

You should first try to write the code as simple as possible so you don’t need to explain it through comments. Only when code is so complicated that it can’t explain itself then you should use comments. It’s good habit to explain complicated things in code. Code is not only for the machines it is also for the humans so don’t write it only for just to make it run. It should be understand easily by other developers and even you after some time.
 
Code can’t tell why the program works it can only tell how. To tell why, you need to write comments. Every time you write a new code aware of the why for the things which are not obvious to know.

 

Bad Practive

let medicine1 = ['alprazolam', 'clonazepam', 'diazepam', 'lorazepam'];
let medicine2 = ['Modalert', 'donepezil', 'memantine'];

 

Good Practive

//anti anxiety medication
let medicine1 = ['alprazolam', 'clonazepam', 'diazepam', 'lorazepam'];
//Cognition enhancement medication
let medicine2 = ['Modalert', 'donepezil', 'memantine'];

 
 
 

4. Don’t write lines too long

 

You can always break the lines in most cases. Long code lines are hard to read. It blocks the reading flow of program. I suggest you to not make the line longer than 80 characters.

 

Bad Practive

let userInfo = this.state.userInfo;
if(userInfo[3] == "" || userInfo[3] == null || userInfo[3] == undefined || userInfo[3] == "zero"){
   userProfileImg= "/public/img/noCategory/blankUser.png";
}
else{
   userProfileImg= "/resources/user/img/"+userInfo[3];
}

 

Good Practive

let userInfo = this.state.userInfo;
if(userInfo[3] == "" || userInfo[3] == null || 
   userInfo[3] == undefined || userInfo[3] == "zero"){
   userProfileImg = "/public/img/noCategory/blankUser.png";
}
else{
   userProfileImg = "/resources/user/img/" + userInfo[3];
}

 
 
 

5. File format

 

Don’t just put all the files in a folder. Try to divide the files category wise. For example if you are doing front-end work then use different folders for JavaScript, CSS and HTML Files.
 
Always use a format for file and folder name, for example ‘file_name’ or ‘fileName’ or ‘file-name’.

 
 
 

6. Namespace

 

Writing variable names that describes what does it store or function names that describe what does it do is very important for making the code readable. Using ‘i’, ‘j’ or ‘function’ doesn’t say anything that other developer or even after some time yourself will understand. Name itself should define what it is about and what does it do.

 

Bad Practive

let i = 'Elephant';
let j = 'Dog';

 

Good Practive

let animal1 = 'Elephant';
let animal2 = 'Dog';

 
 

Writing common names is also not good practice. Using names like add doesn’t say much, it just says that it adds something but it doesn’t say what. Always try to add meaning to the names. Adding meaning to the name of variable and function helps understanding the code easily.

 

Bad Practive

function add(){
    //
}

 

Good Practive

function addUser(){
    //
}

 
 

Don’t write names too long. Most developers don’t like long names. Name should be as small and as descriptive as possible.

 

Bad Practive

function functionToAddUserToShowAllTheUsersAtOnePlace(){
    //
}

 

Good Practive

function addUser(){
    //
}

 
 

Use a style format for the names

 

Bad Practive

function addUser(user1, user2){
    //
}
var user_one = 'Walter White';
var UserTwo = 'Gustavo Fring';
addUser(user_one, UserTwo);

 

Good Practive

function addUser(user1, user2){
    //
}
var userOne = 'Walter White';
var userTwo = 'Gustavo Fring';
addUser(userOne, userTwo);

 
 
 

7. Break the code into smaller parts

 

Breaking the code into smaller parts is the key aspect for simplicity and productivity. In this way code can be organized easily. Writing a huge programs is not maintainable. Break the code in a way that a part of a code can be used in multi place.

 
 
 

2 responses to “7 Rules for Writing Beautiful and Maintainable Code”

  1. Ani says:

    Cool tips to follow.

  2. yeezy says:

    I am usually to blogging and i really recognize your content. The article has really peaks my interest. I am going to bookmark your web site and preserve checking for brand new information.

Leave a Reply

Your email address will not be published. Required fields are marked *