Chapter 2: Installing XAMPP
As mentioned in the previous chapter, we’ll learn to set up our web server and install the PHP interpreter in this chapter. In addition, as we’ll be using PHP to interact with a database later in this book, we need to set up our database server too.
To set up our web and database servers, we need to install three software: the Apache web server, the PHP interpreter and the MarieDB database server.
Installing all three software can be tedious if we do them one by one. Fortunately, some kind folks at Apache Friends created a free package that contains all the software we need. This package is known as XAMPP, which stands for Cross-platform (X), Apache web server (A), MarieDB database server (M), PHP (P) and Perl (P).
The MarieDB database server is a community-developed fork of the MySQL server. Although M in XAMPP officially stands for MarieDB, you’ll see that XAMPP labels the database server as MySQL in the software. We’ll follow this label and refer to the database server as MySQL in our book.
For detailed instructions on installing XAMPP and using it to set up our servers, check outhttps://learncodingfast.com/how-to-install-xampp-and-brackets.
Instructions are available on the accompanying site of this book so that whenever there are any changes to XAMPP, you can find the updated instructions on the site. This will ensure that you’ll always get the latest installation instructions.
Besides installing XAMPP, you are strongly encouraged to install an advanced text editor to do your coding in. While you can definitely code in a basic text editor (such as Notepad), an advanced text editor offers features like syntax highlighting that makes your code easier to read and debug.
A recommended free editor is Brackets. For instructions on installing Brackets, head over tohttps://learncodingfast.com/how-to-install-xampp-and-bracketsas well.
2.1 Configuring php.ini
After you have installed XAMPP and Brackets on your computer, you are ready to start creating your dynamic website.
However, before we do that, we need to make some changes to the error settings on our PHP server. This ensures that whenever there’s any mistake in our code, an error message will be displayed on the browser.
To configure these settings, the most direct way is to modify a file called php.ini. The instructions below are valid at the time of writing. If there are any changes to the instructions, you can find the updated instructions athttps://learncodingfast.com/php.
To modify php.ini, we need to locate the file first.
To do that on Windows, launch XAMPP and click on the “Config“ button for Apache. Next, select php.ini. The file will be opened in Notepad.
On Mac, launch XAMPP and click on the “Start” button in the “General” tab. Wait for the status to turn green. Next, select the “Volumes” tab and click on the “Mount” button. Finally, click on “Explore” and look for the “etc” folder. You’ll find php.ini inside this folder. Open it using Brackets.
Once php.ini is open, scroll to the bottom of the page and add the following lines to it:
error_reporting=E_ALL
display_errors=OnThese lines are added to the bottom of the page so that if the settings have been set previously (in earlier parts of the php.ini file), the new lines will override the previous settings. We’ll discuss these two settings in Chapter 12 later.
Next, save the file and restart Apache. On Windows, just stop the Apache server (if it is currently running) and start it again. On Mac, select the “Services” tab and click on “Apache”. If Apache is currently running, click on the “Restart” button. Else, click on the “Start” button. Wait for Apache to restart and your settings will be updated.
You’ll now get an error message whenever there’s an error in your code. Depending on the PHP version you are using, some of the errors you encounter when testing the code in this book may differ from what is described. Don’t worry about that. We’ll discuss errors in depth in Chapter 12.
2.2 Important Links
Before proceeding to code our first web page, I would like to bring your attention to two important links.
The first ishttps://learncodingfast.com/php. This book uses lots of examples to illustrate different concepts. While you are encouraged to type out these examples in Brackets yourself, if you prefer not to, you can download the source code at the link above. The project files and any additional notes or updates to the book can also be found there.
Next, we have the errata page. While every effort has been made to ensure that there are no errors in the book and all source code has been tested extensively on multiple machines, if there are any errors we missed, you can find the errata athttps://learncodingfast.com/errata.
2.3 Coding our first Web Page
Great! We are now ready to start coding. First, ensure that you have started Apache in XAMPP.
Note
If you have any problems starting Apache, it is likely due to a port conflict. Follow the instructions athttps://learncodingfast.com/how-to-install-xampp-and-bracketsto resolve the conflict.
Next, create a new file in Brackets and add the following code to it:
<!DOCTYPE html>
<html>
<head>
<title>My first PHP page</title>
</head>
<body>
<h1>My first PHP page</h1>
<?php
#Simple hello world page
echo "Hello World!";
?>
</body>
</html>If you are using an ebook reader, the device may auto-hyphenate some words at the right edge of the line. If you see a hyphen in the code above, or in any of the examples in this book, try changing the font size to see if the hyphen remains. In most cases, there should be no hyphens in the code (such as in the example above).
Save the file above as hello.php to your htdocs folder. Any file that contains PHP code must be saved with a .php extension. A file that ends with a .php extension is also known as a PHP script.
You can find the htdocs folder inside the XAMPP (Windows) or LAMPP (Mac) folder.
htdocs is the root directory of your local web server. On Windows, to load the files stored in htdocs, you simply type https://localhost/<filename> into your browser’s address bar. For instance, to load hello.php, typehttps://locahost/hello.php.
On Mac, the easiest way to load files stored in htdocs is to enable port forwarding. This can be done under the “Network” tab in XAMPP. Suppose you have enabled “localhost:8080->80(Over SSH)” in XAMPP, to load hello.php, typehttps://locahost:8080/hello.phpinto your browser’s address bar.
Got it? You can refer tohttps://learncodingfast.com/how-to-install-xampp-and-bracketsfor more detailed instructions.
For ease of reference, from this point forward, I will usehttps://localhostto refer to your localhost. If you are using Mac, remember to add the port number to the URL (i.e.,https://localhost:8080).
Let’s analyze the code in hello.php now. Most of the code should look familiar to you except the following:
<?php
#Simple hello world page
echo "Hello World!";
?>The <?php … ?> tags above are known as PHP tags; they tell the server that code enclosed within should be treated as PHP code.
In our example, we have two simple lines of PHP code. The first line
#Simple hello world pageis known as a comment. Comments are written by programmers to explain their code to other programmers; these comments are ignored by the PHP interpreter.
To add a single line comment to our code, we precede the comment with # or // .
For instance,
# This is a comment
// This is also a commentTo add multiple lines comment, we enclose the comment in /*...*/ .
For instance,
/*This is an example of a
multi-line comment. */After the comment, we use the statement
echo "Hello World!";to display the words “Hello World!” on the browser. This is known as an echo statement; we’ll learn more about it in the next chapter.
Notice that we end the echo statement with a semicolon (;)? All statements in PHP must end with a semicolon. This is similar to how we end sentences with a period (.) in English.
If you load hello.php now, you’ll get
as the output.
That’s it. We have just coded our first PHP web page. Simple? Great! Let’s move on.