One of the things that I have encountered frequently in my development experience is totally messed up and hard to read code by fresh programmers. Not only that, modifying the code and adding new features/changes to the application logic ends up spending hours and hours to fix the bugs born out of it. Although it takes years of experience and continuous learning that makes your coding skills great, there are a few simple tricks that beginners can apply to quickly shape up their coding styles and standards. Once you follow these simple rules, you might notice one day your code actually rhyming like a poem!
This is a rather long tutorial, so it is broken into a series of articles, each one emphasizing on one particular coding practice to improve your programming skills. Although the basic concepts explained here apply to any kind of programming in any language, we will use code samples and examples using PHP in creating a simple web based application.
There are 2 important things to keep in mind, as a beginner, when you want to start developing an application:
1. Divide the process flow of the application into at least 2 to 3 ‘layers’, each one with a particular responsibility and limited functionality.
2. While working on one layer of functionality, almost completely ignore how the other layers will work. This will not only generate clean code, it will also improve your habit of writing code that easily become reusable in other applications.
Step 1: Plan your code
First things first. Although many programmers just jump start typing code into their favorite IDE, It usually leads to extra effort because your mind needs to concentrate not only on writing the code, but also planning it at the same time. So whenever you are about to create an application, or a utility library, or even a simple quick fix script, take your writing pad and pen(cil) and note down the following things:
- Define Objective:
What will the program/script do? If there are more than one objectives, write each one down.
- List Features:
Write down all the top level features that the program/script will contain. Create a bullet list of ALL the features you are planning to provide in the application(either large or small).
Note: Feature list should only contain items from user’s point of view, and nothing related to coding. Also, do not worry about the user interface on how the features will work, only think of what functionality the user requires from the application.
- Divide Features:
Divide the feature list into ‘big’ and ‘small’ features; You might want to merge a few tiny things into one feature, or break apart a huge feature into a couple of smaller ones.
Arrange the complete feature list into at least 3 categories. Must have, Required, Optional. You may give numbers to priorities from 1-10 if you prefer, or use any other method of prioritizing that you like.
Once you have written down your notes, review them one more time. You might feel that the objective list and the feature list do not exactly complement each other, and if that is so, make amends where necessary and finalize the list again.
Now review the list one last time and you will probably tinker with some of the features slightly, make some of them optional or mandatory based on your review, or change priorities.
Note: During step 1, never worry about how a particular programming problem can be solved or how will you create a particular algorithm. Only worry about determining exact list of items that need to be done.
If you would like to exercise step1 and do not have a project of your own, assume that we are developing a simple ticket system that can be run inside a web browser. It allows people to submit bug reports and tickets for your software, and the developers can fix the issues and report back as necessary. Create the objective and feature list on your own, and if you have any difficulty, leave me a comment and I will try to reply to you as soon as possible.
Step 2: Design the application layer
Creating the objective and feature list part will give you a clear idea of what you are trying to accomplish. Not only that, you can also estimate a rough time limit based on your skills that will be required to complete the application development.
The second step involves designing the application layer. If you are not yet sick of the writing pad and pen(cil) by now, I assure you will be once we are done with the second step 🙂
Designing the application layer is, infact, a very quick painless process, unlike its name suggest. The only thing you need to do is create top level functionality of the application. Easy, isn’t it?
Hmmm.. I can see most of you with a frown on your face. You say “But How???” Let me give you a simple example.
Assume we are planning to make that ticket system discussed in step1. I would first create an application layer (You might have a different idea, and one that is completely valid too!):
- Display Login Screen
- Authenticate login request from user or coder. If login is successful, determine login type and show appropriate screens for startup
- Allow ticket creation/update functionality if a user has logged in
- Allow ticket update/close functionality to coders
Thats It! Thats all my application is going to do. Please remember that while my goal is to keep the application as simple as possible, I will try to include some basic functionality to it so as to make the tutorial work. Also, if you followed step1 completely, then you might have your own objectives, so you can make your own application layer based on that (either in numbered form, or as a system flow chart if you prefer)
Why I have decided on this particular application layer will be clear to you once we move on to our next step and start coding. You will also be able to compare this one with your own application layer after step3 and determine which one is better, and get a clear picture of how to design the application layer better so that the actual programming part becomes fun.
Stay tuned for the next part of this series, where we will start our coding and learn some more basic techniques for creating quality code.