Sunday, January 1, 2012

PHP: What You Need To Know To Play With The Web

In this article, I’ll introduce you to the fundamentals of PHP. We’ll focus on using PHP to access Web services and on turning static HTML pages into dynamic ones by retrieving data from the Web and by showing different content depending on what the user has entered in a form or requested in the URL.
You won’t come out a professional PHP developer, but you’ll be well on your way to building a small page that uses Web services. You can find a lot of great PHP info on the Web, and most of the time you will end up on PHP.net itself. But I was asked repeatedly on several hack days and competitions to write this quick introduction article, so here it is.
[Editor's note: A must-have for professional Web designers and developers: The Printed Smashing Books Bundle is full of practical insight for your daily work. Get the bundle right away!]

What Is PHP?

PHP is a server-side language that has become a massive success for three reasons:
  • It is a very easy and forgiving language. Variables can be anything, and you can create them anytime you want.
  • It is part of the free LAMP stack (Linux, Apache, MySQL, PHP) and thus available on almost any server you can rent on the Web.
  • It does not need a special editor, environment or build process. All you do is create a file of the .php file type, mix PHP and HTML and then put it on your server for rendering.

Installing PHP Locally, And Your First Code

To run PHP locally on your computer, you’ll need a local server with PHP enabled. The easiest way to do this is to download and install MAMP for OS X or XAMPP for Windows. Once you’ve installed any of these packages, you can start using PHP. Simply create a file named index.php in the htdocs folder of your MAMP or XAMPP installation.
In this file, type (or copy and paste) the following:
1
2  $myname = 'Chris';
3  echo 'This is PHP
'
;
4  echo "My name is $myname
"
5  echo 'My name in another notation is still  '.$myname.'
';
6?>
If you open this file in a browser by accessing your XAMPP or MAMP installation (via http://localhost/index.php or http://localhost:8888/index.php), you should see the following:
1This is PHP
2My name is Chris
3My name in another notation is still Chris
But you won’t see that. The problem is that the third line does not end in a semicolon (;). This is an error. Depending on your PHP installation, you’ll get either an error message or simply nothing. If you get nothing, then find the file named php_error.log on your hard drive, and open it. It will tell you what went wrong.
The PHP error log as shown on a Mac
The first thing to remember, then, is that every line of PHP has to end in a semicolon. If we fix this problem, we get this result:
PHP rendered in a browser
1
2  $myname = 'Chris';
3  echo 'This is PHP
'
;
4  echo "My name is $myname
"
;
5  echo 'My name in another notation is still  '.$myname.'
';
6?>
We can see here the first few important features of PHP:
  • PHP blocks start with and end with ?>. Anything between these two commands is interpreted as being PHP and returned to the document as HTML.
  • Every line of PHP has to end with a semicolon (;), or else it is an error.
  • Variables in PHP start with a $, not with the var keyword as you do in JavaScript (this is where it gets confusing with jQuery and Prototype).
  • You print content to the document in PHP with the echo command. There is also a print command, which does almost the same, so you can use that, too.
  • In this example, we have defined a string named myname as “Chris”. To print it with the echo command surrounded by other text, you need to either embed the variable name in a text with quotation marks or concatenate the string with a full stop when you use single quotation marks. This is line 3 and 4: they do the same thing but demonstrate the different syntax. Concatenation is always achieved with a full stop, never with a + as you do in JavaScript.
You can jump in and out of PHP anywhere in the document. Thus, interspersing PHP with HTML blocks is totally fine. For example:

01
02  $origin = 'Outer Space';
03  $planet = 'Earth';
04  $plan = 9;
05  $sceneryType = "awful";
06?>
07

Synopsis

08
09It was a peaceful time on planet echo $planet;?>
10and people in the echo $sceneryType;?> scenery were unaware
11of the diabolical plan echo $plan;?> from echo $origin;?>
12that was about to take their senses to the edge of what could be endured.
This outputs the following:
Rendered variables in PHP
Are you with me so far? To show something on the screen, particularly numbers or a string, we use echo. To show more complex structures, we need loops or specialized debugging methods.

Displaying More Complex Data Types

You can define arrays in PHP using the array() method:
1$lampstack = array('Linux','Apache','MySQL','PHP');
If you simply want to display a complex data type like this in PHP for debugging, you can use the print_r() command:
1$lampstack = array('Linux','Apache','MySQL','PHP');
2print_r($lampstack);
This gives you all the information, but it doesn’t help you structure it as HTML:
Displaying arrays with print_r
For this, you need to access the elements with the array counter. In PHP this is done with the [] brackets:
1
2
3$lampstack = array('Linux','Apache','MySQL','PHP');
4echo '

  • Operating System:'.$lampstack[0] . '


  • ';
    5echo '

  • Server:' . $lampstack[1] . '


  • ';
    6echo '

  • Database:' . $lampstack[2] . '


  • ';
    7echo '

  • Language:' . $lampstack[3] . '


  • ';
    8?>
    9
    See this demo in action.
    This is, of course, stupid programming because it is not flexible. If a computer is able to the dirty work for you, make it do it. In this case, we can define two arrays and use a loop:
    01
    02
    03$lampstack = array('Linux','Apache','MySQL','PHP');
    04$labels = array('Operating System','Server','Database','Language');
    05$length = sizeof($lampstack);
    06for( $i = 0;$i < $length;$i++ ){
    07  echo '

  • ' . $labels[$i] . ':' . $lampstack[$i] . '


  • ';
    08}
    09?>
    10
    The for loop works the same as it does in JavaScript. The only difference is that you read the size of an array not with array.length but with sizeof($array).
    Again, this example is not very clever because it assumes that both the $lampstack and the $labels array are of the same length and in the same order. Instead of using this, I’d use an associated array:
    01
    02
    03$lampstack = array(
    04  'Operating System' => 'Linux',
    05  'Server' => 'Apache',
    06  'Database' => 'MySQL',
    07  'Language' => 'PHP'
    08);
    09$length = sizeof($lampstack);
    10$keys = array_keys($lampstack);
    11for( $i = 0;$i < $length;$i++ ){
    12  echo '

  • ' . $keys[$i] . ':' . $lampstack[$keys[$i]] . '


  • ';
    13}
    14?>
    15
    The function array_keys() gives you back all the keys of an array as an array itself. This way, we can display the keys and the values at the same time.
    A shorter way to achieve the same principle, and which works with both arrays and objects, is to use the foreach() loop construct:
    01
    02
    03$lampstack = array(
    04  'Operating System' => 'Linux',
    05  'Server' => 'Apache',
    06  'Database' => 'MySQL',
    07  'Language' => 'PHP'
    08);
    09foreach( $lampstack as $key => $stackelm ){
    10  echo '

  • ' . $key . ':' . $stackelm . '


  • ';
    11}
    12?>
    13
    This is the shortest way to display a complex construct. But it will fail when $lampstack is not an array. So, checking for sizeof() is still a good plan. You can do this with a conditional.

    Using Conditionals

    Conditionals are “if” statements, both in the English language and in almost any programming language I know. So, to test whether an array is safe to loop over, we could use the sizeof() test:
    01
    02
    03$lampstack = array(
    04  'Operating System' => 'Linux',
    05  'Server' => 'Apache',
    06  'Database' => 'MySQL',
    07  'Language' => 'PHP'
    08);
    09if( sizeof($lampstack) > 0 ){
    10  foreach( $lampstack as $key => $stackelm ){
    11    echo '

  • ' . $key . ':' . $stackelm . '


  • ';
    12  }
    13}
    14?>
    15
    Common conditionals are:
    • if($x > 10 and $x < 20)
      Is $x bigger than 10 and less than 20?
    • if(isset($name))
      Has the variable $name been defined?
    • if($name == 'Chris')
      Does the variable $name have the value of "Chris"?
    • if($name == 'Chris' or $name == 'Vitaly')
      Does the variable $name have the value of "Chris" or "Vitaly"?
    Cool, but what if we want to make this reusable?

    Functions In PHP

    To make a task even more generic, we can write a function. In this case, we put the loop and the testing in a function and simply call it with different arrays:
    01
    02function renderList($array){
    03  if( sizeof($array) > 0 ){
    04    echo '
      ';
    05    foreach( $array as $key => $item ){
    06      echo '

  • ' . $key . ':' . $item . '


  • ';
    07    }
    08    echo '';
    09  }
    10}
    11$lampstack = array(
    12  'Operating System' => 'Linux',
    13  'Server' => 'Apache',
    14  'Database' => 'MySQL',
    15  'Language' => 'PHP'
    16);
    17renderList($lampstack);
    18
    19$awfulacting = array(
    20  'Natalie Portman' => 'Star Wars',
    21  'Arnold Schwarzenegger' => 'Batman and Robin',
    22  'Keanu Reaves' => '*'
    23);
    24renderList($awfulacting);
    25?>
    Note that functions do not begin with a dollar sign.
    We've already seen most of the magic of PHP. The rest is all about building functions to do all kinds of things: converting strings, sorting arrays, finding things in other things, accessing the file system, setting cookies and much more, each of which does one and only one thing right. I keep catching myself writing complex functions in PHP, only to realize from looking at the documentation that a native function already exists for it.

    Interacting With The Web: URL Parameters

    Let's start playing with the Web in PHP… or, more precisely, playing with information that comes from the browser's address bar or with forms that we can re-use. To get parameters from the current URL, we use the global $_GET array. So, if you call the index.php script with http://localhost/index.php?language=fr&font=large, you can change the display and locale by checking for these settings. The language parameter will be available as $_GET['language'], and the font parameter as $_GET['font']:
    01
    02$name = 'Chris';
    03
    04// if there is no language defined, switch to English
    05if( !isset($_GET['language']) ){
    06  $welcome = 'Oh, hello there, ';
    07}
    08if( $_GET['language'] == 'fr' ){
    09  $welcome = 'Salut, ';
    10}
    11switch($_GET['font']){
    12  case 'small':
    13    $size = 80;
    14  break;
    15  case 'medium':
    16    $size = 100;
    17  break;
    18  case 'large':
    19    $size = 120;
    20  break;
    21  default:
    22    $size = 100;
    23  break;
    24}
    25echo '';
    26echo '

    '.$welcome.$name.'

    ';
    27?>
    This means we can now send URL parameters to change the behavior of this document:
    changing the content and look of a document with parameters
    Notice that predefining a set of values that are acceptable for a certain parameter is always best. In the earlier example, we may as well have set the font size in pixels as a parameter and then written that to the document—but then we would have needed a good validation script to prevent end users from sending bad values or even malicious code through the parameter.
    Sending malicious code via a parameter without filtering is called cross-site scripting (XSS), and it is one of the big security problems of the Web. You can prevent it by not printing out the values of parameters, and instead using them in comparisons, and by using the filters provided by PHP.
    Say you want to allow users to enter data in a form that you will display later on. Make sure to filter out the results:
    01
    02  $search_html = filter_input(INPUT_GET, 's',
    03                              FILTER_SANITIZE_SPECIAL_CHARS);
    04  $search_url = filter_input(INPUT_GET, 's',
    05                             FILTER_SANITIZE_ENCODED);
    06?>
    07
    "index.php" method="get">
    08  
    09    
    10    "text" name="s" id="search"
    11           value="">
    12  
    13  
    class="bar">"submit" value="Make it so">
    14
    15
    16if(isset($_GET['s'])){
    17  echo '

    You searched for '.$search_html.'

    ';
    19}
    20?>
    See this filtering example in action. Without the filters, attackers could send parameters like index.php?s="
    2
    Using header() and json_encode(), you could do any complex conversion and filtering in PHP and re-use it in JavaScript.

    Summary

    I hope this gives you an idea of what PHP is and how you can use it to access Web services and to build your own APIs to re-use in JavaScript. Using PHP for the Web boils down to a few tricks:
    • Use cURL to load data from Web resources;
    • Convert information with simplexml_load_string() and json_decode();
    • Check the structure of returned information with print_r();
    • Loop over information with foreach();
    • Use the $_GET[] and $_POST[] arrays to re-use form data and URL parameters;
    • Filter information from the user and from URLs using the built-in PHP filtering methods.
    A lot of documentation is out there, and your best bet is to go directly to the PHP home page to read or download the documentation. Check out the user comments in particular, because that is where the real gems and examples of implementation appear.

    2 comments: