[First Steps in PHP] What Is a Server-Side Language? Let's Make a Dynamic Website with PHP!

"Is my website always the same and a bit boring..."
"Wouldn't it be cool if I could change the displayed message based on the time or day of the week!"

As someone who has gotten used to creating static pages with HTML and CSS, the world of "server-side languages" is the unavoidable next step for you to advance. The most representative of these is PHP, which we will start learning from today.

It's natural to have questions like "What does server-side mean?" and "How is it different from JavaScript?". In short, PHP is like a programmer working "backstage" on your website. Every time a user accesses a page, PHP works behind the scenes on the server to instantly create a "finished HTML" page tailored for that moment, and then delivers it to the user's browser.

In this article, we'll skip the difficult theory and create a simple program that "displays a different quote for each day of the week" just by copying and pasting. Let's take the first step into PHP and server-side programming together by experiencing that "It moved! It changed!" moment!

Getting Ready to Run PHP (Development Environment)

Unlike HTML and CSS, PHP won't work just by double-clicking the file and opening it in a browser. It requires a "server" environment that can interpret and execute PHP code.

You might feel that "Setting up a server sounds difficult...", but rest assured. These days, there are convenient, free software packages like "XAMPP" or "MAMP" that install everything you need all at once. With these, you can set up a practice server (a local development environment) on your computer with just a few clicks.

If you haven’t set up XAMPP yet, please refer to [PHP Basics] Complete Guide to Downloading and Installing XAMPP. After installation, place your PHP files in the specified folder (such as `htdocs`) and you're ready to go!

PHP Basics: Let's Start by Displaying the Current Time

PHP code is written inside HTML by enclosing it in special tags: <?php ... ?>. Only the code inside these tags will be executed by the server.

First, let's write the simplest program: "display the current time." PHP provides a command called echo for outputting text and a handy function called date() for getting the current date and time.


<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>PHP Test</title>
</head>
<body>
    <p>The server's current time is: <?php echo date('Y-m-d H:i:s'); ?></p>
</body>
</html>

Try saving this code with a name like test.php, place it in your XAMPP server environment, and access it in your browser. Every time you refresh the page, the seconds should update. This is the proof that PHP is "dynamically" generating the HTML!

The Main Event: Displaying a Different 'Quote of the Day'

Now that you've succeeded in displaying the time, it's time for today's main theme: creating a "Quote of the Day" feature.

Here's the flow of the process we want to achieve:

First, prepare a message for each day of the week, stored together in an "array".
Use the date() function to get today's day of the week.
Use the day of the week as a key to pull today's message from the array.
Display the retrieved message with echo.

An "array" is like a convenient box that can hold multiple pieces of data, organized by a name or number. Let's take a look at the code right away.


<?php
// Set the timezone, for example, to New York
date_default_timezone_set('America/New_York');

// Store messages for each day of the week in an associative array
$messages = [
    'Sun' => 'The best way to predict the future is to invent it. - Alan Kay',
    'Mon' => 'The road to success and the road to failure are almost exactly the same. - Colin R. Davis',
    'Tue' => 'Action is the real measure of intelligence. - Napoleon Hill',
    'Wed' => 'In the middle of difficulty lies opportunity. - Albert Einstein',
    'Thu' => 'Anyone who stops learning is old, whether at twenty or eighty. - Henry Ford',
    'Fri' => 'It takes a long time to become young. - Pablo Picasso',
    'Sat' => 'Rest is not idleness... is by no means a waste of time. - John Lubbock'
];

// Get today's day of the week as an English abbreviation (Sun, Mon...)
$today_weekday_abbr = date('D');

// Get today's message corresponding to the day of the week
$today_message = $messages[$today_weekday_abbr];
?>

This is the PHP logic part that determines the message. It gets today's day of the week with date('D') (e.g., 'Sun', 'Mon') and retrieves the corresponding message from the array.

The Final Product: A 'Quote of the Day' Page That Works with Copy-Paste

Now, let's combine the PHP logic we just made with HTML to create a single, complete page.

【IMPORTANT】Copy all of the code below and create a file named quote.php. Then, place that file in your XAMPP or MAMP's designated folder (e.g., htdocs) and access it in your browser via a URL like http://localhost/quote.php.


<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Quote of the Day</title>
    <style>
        body { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif; display: flex; justify-content: center; align-items: center; height: 100vh; margin: 0; background-color: #f0f2f5; }
        .quote-card { background-color: white; padding: 2rem 3rem; border-radius: 12px; box-shadow: 0 8px 30px rgba(0,0,0,0.12); text-align: center; max-width: 600px; min-width: 500px;}
        .quote-day { font-size: 1.5rem; font-weight: bold; color: #007bff; }
        .quote-message { font-size: 1.2rem; color: #333; margin-top: 1rem; line-height: 1.8; }
    </style>
</head>
<body>
<?php
// Set the timezone (e.g., New York)
date_default_timezone_set('America/New_York');

// Store messages for each day of the week in an array
$messages = [
    'Sun' => 'The best way to predict the future is to invent it. - Alan Kay',
    'Mon' => 'The road to success and the road to failure are almost exactly the same. - Colin R. Davis',
    'Tue' => 'Action is the real measure of intelligence. - Napoleon Hill',
    'Wed' => 'In the middle of difficulty lies opportunity. - Albert Einstein',
    'Thu' => 'Anyone who stops learning is old, whether at twenty or eighty. - Henry Ford',
    'Fri' => 'It takes a long time to become young. - Pablo Picasso',
    'Sat' => 'Rest is not idleness... is by no means a waste of time. - John Lubbock'
];

// Get today's day of the week (e.g., 'Sun', 'Mon', etc.)
$today_weekday_abbr = date('D');

// Get today's message
$today_message = $messages[$today_weekday_abbr];
?>
    <div class="quote-card">
        <p class="quote-day">A Quote for You Today</p>
        <p class="quote-message">"<?php echo $today_message; ?>"</p>
    </div>

</body>
</html>

Were you able to display it in your browser? When the date changes, the displayed quote will change automatically. This is the power of the server-side language PHP!

Points to Watch Out For and Other Applications

Setting the Timezone

The date() function returns the date and time based on the server's settings. This is fine if the server is in your timezone, but if you use a server in another country, the time will be off. To prevent this, it's good practice to explicitly specify your timezone at the top of your PHP file, like this: date_default_timezone_set('America/New_York');.

Customizing the Messages Yourself

Try changing the contents of the $messages array to your own favorite quotes or messages. It's also a great idea to change the design of the HTML part with CSS. Turning copy-pasted code into your own original content makes learning even more fun.

Summary

Great work! In this first step into the world of PHP, we learned the following:

That PHP is a server-side language that runs on the server to dynamically generate HTML.
That you need a development environment like XAMPP to run PHP.
That you write code inside <?php ... ?> tags and use echo to output text.
That you can create a simple program that changes its display based on the day of the week using the date() function and arrays.

Please remember the thrill of creating "change" with your own hands—something that wasn't possible with static HTML alone. This small step will open the door to the vast world of web application development.

Next time, we'll learn more about the basic rules of PHP: "variables" and "data types"!