Necessity of documentation while programming

This is a post which discusses the one of the most important requirement of software development phase i.e. documentation.

What is Documentation?

Documentation is a way of telling other programmers and users about your program. It is basically writing comments in the code. Documentation can either for the user or it can be for the programmer.

  • User Documentation can be very helpful for user. It declares the set of rules and define the various ways in which user is allowed to use the software. It can also tell the way of setting up the various environments so that he/she can use the program.
  • Programmers Documentation is used to make the code understandable for the other programmers so that they can understand the code and help in the development and removal of the bugs in the code.

Why is it necessary to document the code?

  • You are going to read your code again in a while : So, you are going to read your code after a while. And when you are going to read it you are going to think why have you done this if and only if the code is not documented properly.
  • To make progress in your open source project : If you want the programmers to look at your code and help you so that your code becomes less and erroneous then you must attract users. Users are only going to come if it is fairly easy to use your program. You can also make it easy by telling the user how to use the software. If you have a large database of users them developers are going to come with them increasing the condition of the program. (Twitter Bootstrap is one of the great example for this. They have set up a great user manual which tells very simply about the project.)

Now you know the basic reasons for creating a documentation of the program. So let’s create documentation using Doxygen. To know more read this post. 


Learning LaTex

LaTex, I had never heard about this term before doing this project, but when I came to know about it’s features and found it excellent.LaTex is a document markup language and document preparation system for the TEX typesetting program. Within
the typesetting system, its name is styled as LaTex.

Within the typesetting system, its name is styled as L A TEX. The term L A TEX refers only to the language in which documents are written, not to the editor used to write those documents. In order to create a document inLaTex, a .tex file must be created
using some form of text editor. While most text editors can be used to create a LaTex document, a number of editors have been created specifically for working with LaTex.
LaTex is most widely used by mathematicians, scientists, engineers, philosophers, linguists, economists and other scholars in academia. As a primary or intermediate format, e.g., translating DocBook and other XML-based formats to PDF, LaTex
is used because of the high quality of typesetting achievable by TEX. The typesetting system offers programmable desktop publishing features and extensive facilities for automating most aspects of typesetting and desktop publishing, including
numbering and cross-referencing, tables and figures, page layout and bibliographies.

LaTex is intended to provide a high-level language that accesses the power of TEX. LaTex essentially comprises a collection of TEX macros and a program to process LaTex documents. Because the TEX formatting commands are very low-level, it is
usually much simpler for end-users to use LaTex.

Learning Meteor

Meteor is a JavaScript web development framework. Which does most of it’s work using the most used language of the web i.e. JavaScript so if you are an experienced JS developer you will have no difficulty in grabing most of it’s concepts. I have created a sample app for the web using this framework. This app is used to manage your tasks and can be easily setup using.
The apps developed in meteor can be easily converted into an android or ios app increasing the user base. Due to this reason this framework is very popular among the developers. That is why it is the top ten most starred repository on the web.
The language at the backend of the meteor is also JS. So many times the code for both things turns out to be similar. So you don’t have to write things again and again. File structure is self describable with self explanatory meanings and can be easily understood.Database used is NOSql : MongoDB making it favourable for data analysts to try thier hand on the data provided to them according to the user’s action on the website and create a better user experience and in the end increasing the revenue generated by companies.
Meteor also provide free hosting to the small apps with some special domain for it’s users. You just have to sign up on their official website and they will provide it for you. The setup for the production is almost similar to the testing. You can launch your app on the production and check for it’s performance and later buying your own domain, if it works fine.
Meteor is built on the top of Node.js. So, you have to install node before using this extensively used framework. After three easy commands you will be able to run the sample program already created for you by the meteor team.

Learning Bootstrap

BootStrap is javascript framework which is used to develop responsive websites. BootStrap is also known as twitter bootstrap is developed by the developers at Twitter. This library is extensively used by the web developers and designers to create almost
irresistable content that looks good on all screen sizes.
Bootstrap is a free and open-source front-end web framework for designing websites and web applications. It contains HTML- and CSS-based design templates for typography, forms, buttons, navigation and other interface components, as well as optional JavaScript extensions. Unlike many web frameworks, it concerns itself with front-end development only. Bootstrap is the second most-starred project on GitHub, with more than 100,000 stars and 45,000 forks.
The Bootstrap adopted the famous grid system and continue to work with it since the 2.0 release. Starting with version 3.0,Bootstrap adopted a mobile-first design philosophy, emphasizing responsive design by default. With the great documentation
and large fan base you can easily find tutorials on this topic making it easier to start writing your bootstrap enabled. And the best part is that you only have to know simple html to get started.

MathJax : Write math on the browser

First of all I would like to link to the presentation which you can check. This presentation will let you more about the MathJax.

MathJax is a tool which is used to lay out the math on the browser in a better way. Tex and Latex has been used since a while now to write big mathematical formulas in the form of a pdf. MathJax make use of these two ways to write math on the browser.

MathJax is a JavaScript library which can be used in collaboration with Tex, Latex, MathML and AsciiMath. These three are used to write mathematical formulas at various points.

Prior from MathJax images were used to put a mathematical formulas on the browser which was quite a big deal to lay them out properly on the browser. Also these images were headache for the visually impaired people as screen reader were not able to guess what was written on the image. To solve all these problems MathJax was introduced.

There are two ways to implement Mathjax.

  1. Through CDN (content delivery network)
  2. By downloading the files

Now let us discuss about the CDN implementation. This implementation is discussed properly in the documentation on the MathJax official website. Here is the link for it.

In the head section of your website write these lines of code.


MathJax.Hub.Config({tex2jax: {inlineMath: [[‘$’,’$’], [‘\\(‘,’\\)’]]}});

Now you can use Tex, Latex, MathML or Asciimath code anywhere on the page and that will be implemented as a mathematical formula.

If you wish see an example here is the link.

Another way of doing it is by cloning the github repository. Clone the github repository and you will find the a folder named test. In there you will find a file named example.html. Run this file and run various examples. Create any files in this folder and add script files as in the examples add any Tex, Latex or MathML content to show them on the browser.

Making a presentation in reveal.js

So, I was asked to make a presentation in reveal.js.

I went home and thought that it would be a difficult task but in the end I ended up doing it just in two hours.

You have to keep in mind that in this post I am not going to discuss about how to setup reveal.js and will not talk about the other features discussed in the documentation of the reveal.js.

So, first of all go reveal.js GitHub page and download the latest version of the code on the website.

Here is the link for reveal.js GitHub repository.

The downloaded file would be a zip file. If in windows, open the file simply by double clicking it.

If in Linux use these commands in the terminal to open the file. First of all download the unziper by using this command.

sudo apt-get install unzip

Then use this code to unzip the file by giving a name of the destination folder.

unzip -d destination_folder

After unzip open the folder and you will find a index.html file inside.

Open this file in your text editor. Inside the body tags delete every section it.


Now create each section using beginning and ending section tag. Each section is equivalent to one slide.

This is the way in which reveal.js presentation is created.

Ranvir Singh

Frameworks : Make my task easier

The next task that I was asked to complete was to read about the most famous full stack JavaScript frameworks that can be used to make the work simpler.

First of all, We must know who is a full stack developer.

–So, a full stack developer is someone that works both on the front-end(design) and the back end(working on the database).

Full satck in JavaScript can be done with the help of four technologies referred as MEAN.js

Which include

M – MongoDB – which can be used in the database management
E – express – Back-end web framework (makes node.js’s work simpler)
A – Angular – The front-end JavaScript framework
N – Node.js – Server side scripting language.

Any framework that make use of this stack can be considered as a full stack js framework.

Read about the first JavaScript full stack framework by clicking here.


Ranvir Singh.


Newer version of Projection Project

I have made some improvements as suggested by  the other GD members during my presentation of my projection project.

I made use of loops and functions while writing the code.

Used JavaScript to write HTML.

And added a feature where user can give the number of legs by himself(which can be both even and odd).

Only one input field and one canvas is shown at a time so that the user does not need to scroll down.

User can click on the buttons to see other views.

This is the github link.

Features that were installed by the help of GD members.

1. It should accept the number of legs from the user.
2. functions and loops must be used.

So, I used the opportunity to make this. I also added some of the features myself for example :-

1. Making a single page structure.
2. Using bootstrap to make a responsive structure.
3. Using only one canvas to make all the structures.
4. 6 Text fields to take data which are shown one by one to the inputs.

This is the link for the slide and the link for live example :-

Newer version live example.

The link to the presentation made on this is also available here.


The presentation is made in reveal.js. Learn how to create a presentation in reveal.js by clicking here.


Ranvir Singh



Project 1 : Projection of a table

About the Entry task

A entry task was  given to me in which I have to take some values from the user like :

  • Length of the table
  • Breadth of the table
  • Thickness of the table
  • Height of the Legs
  • Width of the legs
  • Thickness of the legs

and I have to show these on webpage :

  • Side View
  • Front View
  • Top View
  • Bottom View

by using JavaScript. Page was made with the help of HTML. Styling is done with the help of CSS.



Github link for the code :