How to turn your Ubuntu into a Web Development system

I have been an Ubuntu user since version 6.04 and I still remember, the first time I installed on my desktop, I literally screwed the system (it was a great learning experience, though). Since then I am an avid Ubuntu user.

Almost a year ago, I purchased a new laptop (my 2nd personal laptop) and It was so important for me (as a web developer) to have a dedicated system for development. I am sharing my experience on how I used my laptop (which was shipped with Windows 8) into a web development system. In this step by step guide I will show you how to configure a  Local server (Apache with PHP) and a version control system (Git) with an IDE.

Local Server

Let’s  start with the basics, first thing that you would require is to have web server. You can choose XAMPP  for linux. However, I would recommend you to install all the required software on your own.


I use apache (you can use another http server as well). Open terminal and just use the following commands.

sudo apt-get install apache2

Now if you will open your browser (I recommend the mighty Firefox which is shipped with Ubuntu by default) and go to http://localhost or it should show “It Works!!”


You need a database system. I use MySQL

sudo apt-get install mysql-server libapache2-mod-auth-mysql php5-mysql


I mostly work with PHP, so here are the steps to Install PHP

sudo apt-get install php5 libapache2-mod-php5 php5-mcrypt

Also, I recommend you should install PhpMyAdmin , which is a very good Database management system for MySQL

sudo apt-get install phpmyadmin
sudo service apache2 restart

You can access PHPMyAdmin at the following URL


Now you can use the folder /var/www for all your Web Development. I usually create a folder and then change the permission to be used

chmod -R 777 "Folder Name"

Now you are up and running with a full fledged web server. You can create your own websites and probably go public with this server (if you consider some security concerns)

Version Control

You should work with a version control system such as Git or SVN. I use git with github and bibucket to host my code. Here is how you can setup git on your system
sudo apt-get install git-core


Now , lets work on the code writing part.


By default Ubuntu ships with Gedit, which is a quite useful text-editor and if some plugins are added it can become a pretty good tool to write your code. To add the plugins you can just use the following command at the terminal.

sudo apt-get install gedit-plugins

You can also use Geany, which is a pretty good IDE. I use the * wildcard to install everything related to Geany (including plugins)

sudo apt-get install geany*

However, recently we have some other good options as per IDE are concerned for linux distros. Such as Brackets, Atom and Aptana.

My personal favourite is Brackets. To install Brackets , you need to download  the .deb package from their website (link) to a folder and install it using the following command

dpkg -i brackets-release-version

Where you should choose the release you have downloaded.

Now you are ready to run your own web development machine on Ubuntu. Do share your experiences and comments so that I can improve this article and learn wherever I am missing.


Make your panel awesome using tint2 in ubuntu

I am using unity on ubuntu 12.04. The version is heavily modified for my personal use. I was using tint2 as a bottom panel. Today I just tweaked it to something awesome thanks to this awesome documentation.

Customized Tint2
Customized Tint2




I am using code , which is a modified version of the code found in the documentation. Hope it works good for you . 🙂


# general panel settings
rounded = 7
border_width = 2
background_color = #000000 60
border_color = #ffffff 18

# active taskbar elements
rounded = 7
border_width = 0
background_color = #FFFFFF 20
border_color = #FFFFFF 15

# active desktop
rounded = 7
border_width = 0
background_color = #FFFFFF 0
border_color = #FFFFFF 15

rounded = 7
border_width = 1
background_color = #000000 50
border_color = #FFFFFF 15

# tooltip
rounded = 0
border_width = 1
background_color = #000000 60
border_color = #FFFFFF 10

panel_monitor = all
panel_position = bottom center
panel_size = 85% 30
panel_margin = 7 0
panel_padding = 7 0
font_shadow = 0
panel_background_id = 0
panel_dock = 0
wm_menu = 1

taskbar_mode = multi_desktop
taskbar_padding = 2 3 2
taskbar_background_id = 1
taskbar_active_background_id = 4

task_icon = 1
task_text = 0
task_width = 40
task_centered = 1
task_padding = 2 2
task_font = sans 7
task_font_color = #ffffff 70
task_active_font_color = #ffffff 85
task_background_id = 3
task_active_background_id = 2
urgent_nb_of_blink = 8

systray_padding = 4 3 4
systray_background_id = 5

#time1_format = %H:%M
#time1_font = sans 8
#time2_format = %A %d %B
#time2_font = sans 6
#clock_font_color = #ffffff 76
#clock_padding = 1 0
#clock_background_id = 0
#clock_lclick_command = xclock
#clock_rclick_command = orage
#clock_tooltip = %A %d %B
#time1_timezone = :US/Hawaii
#time2_timezone = :Europe/Berlin
#clock_tooltip_timezone = :/usr/share/zoneinfo/Europe/Paris

battery = 0
battery_low_status = 0
battery_low_cmd = (null)
bat1_font = (null)
bat2_font = (null)
battery_font_color = #000000 0
battery_padding = 2 2
battery_background_id = 0

mouse_middle = close
mouse_right = none
mouse_scroll_up = toggle
mouse_scroll_down = iconify

DNS Cache in Ubuntu

I just updated DNS records on one of my customer’s website, and now the DNS record is not updating. The website is still pointing towards the old domain. I guess it is with my ISP’s DNS Cache. I thought to clear the DNS records of my system, which is Ubuntu by default.

And I found out that the Ubuntu does not uses a DNS cache.  I will try to dig deeper into it.And yeah you can use the following command to check out and dig about your domain 😛



Using sed for instant versioning of the files

Whenever I work with WordPress themes, I have to use either an IDE or manually add versions to each file in the template. ( Though this is the first time I am commenting my themes 😛 ). So I wanted to save some time implementing it. Why not use sed for the same.

This command does the trick for me 😛

sed -i ‘s/wpboot 0.1/wpboot 0.2/g’ *.php