Plik HTML można otworzyć bezpośrednio w przeglądarce. Z PHP pracujemy inaczej: kod wykonuje interpreter, a serwer przekazuje przeglądarce wynik. Podczas tej lekcji uruchomisz lokalny projekt, wyświetlisz nazwę koła zainteresowań i obliczysz czas jego spotkań.
Scenariusz zajmuje 45 minut przy wcześniej zainstalowanym PHP 8.x. Zakłada znajomość podstaw HTML. Obejmuje uruchamianie projektu, echo, zmienne i proste obliczenia. Formularze oraz bazy danych będą kolejnym etapem.
Przygotowanie środowiska
Na komputerze powinny działać PHP 8.x, edytor tekstu i przeglądarka. W terminalu sprawdź wersję poleceniem php -v. Jeśli polecenie nie jest rozpoznawane, nauczyciel powinien skonfigurować ścieżkę do interpretera albo użyć jego pełnego adresu. W typowej instalacji XAMPP w Windows może to być C:\xampp\php\php.exe, ale trzeba sprawdzić rzeczywisty folder.
Rozpakuj pakiet z artykułu. Otwórz terminal w folderze start, który zawiera index.php. Uruchom:
php -S 127.0.0.1:8000
Pozostaw terminal otwarty. W przeglądarce wpisz http://127.0.0.1:8000/. Jeżeli port jest zajęty, wybierz np. 8001 zarówno w poleceniu, jak i w adresie. Serwer zatrzymasz przez Ctrl+C w jego terminalu.
Wbudowany serwer PHP służy tu do lokalnego ćwiczenia. Nie jest serwerem do publikowania aplikacji dla użytkowników. W tym wariancie nie uruchamiamy dodatkowo Apache ani MySQL. Instalację środowiska wykonaj przed zajęciami — plan 45 minut jej nie obejmuje.
Cele i podział czasu
Uczeń powinien umieć uruchomić stronę przez lokalny serwer, rozpoznać fragment PHP, użyć zmiennych do obliczenia oraz porównać plik źródłowy z odpowiedzią widoczną w przeglądarce.
| Czas | Działanie |
|---|---|
| 0–8 min | Uruchomienie przygotowanego projektu |
| 8–16 min | Pierwszy komunikat echo i źródło odpowiedzi |
| 16–25 min | Zmienne i obliczenie czasu spotkań |
| 25–38 min | Trzy zadania samodzielne |
| 38–45 min | Testy i omówienie błędów |
Pierwszy wynik PHP
W pliku index.php możesz umieścić zarówno HTML, jak i fragmenty PHP. Najprostszy przykład to:
<?php
echo "Witaj w kole odkrywców!";
?>
Po wejściu przez lokalny adres zobaczysz komunikat. <?php rozpoczyna kod PHP, echo wysyła tekst do odpowiedzi, a średnik kończy instrukcję. Zamykający znacznik jest potrzebny, gdy po nim wracamy do HTML. W plikach zawierających wyłącznie PHP zwykle pomija się końcowe ?>.
Użyj w przeglądarce opcji „Wyświetl źródło strony”. Przy poprawnym wykonaniu zobaczysz wygenerowany tekst i HTML, a nie instrukcję echo. Kod źródłowy PHP pozostaje po stronie serwera. W tym ćwiczeniu serwer działa na tym samym komputerze, ale nadal ma inne zadanie niż przeglądarka.
Zmienne i obliczenia
Nazwy zmiennych PHP zaczynają się od znaku $. Wielkość liter ma znaczenie: $nazwa i $Nazwa to różne zmienne. Przygotuj dane przed wysłaniem treści strony:
<?php
$nazwa = "Odkrywcy";
$spotkania = 4;
$minuty = 45;
$razem = $spotkania * $minuty;
?>
Oczekiwany wynik obliczenia to 180. Liczby zapisujemy bez cudzysłowów, a * oznacza mnożenie. Następnie w HTML dodaj:
<p>Czas zajęć: <?php echo $razem; ?> minut.</p>
PHP wykona obliczenie przy obsłudze żądania. Po zmianie liczby spotkań w pliku zapisz go i odśwież stronę, żeby wykonać kod ponownie.
Nazwę wyświetlimy przez htmlspecialchars, żeby znaki takie jak < i & były traktowane jako tekst:
<h1><?php echo htmlspecialchars($nazwa, ENT_QUOTES, 'UTF-8'); ?></h1>
W tym projekcie nazwa jest stała, wpisana przez autora. Pokazujemy od razu sposób odpowiedni do wstawiania tekstu w treść HTML. To nie jest uniwersalne zabezpieczenie zapytań SQL ani danych w JavaScript — różne miejsca użycia mają własne zasady.
Trzy zadania
Zadanie 1. Nazwa grupy. Zmień $nazwa na „Twórcy aplikacji”. Wyświetl ją w nagłówku przez htmlspecialchars. Sprawdź efekt w przeglądarce.
Zadanie 2. Nowy plan. Ustaw pięć spotkań po 30 minut. Pokaż wynik obliczenia w akapicie z jednostką. Oczekiwany czas wynosi 150 minut.
Zadanie 3. Przygotowanie cyklu. Dodaj jednorazowo 15 minut przygotowania. Zapisz wynik w osobnej zmiennej i wyświetl drugi akapit: „Czas z przygotowaniem: 165 minut”.
Dla chętnych: wpisz jako nazwę Koło <HTML> & PHP. Sprawdź, czy nawiasy i ampersand są widoczne jako tekst. Następnie obejrzyj źródło odpowiedzi i znajdź zapis < oraz &.
Pełne rozwiązanie
<?php
$nazwa = "Twórcy aplikacji";
$spotkania = 5;
$minuty = 30;
$przygotowanie = 15;
$razem = $spotkania * $minuty;
$zPrzygotowaniem = $razem + $przygotowanie;
?>
<!doctype html>
<html lang="pl">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Plan spotkań</title>
</head>
<body>
<h1><?php echo htmlspecialchars($nazwa, ENT_QUOTES, 'UTF-8'); ?></h1>
<p>Czas zajęć: <?php echo $razem; ?> minut.</p>
<p>Czas z przygotowaniem: <?php echo $zPrzygotowaniem; ?> minut.</p>
</body>
</html>
W pakiecie rozwiązanie znajduje się w osobnym folderze. Aby je uruchomić, zatrzymaj serwer, przejdź do folderu rozwiazanie i uruchom to samo polecenie ponownie. Nie porównuj pliku edytowanego w jednym folderze ze stroną serwowaną z drugiego.
Sprawdź również dwa spotkania po 60 minut: z przygotowaniem powinno wyjść 135. Dla jednego spotkania po 45 minut wynik końcowy wynosi 60. Taki test pozwala zauważyć, czy przygotowanie dodano raz, zgodnie z poleceniem.
Gdy projekt się nie uruchamia
| Objaw | Co sprawdzić |
|---|---|
| Adres zaczyna się od file:// | Otwórz stronę przez http://127.0.0.1:8000/. |
| Nie można nawiązać połączenia | Czy lokalny serwer działa i używasz właściwego portu? |
| Serwer pokazuje 404 | Czy uruchomiono go w folderze z index.php? |
| Parse error | Sprawdź średniki, cudzysłowy i wskazany wiersz. |
| Undefined variable | Porównaj nazwę zmiennej i jej wielkość liter. |
| Przeglądarka pokazuje kod PHP | Nie wykonuje go interpreter; sprawdź sposób uruchomienia serwera. |
Komunikaty diagnostyczne odczytuj także w terminalu serwera. Nie zamykaj tego okna, dopóki chcesz korzystać ze strony.
Pytania kontrolne i ocena
- Kto wykonuje PHP w tym ćwiczeniu? Interpreter po stronie lokalnego serwera.
- Czy przeglądarka musi dostać instrukcję echo? Nie, otrzymuje jej wynik.
- Po co użyto htmlspecialchars? Żeby bezpiecznie wstawić nazwę jako tekst w HTML.
Punktacja: uruchomienie przez serwer — 2 pkt; nazwa i jej poprawne wyświetlenie — 2 pkt; obliczenie czasu — 2 pkt; dodanie przygotowania — 2 pkt; drugi zestaw danych — 1 pkt; wyjaśnienie różnicy między kodem a wynikiem — 1 pkt. Razem 10 punktów.
Pobierz projekt PHP
Pliki PHP są w archiwum do uruchomienia we własnym środowisku. Karta pracy nie zawiera klucza; publiczne rozwiązanie służy nauce i porównywaniu wyników.
Co dalej po pierwszym programie?
Kolejne lekcje mogą dotyczyć warunków, pętli i funkcji. Dopiero później warto dołączyć formularze i pracę z bazą danych. Kurs PHP TablicaPro porządkuje materiał do prowadzenia zajęć z klasą.
Uruchamianie pierwszej strony opisuje oficjalny poradnik PHP, a zakres zastosowania lokalnego serwera — dokumentacja serwera wbudowanego. Porównaj tę lekcję z JavaScript działającym w przeglądarce.
Poprowadź kolejne lekcje PHP
Pełny kurs: prezentacje, ćwiczenia i testy do pracy z klasą.
Kup dostęp do kursu PHP →