Krok 7 z 10

PHP - Server za oponou

📖 Lekce

Co je PHP?

PHP je programovací jazyk, který běží na serveru (ne v prohlížeči). Když si prohlížeč vyžádá stránku, server spustí PHP kód a pošle výsledek.

HTML/CSS/JS = běží v prohlížeči (frontend)
PHP = běží na serveru (backend)

PHP může dělat věci, které JS v prohlížeči nemůže: číst soubory na serveru, přistupovat k databázi, posílat emaily...

Základní PHP syntaxe

<?php
// Proměnná
$jmeno = "Honza";

// Výpis
echo "Ahoj, " . $jmeno . "!";

// Podmínění
if ($hodina < 12) {
echo "Dobré ráno!";
}
?>

PHP kód se píše mezi <?php a ?>. Proměnné začínají znakem $.

PHP + HTML dohromady

PHP můžeš mísit přímo s HTML. Server zpracuje PHP a pošle výsledné HTML:

<h1>Dnes je <?php echo date("d.m.Y"); ?></h1>
<p>Je <?php echo date("H:i"); ?> hodin.</p>

Vysledek v prohlizeci: Dnes je 27.03.2026

PHP zpracuje dynamický obsah (datum, data z databáze, počítadla) a pošle čisté HTML. Uživatel PHP kód nikdy nevidí!

💻 Příklad k vyzkoušení

index.php

🚀 Vyzkoušej na Vibmy

<?php
/**
 * PHP - Server za oponou
 * Tato stránka ukazuje, co PHP umí dělat na serveru.
 */

// Aktuální čas a datum
date_default_timezone_set("Europe/Prague");
$currentTime = date("H:i:s");
$currentDate = date("j. n. Y");
$dayOfWeek = ["Neděle","Pondělí","Úterý","Středa","Čtvrtek","Pátek","Sobota"][date("w")];

// Náhodný vtip
$jokes = [
    "Proč programátoři nosí brýle? Protože nevidí C#.",
    "Co řekl HTML CSS? Bez tebe nemám styl.",
    "Kolik programátorů je třeba ke změně žárovky? Žádný - to je hardwarový problém.",
    "Proč se JavaScript a Java dobře neznají? Protože mají jinou třídu.",
    "Co je 8 * 8? Zapomněl jsem, ale vím, že je to 64.",
    "Jak programátor hledá partnera? Na match() funkci.",
    "Proč se databáze rozvedla? Protože měla příliš mnoho relací.",
    "Jak poznáte introvertního programátora? Kouká na SVOU obuv. Jak poznáte extrovertního? Kouká na VAŠI obuv."
];
$randomJoke = $jokes[array_rand($jokes)];

// Počítadlo návštěv (uložené v souboru)
$counterFile = __DIR__ . "/visit_counter.txt";
$visits = file_exists($counterFile) ? (int)file_get_contents($counterFile) : 0;
$visits++;
file_put_contents($counterFile, $visits);

// Informace o serveru
$phpVersion = phpversion();
$serverSoftware = $_SERVER["SERVER_SOFTWARE"] ?? "Unknown";
$userAgent = $_SERVER["HTTP_USER_AGENT"] ?? "Unknown";
$userIP = $_SERVER["REMOTE_ADDR"] ?? "Unknown";

// Pozdrav podle denní doby
$hour = (int)date("G");
if ($hour < 6) $greeting = "Dobrou noc";
elseif ($hour < 12) $greeting = "Dobré ráno";
elseif ($hour < 18) $greeting = "Dobré odpoledne";
else $greeting = "Dobrý večer";
?>
<!DOCTYPE html>
<html lang="cs">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>PHP Server</title>
    <style>
        * { margin: 0; padding: 0; box-sizing: border-box; }
        body {
            min-height: 100vh;
            font-family: "Segoe UI", system-ui, sans-serif;
            background: linear-gradient(135deg, #0f0c29, #1a1a3e);
            color: #e0e0e0;
            padding: 2rem;
        }
        h1 {
            text-align: center;
            font-size: 2.2rem;
            background: linear-gradient(to right, #00d4aa, #7b68ee);
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
            background-clip: text;
            margin-bottom: 0.5rem;
        }
        .subtitle { text-align: center; color: #6b7280; margin-bottom: 2rem; }
        .grid {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
            gap: 1.5rem;
            max-width: 900px;
            margin: 0 auto;
        }
        .card {
            background: rgba(255,255,255,0.04);
            border: 1px solid rgba(255,255,255,0.08);
            border-radius: 16px;
            padding: 1.5rem;
        }
        .card h2 { color: #00d4aa; font-size: 1.1rem; margin-bottom: 1rem; }
        .big-time {
            font-size: 3rem;
            font-weight: 800;
            text-align: center;
            color: #00d4aa;
            font-family: monospace;
        }
        .date-info { text-align: center; color: #8892a4; margin-top: 0.5rem; }
        .joke-text {
            font-style: italic;
            color: #c0c0c0;
            line-height: 1.7;
            padding: 1rem;
            background: rgba(123,104,238,0.08);
            border-radius: 12px;
            border-left: 3px solid #7b68ee;
        }
        .counter-big {
            font-size: 4rem;
            font-weight: 800;
            text-align: center;
            background: linear-gradient(to right, #ff6b9d, #f59e0b);
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
            background-clip: text;
        }
        .counter-label { text-align: center; color: #8892a4; }
        .info-list { list-style: none; }
        .info-list li {
            padding: 0.6rem 0;
            border-bottom: 1px solid rgba(255,255,255,0.05);
            font-size: 0.9rem;
        }
        .info-list li:last-child { border: 0; }
        .info-list strong { color: #a78bfa; }
        .greeting-big {
            font-size: 1.8rem;
            text-align: center;
            padding: 1rem;
        }
        .reload-btn {
            display: block;
            margin: 2rem auto 0;
            padding: 0.8rem 2rem;
            background: linear-gradient(135deg, #00d4aa, #7b68ee);
            color: white;
            border: none;
            border-radius: 12px;
            font-size: 1rem;
            cursor: pointer;
            transition: all 0.3s;
        }
        .reload-btn:hover { transform: translateY(-2px); box-shadow: 0 8px 25px rgba(0,212,170,0.4); }
        .php-badge {
            text-align: center;
            margin-top: 2rem;
            color: #555;
            font-size: 0.85rem;
        }
        @media (max-width: 600px) { body { padding: 1rem; } h1 { font-size: 1.8rem; } }
    </style>
</head>
<body>
    <h1>&#x1F5A5;&#xFE0F; PHP Server</h1>
    <p class="subtitle">Vše na této stránce generuje PHP na serveru</p>

    <div class="grid">
        <div class="card">
            <h2>&#x23F0; Serverový čas</h2>
            <div class="big-time"><?php echo $currentTime; ?></div>
            <p class="date-info"><?php echo $dayOfWeek . ", " . $currentDate; ?></p>
        </div>

        <div class="card">
            <h2>&#x1F44B; Pozdrav</h2>
            <div class="greeting-big"><?php echo $greeting; ?>!</div>
        </div>

        <div class="card">
            <h2>&#x1F602; Vtip dne</h2>
            <div class="joke-text"><?php echo htmlspecialchars($randomJoke); ?></div>
        </div>

        <div class="card">
            <h2>&#x1F4CA; Počet návštěv</h2>
            <div class="counter-big"><?php echo number_format($visits); ?></div>
            <p class="counter-label">celkem návštěv této stránky</p>
        </div>

        <div class="card" style="grid-column: span 2">
            <h2>&#x2699;&#xFE0F; Informace o serveru</h2>
            <ul class="info-list">
                <li><strong>PHP:</strong> <?php echo $phpVersion; ?></li>
                <li><strong>Server:</strong> <?php echo htmlspecialchars($serverSoftware); ?></li>
                <li><strong>Váš prohlížeč:</strong> <?php echo htmlspecialchars(substr($userAgent, 0, 80)); ?>...</li>
                <li><strong>Vaše IP:</strong> <?php echo htmlspecialchars($userIP); ?></li>
                <li><strong>Náhodné číslo:</strong> <?php echo rand(1, 1000); ?></li>
            </ul>
        </div>
    </div>

    <button class="reload-btn" onclick="location.reload()">&#x1F504; Načíst znovu (nový vtip!)</button>

    <p class="php-badge">Generováno PHP na serveru &#x2022; <?php echo date("H:i:s"); ?></p>
</body>
</html>

← Zpět 7 / 10 Další krok →