How to get started with web development?

Many of my friends have asked me on how to start with web development. I am not expert but here in this post I would like to describe a few steps that might help one climb the ladder of web development fast. Kindly feel free to add to this blog post if you think some other methodology might be better off.

  1. Where do I start web development? Well the first and best place to start web development is your own system. Yes your very own personal computer. You don’t need a server on internet to start with. Infact I worked locally on my computer for about a month before I went for free hostings, shared hosting and finally VPS. Once you feel that you are comfortable enough with the tid-bits of web development, then you can move to one of them.
  2. How to configure my local computer for that? You have a number of options to start with. I personally started on Tomcat Server after my initial training at Oracle. Tomcat is suited if you are starting with JSP (Java Server/Servlet Pages) . I started by making a few basic pages like creating a login/registration system. I made a few and then hosted on my office computer. Distributed the links to a few around to get the much needed boost. (Yes if you are into web development you need a lot of encouragement and appreciation from others, else your enthusiasm can soon die out). However I soon realized that in todays world of web 2.0 Tomcat is not the thing. So I shifted to Apache.

    Next option you have is to go for Apache (which I use currently for all my developments). I have written 2 posts on how to configure your local system for the same. Read it here: Web Development Part 1 Apache MySQL PHP . If you are interested in starting on a unix machine (which is always the best thing to do) here is the post where I described: How to configure Ubuntu and LAMP on Windows.

  3. Things to concentrate upon initially? Before you go for any big big applications its better to get your basics right. I sucked for long while working with out dated styles and methodology. Here is a bunch of things which you should initially look to:
    • Choose the <div> style to create your HTML pages. I didn’t knew about this methodology and even went ahead to release Altertunes with <table> structure HTML pages.
    • While looking around on internet you will find loads and lot of framework offerings. They really make your work sooo simple. Takes all the burden away from you. Solves all cross browser compatibility for your application and what not. Find a list of frameworks I have tried before here: Essential Frameworks for web development
    • However one thing which you lose by using such frameworks is the insight. You never get to know what cross browser compatibility issues comes and how are they solved. They provide you easy ajax requests but you never get to know the methodology behind it. The biggest drawback which I find is that even for a simplest of application you always need to include whole bunch of files from framework hence making your application heavy for no reason.
    • Hence I finally went ahead coding everything from scratch and never ever used any framework for any of my works.
    • You need to learn how to prevent XSS (Cross browser scripting) and SQL Injection in your applications. Something very important for all your applications.

  4. Getting to a free hosting server: After initial play at your PC, its time to get to a free hosting server which brings in more knowledge and experience. I am lucky in the fact that I moved to X10 Hosting for the very first time. In my opinion they are one of the best in providing free hosts. The amount of features and largely the amount of support at their forums make them the best free hosting services around. I started with http://imoracle.x10hosting.com as my first ever site. Few applications which I build on that were:
    • User login and registration system, where user was authenticated by an link sent to him through email.
    • Inside I had a few basic applications including contact form, multiple picture uploads etc etc.
    • One of the finest feature I had in that was Gmail Contact Import script, which I made using PHP Curl application.
    • Last but not the least I built a chat application similar to browser based chat applications in google and yahoo mails. (Though not that efficient). That was first and the last time I used a framework for any of my application. It was built using Prototype Windows Class framework.

    I told you about these features as these were the applications which got me started initially. Helped me learn the tid bits of web development. May be you too can give a try to a few of them as your first few applications.

  5. Altertunes: Must be wondering why is this name up here again. Well I agree Altertunes fails as a full time product on web but then actually this self initiated project helped me learn all and everything about web development. It was hugely an ajax dominated website with ajax requests flowing in and out of everything you do inside. Basically the social networking aspect inside altertunes helped me learn most of the things. Key things inside altertunes which helped me develop my web dev skills are:
    • Social networking aspects like adding friends, sending personal messages, dedicating a song to your friends etc etc.
    • Importing Gmail, Yahoo and other email contacts. I initially used self made gmail address book import script. But then probably Gmail changed the ways on their mail and my script started failing. However I was lucky to find various services which helps you import mail contacts.
    • Creating of search bots for mp3. This was one of the things done in PERL instead of PHP. Read my blog on how to create an html parser using PERL here. This search bot was similar to any other search bot but it only used to index mp3 files in the database.
    • Use of various web services API’s like Artist Recommendation API by last.fm, Video API by YouTube, Pictures API by Google.
    • Features like creating your custom playlists, bookmarking artists, creation of analytic backend engine to provide users with the best recommended songs based on users listen history.
    • Finally, I learnt to make custom web players. Alterplayer which I made using OpenLaszlo, was something which I did out of PHP, MySQL, Apache.
    • Being at Oracle at that point in time, helped me in maintaining such a relational database with ease.
    • Auto suggest feature which is similar to google auto suggest. Altertunes used to offer you artist names as you typed in the name of the artist.
    • News from Google and Yahoo news. As there were no API’s available for this, I scrapped the google and yahoo news using PERL scripts and showed them to the users. (Illegal it was though) 😉

    However I must say that your website is not complete till you have all the look and feel and User Interface to lure the users. Initially I thought that the UI is coming up good but then as the features which I wanted to offer increased and with my sucking <table> structured HTML pages everything got screwed. However Altertunes helped me develop my web dev skills a hell lot and helped me understanding the right way of doing things. Probably picking up a small project for yourself is always the best idea, as then only you will always try to make your application look more professional.

  6. Time for a shared host : As the traffic increased on Altertunes I had to quickly shift to a shared hosting. I again went for a shared hosting at X10, where I bought a hosting server for around 80$ a year with 99% uptime till date. All my websites including Altertunes, My personal website and a few other under ground works of mine are hosted on the same shared host. Basically shared host assures you of more % uptime, more bandwidth and more forum support from X10. Those guys just go out of their ways at times to help you out.

    However you always have few drawbacks of a shared host:

    • First of all its a shared host i.e. a single CPU with many document roots (one root for each client) in it. At times hosting service providers over shoot the maximum allowed roots on a single CPU, which makes your CPU share low. And hence sucking performances.
    • Your site can go down even without a single error from your side. Yes this is the case which happened with me, when one of the other user on the same CPU set up a cron job (an automated job which runs every X hours) to take a backup of his server every 1 hour. Well in that case every single hour he used to consume maximum CPU cycles and hence all other users their started experiencing major downtimes. However X10 forum moderators are kind enough. They take immediate actions in such cases and ensure everything is fine.
    • You can’t have all PHP PEAR and Perl modules installed. I wanted to have a PHP PERL module installed for me by which I can write perl codes inside my PHP script. But as its a shared host and a package installed effects everyone on the CPU, I was denied by the X10 hosting admins.
    • Similarly for creating a upload meter application you need to have APC (Alternate PHP Cache) module enabled on your server. And I was again denied this package by the X10 hosting as they will cache all other users file which they might not want to.
    • Finally the biggest drawback is that you don’t have access to the httpd.conf i.e you apache server configuration file and your php.ini your php configuration file. Which at times you may want to change to meet your applications demand.

  7. Finally time for a VPS (Virtual Private Server) : When you start feeling you want a total control on your server and applications, its time to switch to a VPS. However they will cost you more than expected. I started with VPS at VPSFarm which I must say totally sucks. Doesn’t go well for me atleast with Zero support (‘Zero’ means zero). I took the Xen 1024 plan which costs around 40$ per month. However by the time my 1st month got over X10 started offering VPS too and with my experience and relations with them I immediately shifted to a VPS at X10. It too costs me same, around 35$ per month with more RAM and more Disk Space.

    However do not move to a VPS because you want to. It takes a lot of hard work to set it up and maintain it further. You basically have no support what so ever. Your mails not going, file not loading, server down, database not working. No one is accountable for that except you. But then you get all the controls on various configuration files which means you can fine tune the system to meet your needs.

    However one thing which I miss is the comfort of CPanel which used to come in by default with free host and shared hostings. I got so used to it in last 1 year.  Plus being from ECE background doesn’t helps me a great deal either. Anyways I suppose I am here to stay on VPS for long. I am slowly migrating all my websites to VPS. 

I guess this is all I had to share here in this post. If I have missed out on anything which many of you have asked me on chat and mails kindly feel free to ask it here. If I feel I need to add anything, will do so.

For experienced developers who accidentally read till here, feel free to add anything you want to. If you feel anything was wrong in my methodology and approach do let us all know. I am still learning.

All the best for all those starting out there.

Patience is the Key I will say finally.

——————————————————————————-
Other Posts you may want to read:
——————————————————————————-

How to write crawlers and parse a page using Perl (Part 1)

Hello all perl freaks,

One of the most powerful thing which we can achieve using perl is, extracting any content from a website you want to. For example, you can use perl to extract information of all the artists from All Music, extract information about all cricket players and matches from CricInfo. In the past I have used perl for making web crawlers for Altertunes and most recently I used perl to extract news from Google News.

Here I will try to explain how efficiently you can extract information by parsing html pages using perl.

To start with lets revise some basic stuffs about perl.

Lets first see how can we get HTML content of a website:

Example 1

require LWP::UserAgent;

#~ Call the gethtmlpage function by passing the url we want to save
gethtmlpage("http://abhinavsingh.com");

sub gethtmlpage {
  my $ua = LWP::UserAgent->new;
  #~ Use below line of code for proxied net connection
  $ua->proxy('http','http://[PROXY_URL]:[PROXY_PORT]/');
  my $response = $ua->post("$_[0]");

  if ($response->is_success) {
    $output = $response->content;
    open($fh,">abhinavsingh.com.html");
    print $fh $output;
  }
  else {
    print "Error in getting HTML page";
  }
}

If you are using PXPerl on windows, copy paste the above code in the SciTE perl editor (which comes in packaged with PXPerl) and simply press CNTR+F7. This will result into an html file named ‘abhinavsingh.com.html’ in your folder.

Most important feature which makes PERL and Python as default choice for web crawlers, is their ability of regular expression match. Lets see at some of the regular expression we will be using for parsing an HTML page.

Example 2

$sentence = "This is a perl tutorial by Abhinav Singh at http://abhinavsingh.com";

#~ Matching $sentence for 'Abhinav Singh'
$sentence =~ m/Abhinav Singh/i;

print "Pre-Match: ".$`."n";
print "Match: ".$&."n";
print "Post-Match: ".$'."n";

Copy the above code in SciTE perl editor and press CNTR+F7. You should see a result similar to this:

Output 2

>perl example2.pl
Pre-Match: This is a perl tutorial by
Match: Abhinav Singh
Post-Match:  at http://abhinavsingh.com
>Exit code: 0    Time: 0.962

Now lets see how can we extract relevant information from a page. Suppose we are interested in extracting all information about the artist Metallica from AllMusic website. Below I will first show you my code for the same and then its result. Finally I will discuss as to how did I made all those regular expressions:

Example 3

require LWP::UserAgent;

$bandname = "Metallica";
getartistinfo($bandname);

sub getartistinfo {
  my %formdata;
  my $ua = LWP::UserAgent->new;
  #~ $ua->proxy('http','http://[PROXY_URL]:[PROXY_PORT]/');

  $formdata{'sql'}=$_[0];
  $formdata{'opt1'}=1;
  $formdata{'P'}='amg';

  print "Sending HTTP request for ".$_[0]."...n";
  my $response = $ua->post('http://www.allmusic.com/cg/amg.dll',%formdata);

  if ($response->is_success) {
    print "Got HTTP response... parsing output for ".$_[0]."...nn";
    $output=$response->content;

    # Extracting Overview, Biography, Discography, Songs, Credit, Charts & Awards link for the artist
    $output =~ m/cg/amg.dll?p=amg&searchlink=(.*)">/;
    $BaseLink = "http://www.allmusic.com/cg/amg.dll?p=amg&searchlink=";
    $OverviewLink = $1;
    $DiscographyMainAlbumLink = $BaseLink.$OverviewLink;
    $DiscographyMainAlbumLink =~ s/T0/T20/;
    print "Discography Main Album: ".$DiscographyMainAlbumLink."n";
    $DiscographySinglesEPLink = $BaseLink.$OverviewLink;
    $DiscographySinglesEPLink =~ s/T0/T22/;
    print "Discography Singles&EP: ".$DiscographySinglesEPLink."n";
    $DiscographyDvDVideosLink = $BaseLink.$OverviewLink;
    $DiscographyDvDVideosLink =~ s/T0/T23/;
    print "Discography DVD Videos: ".$DiscographyDvDVideosLink."n";
    $DiscographyAllSongsLink = $BaseLink.$OverviewLink;
    $DiscographyAllSongsLink =~ s/T0/T31/;
    print "Songs All Songs: ".$DiscographyAllSongsLink."n";
    $DiscographyCnAAlbumsLink = $BaseLink.$OverviewLink;
    $DiscographyCnAAlbumsLink =~ s/T0/T50/;
    print "Charts & Awards Billboard Albums: ".$DiscographyCnAAlbumsLink."n";
    $DiscographyCnASinglesLink = $BaseLink.$OverviewLink;
    $DiscographyCnASinglesLink =~ s/T0/T51/;
    print "Charts & Awards Billboard Singles: ".$DiscographyCnASinglesLink."n";
    $DiscographyGrammyLink = $BaseLink.$OverviewLink;
    $DiscographyGrammyLink =~ s/T0/T52/;
    print "Charts & Awards Grammy Awards: ".$DiscographyGrammyLink."nn";

    # Extracting Title Bar
    $output =~ m/<td class="titlebar"><span class="title">(.*)</span><br />/;
    $titlebar = $1;
    print "Titlebar:n".$titlebar."nn";
    $output = $';

    # Extracting Formed-Sub
    $output =~ m/Begin Formed(.*)<span>(.*)End Formed/;
    $output = $';
    $formedsub = $2;
    $formedsub =~ m/<a href=(.*)>(.*)</a>(.*)<a href=(.*)>(.*?)</a>/; # Parse $formedsub for exact string
    print "Formed: ".$2.$3.$5."nn";

    # Extracting timelinesubactive
    while($output =~ m/class="timeline-sub-active">(d+)</div>/) {
      print "ActiveYear:".$1."n";
      $output = $';
    }
    print "n";

    # Extract Genre, Style titles
    $output =~ m/id="left-sidebar-title-small"(.*?)</tr>/;
    $suboutput = $&;
    $output = $';
    while($suboutput =~ m/id="left-sidebar-title-small"><span>(.*?)</span>/) {
      #~ print "Subclasses:".$1."n";
      push(@GSM,$1);
      $suboutput = $';
    }
    #~ print "n";

    # Extract Genre contents
    $output =~ m/<td class="list-cell"(.*?)</td>/;
    $suboutput = $&;
    $output = $';
    while($suboutput =~ m/<li>(.*?)</li>/) {
      #~ print "Genres:".$1."n";
      $suboutput = $';
      $1 =~ m/<a href=(.*)>(.*)</a>/;
      push(@G,$2);
    }
    #~ print "n";

    # Extract Style contents
    $output =~ m/<td class="list-cell"(.*?)</td>/;
    $suboutput = $&;
    $output = $';
    while($suboutput =~ m/<li>(.*?)</li>/) {
      #~ print "Styles:".$1."n";
      $suboutput = $';
      $1 =~ m/<a href=(.*)>(.*)</a>/;
      push(@S,$2);
    }
    #~ print "n";

    # Extract Mood subclass
    $output =~ m/id="left-sidebar-title-small"><span>(.*?)</span>/;
    $output = $';
    #~ print "Subclasses:".$1."nn";
    push(@GSM,$1);

    # Extract Mood Contents
    $output =~ m/id="left-sidebar-list"(.*?)</div>/;
    $suboutput = $&;
    $output = $';
    while($suboutput =~ m/<li>(.*?)</li>/) {
      #~ print "Moods:".$1."n";
      $suboutput = $';
      $1 =~ m/<a href=(.*)>(.*)</a>/;
      push(@M,$2);
    }
    print "n";

    # Print the @GSM and @G,@S,@M content
    print $GSM[0].":";
    foreach $gen (@G) {
      print $gen."t";
    }
    print "nn".$GSM[1].":";
    foreach $gen (@S) {
      print $gen."t";
    }
    print "nn".$GSM[2].":";
    foreach $gen (@M) {
      print $gen."t";
    }
    print "nn";

    # Extract AMG Artist ID
    $output =~ m/<td class="sub-text"(.*?)</pre>/;
    $output = $';
    $1 =~ m/<pre>(.*)/;
    print "AMG Artist ID:".$1."nn";

    # Extracting Artist Mini Bio
    $output =~ m/id="artistminibio"><p>(.*)</p>/;
    $artistminibio = $1;
    $artistminibio =~ s/<a href(.*?)>//g; # Filtering out any link or html tags
    $artistminibio =~ s/</a>//g;
    $artistminibio =~ s/<i>//g;
    $artistminibio =~ s/</i>//g;
    print "ArtistMiniBio:n".$artistminibio."nn";

    # Extracting Other Entries, Group Members, Similar Artists, Influenced By and Follower
    $output =~ m/id="large-list"><tr>(.*?)</table>/;
    $suboutput = $&;
    $output = $';
    # Extracting two part of the table
    $suboutput =~ m/<td valign="top" width="266px">(.*)</td><td/;
    $lefthalftemp = $1;
    $righthalftemp = $';

    while($lefthalftemp =~ m/<div class="large-list-subtitle">(.*?)</div>/) {
      print $1.":n";
      $' =~ m/<ul>(.*?)</ul>/;
      $lefthalftemp = $';
      $li = $1;
      while($li =~ m/<li>(.*?)</li>/) {
        $li = $';
        $1 =~ m/<span class="libg"><a href=(.*)>(.*)</a></span>/i;
        print $2."n";
      }
      print "nn";
    }

    while($righthalftemp =~ m/<div class="large-list-subtitle">(.*?)</div>/) {
      print $1.":n";
      $' =~ m/<ul>(.*?)</ul>/;
      $righthalftemp = $';
      $li = $1;
      while($li =~ m/<li>(.*?)</li>/) {
        $li = $';
        $1 =~ m/<span class="libg"><a href=(.*)>(.*)</a></span>/i;
        print $2."n";
      }
      print "nn";
    }
  }
}

Copy the above code into the SciTE perl editor and press CNTR+F7. You should see an output as below, which contains all the extracted data about the artist Metallica.

Output 3

>perl example4.pl
Sending HTTP request for Metallica...
Got HTTP response... parsing output for Metallica...

Discography Main Album: http://www.allmusic.com/cg/amg.dll?p=amg&searchlink=METALLICA&sql=11:kifpxqe5ldte~T20
Discography Singles&EP: http://www.allmusic.com/cg/amg.dll?p=amg&searchlink=METALLICA&sql=11:kifpxqe5ldte~T22
Discography DVD Videos: http://www.allmusic.com/cg/amg.dll?p=amg&searchlink=METALLICA&sql=11:kifpxqe5ldte~T23
Songs All Songs: http://www.allmusic.com/cg/amg.dll?p=amg&searchlink=METALLICA&sql=11:kifpxqe5ldte~T31
Charts & Awards Billboard Albums: http://www.allmusic.com/cg/amg.dll?p=amg&searchlink=METALLICA&sql=11:kifpxqe5ldte~T50
Charts & Awards Billboard Singles: http://www.allmusic.com/cg/amg.dll?p=amg&searchlink=METALLICA&sql=11:kifpxqe5ldte~T51
Charts & Awards Grammy Awards: http://www.allmusic.com/cg/amg.dll?p=amg&searchlink=METALLICA&sql=11:kifpxqe5ldte~T52

Titlebar:
Metallica

Formed: 1981 in Los Angeles, CA

ActiveYear:80
ActiveYear:90
ActiveYear:2000

Genre:Rock

Styles:Thrash	Heavy Metal	Speed Metal	Hard Rock

Moods:Bitter	Suffocating	Fierce	Angry	Aggressive	Menacing
Gritty	Tense/Anxious	Hostile	Crunchy	Epic	Nihilistic	Fiery
Intense	Dramatic	Harsh	Ominous	Rebellious	Uncompromising
Searching	Gloomy

AMG Artist ID:P     4906

ArtistMiniBio:
Metallica was easily the best, most influential heavy metal band of the '80s,
responsible for bringing the music back to Earth.
Instead of playing the usual rock star games of metal stars of the early '80s,
the band looked and talked like they were from the street.
Metallica expanded the limits of thrash, using speed and volume not for their own sake,
but to enhance their intricately structured compositions.
The release of 1983's Kill 'Em All marked the beginning of the legitimization
of heavy metal's underground, bringing new complexity and depth to thrash metal.
With each album, the band's playing and writing improved;
James Hetfield developed a signature rhythm playing that matched his growl,
while lead guitarist Kirk Hammett... Read More...

Other Entries:
Movie Entry
Classical Music Entry

Group Members:
Kirk Hammett
James Hetfield
Dave Mustaine
Jason Newsted
Lars Ulrich
Cliff Burton
Robert Trujillo
Ron McGovney

Similar Artists:
Slayer
Anthrax
Sepultura
Machine Head
Coroner
Death
Dio
Danzig
King Diamond
Mercyful Fate
Metal Church
Overkill
Voivod
Death Angel
Queensr?che
Cancer
Corrosion of Conformity
White Zombie
Rollins Band
Melvins
Soundgarden

See Also:
Megadeth
Flotsam & Jetsam
Exodus
Rock Star Supernova

Influenced By:
Mot?rhead
The Misfits
Diamond Head
Black Sabbath
Judas Priest
Angel Witch
Iron Maiden
Saxon
Accept
Budgie
Deep Purple
Rush
AC/DC
Led Zeppelin
G.B.H.
Fear
Ted Nugent
Lynyrd Skynyrd
UFO
Thin Lizzy
Queen

Followers:
Carcass
Grindcrusher
At War
Crowbar
The Beyond
Sevendust
Boy Hits Car
Queens of the Stone Age
Roachpowder
Ossiris
Avenged Sevenfold
Trapt
Hurt
Scenes from a Movie
Sick City
Saving Abel

Performed Songs By:
James Hetfield
Lars Ulrich
Kirk Hammett
Cliff Burton
Bob Rock
Dave Mustaine
Brian Tatler
Sean Harris
Roger Taylor
"Fast" Eddie Clarke
Glenn Danzig
Jason Newsted
John Deacon
Brian May
Freddie Mercury
Lemmy
Lemmy Kilmister
Phil "Philthy Animal" Taylor
Burke Shelley

>Exit code: 0    Time: 5.940

Thus, on running the above script you get all the insformation about the artist Metallica from the All Music’s Metallica page. For demonstration purpose I have just extracted information from Metallica’s main page, however you can write similar code to extract information from metallica’s other sub-pages on All Music.

Meanwhile, if you are just thinging as to, How come my perl script extract the artist information? What method have i used to make sure only the relevant information is parsed from the page? or How did I made all those regular expression matches? , watch out for Part 2 of this blog. As of now I leave up on you, to figure out how is it all done.

Here are a few important links which will help you in making crawlers similar to those of Altertunes, and also understand the methods I have used above.
1. Leed’s University perl page
2. Tizag
3. Finally the documentation which comes in with PXPerl, is in itself a complete guide for everything.

Hope I helped a little in your quest of making crawlers.

In next blog I will try to wrap up this section (I am tried writing this one as of now) 😉

All the best.

Web Development – Part 1: Apache, MySQL, PHP

Hello Friends,

Ever since I have started web development and launched Altertunes, many of my friends have asked me, “How and Where to start web development ?” . Though there are infinite tutorials over the internet on web development, I will try to jot down my experiences and learnings here.

To start with, I will just try to explain a few terms, before we go on and learn how to handle and integrate them together:

  1. Apache: is the web server, which is used world wide for web development. Since April 1996 Apache has been the most popular HTTP server on the World Wide Web. However, since November 2005 it has experienced a steady decline of its market share, lost mostly to Microsoft Internet Information Services. As of April 2008 Apache served 50.42% of all websites.
  2. MySQL: is a multi threaded and multi-user SQL database management system, which has more than 11 million installations. MySQL is popular for web applications and acts as the database component of the LAMP, BAMP, MAMP, and WAMP platforms (Apache-MySQL-PHP/Perl/Python on Linux/BSD/Mac/Windows), and for open-source bug tracking tools like Bugzilla. It’s popularity for use with web applications is closely tied to the popularity of PHP and Ruby on Rails, which are often combined with MySQL. PHP and MySQL are essential components for running popular content management systems such as Joomla, WordPress, Drupal, and some BitTorrent trackers. Wikipedia runs on MediaWiki software, which is written in PHP and uses a MySQL database.
  3. PHP: is a widely-used, general-purpose scripting language that is especially suited for web development and can be embedded into HTML. It generally runs on a web server, taking PHP code as its input and creating web pages as output. It can be deployed on most web servers and on almost every operating system and platform, free of charge. PHP is installed on more than 20 million websites and 1 million servers, although the number of websites with PHP installed has declined since August 2005. It is also the most popular Apache module among computers using Apache as a web server. The most recent major release of PHP was version 5.2.6 on May 1, 2008.

In short, Apache is the web server which serves the web pages for the website. MySQL is the database which is used to store necessary information ranging from user’s data to user’s pictures. PHP is the server side scripting language used to make web pages. Apache server takes PHP code as input, and outputs an HTML page on the browser.

Lets start some installations and configurations: If you don’t want to handle the installations and configurations of WAMP (Apache-MySQL-PHP on Windows), you may choose to download and install the pre-packaged installer from here. However its always better to configure things yourself to know the inner details. If you are brave enough to install and configure these modules, here we go:

  • Apache Installation: Go to http://httpd.apache.org/download.cgi and download the latest Win32 Binary including OpenSSL (MSI Installer) version of Apache Server Installer Available. Double click the installer and you should see something like this:

    Click next and after a few clicks you will be asked for the following parameters:

    Fill in the details, as shown in the figure above , choose installation type as ‘Typical’ and proceed to install the Apache server.

    Open up your favorite browser and type in http://localhost. If you see a page that says “It works!” then the Apache server has been installed successfully.

  • PHP Installation: Go to http://www.php.net/downloads.php and download the latest PHP Zip Package. Unzip the file into your C: drive, and rename the folder to C:PHP. Next copy the file C:PHPphp.ini-dist file to C:Windows and rename the file it C:Windowsphp.ini. This is the PHP Configuation file where we will be setting some of the important parameters later on.Now its time to integrate PHP with Apache we installed earlier. Open the Apache configuation file (Important: you should always have a copy of this file stored somewhere else, because an error or misconfiguration can cause your Apache server to crash!), which is located at C:Program FilesApache Software FoundationApache2.2confhttpd.conf into notepad and copy the following lines at the end of ‘LoadModule’ section in the configuration file:

    #AddType application/x-httpd-php .php
    LoadModule php5_module “C:/PHP/php5apache2.dll”
    AddType application/x-httpd-php .php .phtml .inc .php3
    AddType application/x-httpd-php-source .phps
    # configure the path to php.ini
    PHPIniDir “C:/Windows”

    Now lets configure the root directory of our Apache server. Root directory is the base directory from where the website is served. When you type in http://localhost in your browser, the server looks for the necessary files in the root directory and serves it to the browser. By default, the root directory of the Apache server is set to : C:Apache2htdocs. You may keep the root as C:Apache2htdocs or you may change it to a directory of your choice as follows:

    Look for the ‘DocumentRoot’ Section in the Apache configuration file located here: C:Program FilesApache Software FoundationApache2.2confhttpd.conf. You should see something like this:

    # DocumentRoot: The directory out of which you will serve your
    # documents. By default, all requests are taken from this directory, but
    # symbolic links and aliases may be used to point to other locations.
    DocumentRoot “C:Apache2htdocs”

    Change C:Apache2htdocs to a directory of your choice, anywhere on your computer. For eg. C:Workspace.

    Further scroll down in the httpd.conf file and search for a section which looks like this:

    # This should be changed to whatever you set DocumentRoot to.
    <Directory “C:Apache2htdocs”>

    Change the directory location from C:Apache2htdocs to whatever you have set in the step before.

    Now to test whether everything is configured correctly, create a file in the root directory of Apache server, named phpinfo.php and paste the following code into it:

    <?php phpinfo(); ?>

    Restart your Apache server from here Start > All Programs > Apache HTTP Server > Control Apache Server > Restart, and open the following URL in your browser: http://localhost/phpinfo.php . If everything is well setup and you are lucky enough, you will see something like this:

    Finally, we just need to make a few configurations in the PHP configuration file which we copied to C:Windowsphp.ini. Open the file in a text editor and find the section which looks like this:

    ; Directory in which the loadable extensions (modules) reside.
    extension_dir = “./”

    Change it to look like this:

    ; Directory in which the loadable extensions (modules) reside.
    extension_dir = “C:PHPext”

    Also, find the section in your PHP configuration file which looks like this:

    session.save_path = “/tmp”

    and change it to:

    session.save_path = “C:WINDOWStemp”

    And finally we come to the end of PHP installation section. Congratulations, Good going !

  • MySQL Installation: Go to http://dev.mysql.com/downloads/mysql and download the latest MySQL database. Once ZIP file has finished downloading, extract it using WinZIP or a similiar program on your computer. Double click the setup.exe file to start the installation. You should see something like this:Keep clicking next and keep all the default options (use typical installation and not the detailed one). After installation finishes, go to start -> run -> services.msc and start the MySQL service. (If MySQL service doesn’t exist, the installation was not successful) . Now we need to tell PHP that MySQL exists on your system, and we need to integrate them. Go to php.ini i.e. the PHP configuration file, and make the following changes:

    Search for something like this:
    ;extension=php_mysql.dll

    and make it like this:
    extension=php_mysql.dll (i.e. you just need to remove the semicolon)

    Additionally you need to add this:
    extension=php_mysqli.dll

    at the end of the extensions. Further copy:
    libmysql.dll to C:WindowsSystem32 and restart Apache.

  • PHPMyAdmin and MySQL Query Browser Installation: Though you can always use MySQL database through command line but having PHPMyAdmin or MySQL query browser will make your database management a lot easier and simple. To install download PHPMyAdmin from here. Download the ZIP file and extract it under the root directory of Apache Server, i.e. if root directory is set as C:Workspace , the extracted PHPMyAdmin folder’s location should have a path C:Workspacephpmyadmin.Open the config.ini.php file in the PHPMyAdmin folder and make the following changes:$cfg[‘Servers’][$i][‘user’] = ‘root’;
    $cfg[‘Servers’][$i][‘password’] = ‘YOUR_PASSWORD’; // Your MySQL Password
    /* Authentication type */
    $cfg[‘Servers’][$i][‘auth_type’] = ‘config’;
    /* Server parameters */
    $cfg[‘Servers’][$i][‘host’] = ‘localhost’;
    $cfg[‘Servers’][$i][‘connect_type’] = ‘tcp’;
    $cfg[‘Servers’][$i][‘compress’] = false;
    /* Select mysqli if your server has it */
    $cfg[‘Servers’][$i][‘extension’] = ‘mysql’;
    /* User for advanced features */
    $cfg[‘Servers’][$i][‘controluser’] = ‘root’;
    $cfg[‘Servers’][$i][‘controlpass’] = ‘YOUR_PASSWORD’; // Your MySQL Password
    /* Advanced phpMyAdmin features */
    $cfg[‘Servers’][$i][‘pmadb’] = ‘phpmyadmin’; //Name of PHPMyAdmin folder
    $cfg[‘Servers’][$i][‘bookmarktable’] = ‘pma_bookmark’;
    $cfg[‘Servers’][$i][‘relation’] = ‘pma_relation’;
    $cfg[‘Servers’][$i][‘table_info’] = ‘pma_table_info’;
    $cfg[‘Servers’][$i][‘table_coords’] = ‘pma_table_coords’;
    $cfg[‘Servers’][$i][‘pdf_pages’] = ‘pma_pdf_pages’;
    $cfg[‘Servers’][$i][‘column_info’] = ‘pma_column_info’;
    $cfg[‘Servers’][$i][‘history’] = ‘pma_history’;

    Now open the url, http://locahost/phpmyadmin and if everything is configured correctly you must see something like this:

And thats it, if you are able to see all the above images on your computer, it means you have just configured everything correctly and you are all setup for web development.

I have installed and configured all the components way back (6 months ago), hence there is a possibility that I might have missed out on some trivial points. If you catch hold of any such issue do comment the same.

Enjoy making cool webpages, and All the best for your website 🙂