Signified

Over the recent days I’ve been asked to speak with a few new starters where I work. As budding (and not-so-budding) web developers, they’re eager to latch onto the next big thing and blog about it in order to appear cool (oops!). So, in order to stop repeating myself and free up more time for shameless self-promotion, read on if you want to become a web developer and make lots of money.

The hot topics are:

• Training
• XHTML and CSS
• JavaScript and the DOM
• Web Standards
• Open APIs
• Google Maps
• Content Management Systems (CMS)
• Search Engine Optimisation (SEO)
• Development Environments
• Development Frameworks
• Coding Standards
• Version Control
• Documentation

Training

First, you’ll need some top-quality, number 1 training. And for this, you need look no further than Signified. Signified offers training courses in web technologies offered through Learn4Life at The University of New South Wales, Sydney, Australia. All Signified training courses are delivered by Robert Love, a highly experienced trainer and founder of Signified. All Signified training courses are held in fully-equipped, state-of-the-art, computer labs at The University of New South Wales.

XHTML and CSS

You’ve completed the course and you’ve read both the XHTML reference and the CSS reference from cover to cover, now you really want to see what is possible when XHTML meets CSS. It’s an oldy but a goldy - the one-and-only:

css Zen Garden: The Beauty in CSS Design

JavaScript and the DOM

You’ve completed the course and read the JavaScript reference, you’re following the zen path of unobtrusiveness, now you’re ready to forget everything you learned and start using someone else’s JavaScript framework:

• The Dojo Toolkit
• DOM Assistant
• jQuery
• mootools
• Prototype JavaScript framework
• Rico
• script.aculo.us
• The Yahoo! User Interface Library (YUI)

Web Standards

• Read the hype:
  Web Standards Project
• Join the club:
  Web Standards Group

Open APIs

It’s cool to use the acronym “API” in a sentence. In much the same way as it used to be cool to say “web services” every time you opened your mouth. Of course, acronyms are far cooler than actual words - even if the acronym is a word (REST, SOAP), a cleaning product (AJAX) or a mispelled boys name (JSON).

• Flickr Services
  Flickr has an open Application Programming Interface (API for short). This means that anyone can write their own program to present public Flickr data (like photos, tags, profiles or groups) in new and different ways. There’s a long list of API methods available to you to work with, and we love it when this happens, so… go forth and play!
• Google APIs
• YouTube Developer Area
  YouTube offers open access to key parts of the YouTube video repository and user community, via an open API interface and RSS feeds. Using our APIs, you can easily integrate online videos from YouTube’s rapidly growing repository of videos into your application. After you’ve created a developer profile, you’ll be ready to tap into the power of YouTube.

Google Maps

If you’re not using maps - you’re nowhere man! Get started with the Google Maps API (and other useful mappy stuff) here:

• Google Maps API
• Google Maps API Concepts
• Google Maps API Tutorial
• Free Geocoding

Content Management Systems (CMS)

If God had wanted us to pay for content management, he wouldn’t have started Open Source CMS (Try before you install!). Here’s a few of some note:

• Drupal
• eZ Publish
• Joomla!
• Mambo
• WordPress

Search Engine Optimisation (SEO)

Smoke and mirrors! Don’t blow your allowance on an SEO “expert.” If you have this:

http://www.example.com/products.php?cat_id=5&prod_id=72

Use Apache Mod Rewrite to change it to this:

http://www.example.com/products/widgets/noodle+spranger/

Development Environments

Now you have the know-how, it’s time to put it all into practice. To start, you’ll need a local development environment. I’m an open-source advocate (except for my laptop which is provided to me by work - so don’t give me shit about using Windows!). So, to set up a local Windows/Apache/MySQL/PHP (WAMP) development environment, check out Installing Apache, MySQL and PHP on Windows.

Development Frameworks

If we’re talking PHP - we’re eating Cake.

Coding Standards

If we’re talking PHP - we’re eating PEAR.

Version Control

Make sure you’re working on the right Subversion.

Documentation

phpDocumentor: The complete documentation solution for PHP

This is it! The definitive guide to installing and configuring Apache 2.2.4, MySQL 5.0.27 and PHP 5.2.1 on Microsoft Windows XP (SP2) with support for both MySQL and MySQLi PHP extensions.

And, yes, if you follow these instructions to the letter, the software will actually work!

Before getting started with the installations, you’ll need to download the required software packages - all of which are conveniently listed in the following table.

Installing Apache

1. Double-click apache_2.2.4-win32-x86-no_ssl.msi

   The Apache HTTP Server 2.2 - Installation Wizard appears with Welcome to the Installation Wizard for Apache HTTP Server 2.2.4

   

   Click Next

2. License Agreement

   Ensure “I accept the terms in the license agreement” is selected

   

   Click Next

3. Read This First

   

   Click Next

4. Server Information

   Enter the following details:

   Network Domain: localhost

   Server Domain: localhost

   Administrators Email Address: admin@localhost

   Ensure “for All Users, on Port 80, as a Service — Recommended” is selected

   

   Click Next

5. Setup Type

   Ensure “Typical” is selected

   

   Click Next

6. Destination Folder

   Accept the default destination folder (C:\Program Files\Apache Software Foundation\Apache2.2\)

   

   Click Next

7. Ready to Install the Program

   

   Click Install

8. Installing Apache HTTP Server 2.2.4

   

   Wait while the Installation Wizard installs Apache

9. Installation Wizard Completed

   

   Click Finish

Testing Your Apache Installation

In your web browser, go to http://localhost/. If Apache has been installed successfully, you will see the words “It works!”

The “It works!” web page - index.html - is located in the root directory of your Apache installation. The root directory can be found here:

C:\Program Files\Apache Software Foundation\Apache2.2\htdocs

Installing MySQL

1. Double-click mysql-essential-5.0.27-win32.msi

   The MySQL Server 5.0 - Setup Wizard appears with Welcome to the Setup Wizard for MySQL Server 5.0

   

   Click Next

2. Setup Type

   Ensure “Typical” is selected

   

   Click Next

3. Ready to Install the Program

   

   Click Install

4. Installing MySQL Server 5.0

   

   Wait while the Setup Wizard installs MySQL

5. MySQL.com Sign-Up

   Ensure “Skip Sign-Up” is selected

   

   Click Next

6. Wizard Completed

   Ensure “Configure the MySQL Server now” is checked

   

   Click Finish

7. The MySQL Server Instance Configuration Wizard appears with Welcome to the MySQL Server Instance Configuration Wizard 1.0.8

   

   Click Next

8. Please select a configuration type

   Ensure “Standard Configuration” is selected

   

   Click Next

9. Please set the Windows options

   Ensure “Install as a Windows Service” is checked

   Ensure “MySQL” is selected for Service Name

   Ensure “Launch the MySQL Server automatically” is checked

   Ensure “Include Bin Directory in Windows PATH” is checked

   

   Click Next

10. Please set the security options

    Enter and Confirm (retype) your password

    

    Click Next

11. Ready to execute …

    

    Click Execute

12. Processing configuration …

    

    Wait while the Server Instance Configuration Wizard configures MySQL

    Click Finish

Connection Error

In some cases (usually when MySQL is being installed over a previous version), the MySQL Server Instance Configuration Wizard will give a Connection Error that looks something like this:

If this happens to you:

1. Go to Start > Programs > MySQL > MySQL Server 5.0 > MySQL Server Instance Config Wizard

   The MySQL Server Instance Configuration Wizard appears

   

   Click Next

2. Please choose a maintenance option

   Ensure “Reconfigure Instance” is selected

   

   Click Next

3. Please select a configuration type

   Ensure “Standard Configuration” is selected

   

   Click Next

4. Please set the Windows options

   Ensure “Include Bin Directory in Windows PATH” is selected

   

   Click Next

5. Please set the security options

   Ensure “Modify Security Settings” is checked

   Enter and Confirm (retype) your password

   

   Click Next

6. Ready to execute

   

   Click Execute

7. Processing configuration …

   

   Wait while the MySQL Server Instance Configuration Wizard reconfigures MySQL

   Click Finish

Testing Your MySQL Installation

1. Go to Start > Programs > MySQL > MySQL Server 5.0 > MySQL Command Line Client

   The MySQL Command Line Client appears with a prompt to Enter Password

2. Enter the password you specified during the installation

   Press Enter

3. The MySQL Command Line Client will connect to the MySQL Server and produce the following welcome message and mysql prompt:

   Welcome to the MySQL monitor. Commands end with ; or g.
   Your MySQL connection id is 3 to server version: 5.0.27-community-nt
   
   Type 'help;' or 'h' for help. Type 'c' to clear the buffer.
   
   mysql>

Installing PHP

1. Create a new folder C:\php
2. Copy the contents of php-5.2.1-Win32.zip to C:\php
3. On your desktop, right-click My Computer and select Properties

4. In the System Properties dialogue box select the Advanced tab

   

5. Click the Environment Variables button

6. In the Environment Variables dialogue box under System variables select Path

   

7. Click the Edit button

8. In the Edit System Variable dialogue box add C:\php to the Variable value field

   

9. Click the OK button for all open dialogue boxes

Configuring PHP

1. In C:\php, copy the file php.ini-recommended
2. Rename the Copy of php.ini-recommended to php.ini
3. Open php.ini in Notepad

4. In php.ini, find this line:

   display_errors = Off

   and enable the display of errors by changing the value to “On”:

   display_errors = On

   Note: You wouldn’t do this in a production environment - this is just for testing and development!

5. In php.ini, find this line:

   extension_dir = "./"

   and specify the directory in which the loadable extensions (modules) reside by changing the value to “ext”:

   extension_dir = "ext"

6. In php.ini, find these lines:

   ;extension=php_mysql.dll
   ;extension=php_mysqli.dll

   and enable both the MySQL and MySQLi extensions by uncommenting the lines:

   extension=php_mysql.dll
   extension=php_mysqli.dll

7. In Windows Explorer, copy the following dll files:

   C:\php\libmysql.dll

   C:\php\ext\php_mysql.dll

   C:\php\ext\php_mysqli.dll

8. Paste the dll files to C:\WINDOWS\system32

   Note: Most installations don’t require you to copy libmysql.dll to system32, but some do. So it’s better to be safe than sorry!

9. Go to Start > Programs > Apache HTTP Server 2.2.4 > Configure Apache Server > Edit the Apache httpd.conf Configuration File

   The Apache configuration file opens (httpd.conf)

10. Add the following three lines at the end of the file:

    LoadModule php5_module "C:/php/php5apache2_2.dll"
    AddType application/x-httpd-php .php
    PHPIniDir "C:/php"

11. In httpd.conf, find this directive:

    <IfModule dir_module>
        DirectoryIndex index.html
    </IfModule>

    Add index.php as a directory index:

    <IfModule dir_module>
        DirectoryIndex index.php index.html
    </IfModule>

12. Save and close httpd.conf

13. Go to Start > Programs > Apache HTTP Server 2.2.4 > Control Apache Server > Restart

    Note: You need to restart Apache any time you make changes to the php.ini and/or httpd.conf files

Testing PHP

1. Open Notepad and type the following: <?php phpinfo(); ?>
2. Save the file as info.php in your web root directory (C:\Program Files\Apache Software Foundation\Apache2.2\htdocs)
3. Close info.php

4. Open info.php in your web browser (http://localhost/info.php)

   If PHP is installed correctly, you will see a table of information pertaining to your PHP installation environment

   

5. Open Notepad and type the following:

   <?php
   $mysqli = new mysqli('localhost', 'root', 'yourpassword', 'test');
   if (mysqli_connect_errno()) {
       printf('Connect failed: %s', mysqli_connect_error());
       exit();
   }
   printf('Host information: %s', $mysqli->host_info);
   $mysqli->close();
   ?>

6. Save the file as mysqli.php in your web root directory (C:\Program Files\Apache Software Foundation\Apache2.2\htdocs)
7. Close mysqli.php

8. Open mysqli.php in your web browser (http://localhost/mysqli.php)

   If MySQL is enabled, you will see the following output:

   “Host information: localhost via TCP/IP”

   

Finished!

That’s it, you’re done. Hopefully it all came together without any major dramas. If not, you have my deepest sympathies. And if that’s not enough, please leave a comment specifying exactly where it all went pear-shaped for you and I’ll do my best to get to the bottom of it.