Tuesday, April 21, 2009

How to set up WAMP on Windows XP, and other thoughts about being a 1337 web developer

Oh, hai2u.
Well, several friends from the real world asked me to put together a guide for the n00b web developer.. so here it is. By no means should this be considered an all inclusive 'i can haz websitez' tutorial. I'm not going to teach you how to write code. Go figure that part out for yourself. What I will cover is the basics of setting up your development environment so that you can start writing code / playing with scripts. I'll also pack this post full of links about things I think you should do extended reading about.

What is WAMP / Why do I need it?
WAMP is an acronym for "Windows,Apache, Mysql, and PHP/Perl/Python". Ok, so what does that mean? Well WAMP is an easy to install bundle of the Apache Webserver, MySQL Database Server, and the PHP programming language running on Microsoft Windows. I personally use a MAMP stack (Mac OS X, Apache, MySQL, and PHP) when I develop web sites. Many websites run using a LAMP Stack (Linux, Apache MySQL, and PHP). Most of the time the host operating system does not matter, and the Apache/MySQL/PHP combo work the same on Windows as they do on Linux (but not always!).Anyway many times the most daunting hurdled to learning to develop websites is getting a local web server set up correctly. WAMP makes it super-easy to get started. Additionally WAMP provides some additional tools such as phpMyAdmin for interacting with your database...

What is Apache?
Apache is the web server daemon (background process) that runs around serving up requests for web pages. Read this wikipedia article about Apache for more information. She is both a feirce, and fickle mistress, so it is best to leave the 'default' settings for Apache when you install WAMP until you understand what you are doing.

What is MySQL?
MySQL is a relational database management system. It's open source and works like a champion in a variety of scenarios ranging from tracking inventory at a small business to running large ecommerce sites. Check out this Wikipedia article about mysql to learn more OR you can head over to w3schools and learn some SQL. MySQL is not the only database server which can be used to store data for web sites though. There is also PostgreSQL, FirebirdSQL, Oracle and..erm.. Microsoft SQL Server.

What is PHP?
PHP is a recursive acronym for "Hyptertext PreProcessor". It started out as a sort of extension to PERL waaaay back in the day, but now has grown in to one of the most widely used server-side programming languages on the internet. Here is an article on wikipedia about PHP and its' background. The PHP Manual can be found at http://www.php.net/ . One thing a lot of people do not understand when they start out is that WRITING PHP IS NOT THE SAME AS WRITING HTML! Let me explain.. HTML is an interpreted document format. A web browser will look at an HTML document and use the tags as a guide to displaying your content. This is all done by the computer of the person viewing the web page. PHP is a programming language. The WEB SERVER (apache in our case) will look at our PHP file and EXECUTE the instructions found inside the file. PHP is where the business logic of your website happens. Things like saving user information, storing a new blog post, or logging in to a website are all handled by the PHP side of the website. Whatever it is you are doing with PHP, just remember that the PHP is executed on the server and the results are then sent to the web browser as HTML (or xml, or json, or whatever.. but thats another topic entirely). Seriously though, to take full advantage of the power of the dark side...errm..PHP.. you will need to spend some time learning the basics of Computer Science (control structures, looping, multi-dimensional arrays, OOP, etc).

Installing WAMP.
Ok so now are are to the part where you want to install WAMP. It's pretty simple, just download WAMP, open the installer, accept the lisence agreement (it's open source), then it will ask you where you want to install WAMP to. The default location is c:\wamp . You can change this if you want, but I normally just leave it alone. The installer will run for several minutes while it copeis files. It will ask you to locate your 'default web browser'. Choose whichever browser you prefer (Firefox right?). The next thing you come across will be a "Windows Security Alert" from the Windows Firewall. You'll want to 'unblock' the Apache HTTP Server so that it can do its thing.


The next screen you come to will ask you to set up your PHP mail parameters. Starting out you can leave these settings alone, but if your want to you can change the settings to reflect any existing SMTP gateways you have set up.

Once you're done with that just click Finish and we're done. You now have a fully functioning install of WAMP ( assuming everything went smoothly!) All you need to do is launch WAMP and you are ready to rock and roll :)

Congratulations! YOU CAN HAZ WEBSITE!
Once you have launched WAMP you will have a nifty little icon in your system tray. It gives you quick access to things like your webroot, phpMyAdmin, PHP settings, Apache settings, and the ability to start and stop some (or all) services. It also serves as a status indicator as well. If the icon is Yellow it means that some services did not start up. If it is red then it means that no services are online. White means that everything is OK and all services are reported to be running.
Where do I put my website files?
Ah, yes! That's probably the reason your even reading this in the first place. You can't figure out where to put your website files. Well, assuming that you kept the default settings you will want to stick your files in C:\wamp\www\MyWebsite\ as seen below. What is really cool about making subfolders for all of your sites is that the index.php file you see will detect the subfolders and display links to them when you browse to http://localhost (go ahead, try it!) to visit your test website go to http://localhost/MyWebsite/



Important notice about using Development Tools!
You won't get anywhere without having the right tools. For the novice web developer on Windows this can be take some time to get right. Most people will start out by acquiring a copy of Adobe Dreamweaver (it really does kick ass). For those who are braver (read: want to actually learn to code) I recommend you use Netbeans. It has GREAT support for many languages, it's open source AND it's cross platform (Runs on Windows, Linux, and Mac OS X). As a professional developer,I practically live inside of Netbeans ( I use dreamweaver to rapidly prototype interface elements, but thats doesn't even equate to 10% of my time).

Debugging!
You'll run in to problems along the way. Install a copy of Mozilla Firefox. Then get: Web Developer Toolbar, Firebug, YSlow (requires firebug), and Switch Proxy (Just to start with!). I'll write another post about firefox extensions to help you along the way later this week.

WTF, your still here?
Ok fine. I'm sure some of you ran in to problems. Please leave your comments for me below (or if your reading this post and have ANY kind of critisism then please leave it as well). You can also send your questions / comments to me on Twitter: http://twitter.com/MonkeeOfEvil

1 comments:

Anonymous said...

THANK YOU. this is a great start. I have a website that earns quite a bit and decided to walk the fine line between bravery and stupidity and get to understand my php web intimately. Got all the php going, but got stuck with WAMP.

Thank you

Post a Comment