TaskQuest

Dodatek

Szybki quiz – przypomnienie poprzedniej lekcji

1. Który opis jest algorytmem?

a) „Zrób coś z tymi liczbami, aż będzie dobrze.”
b) „Weź dwie liczby, dodaj je, wypisz wynik, zakończ.”
c) „Dodawaj liczby w nieskończoność.”

2. Ułóż etapy programowania we właściwej kolejności i wyjaśnij jednym zdaniem, dlaczego mówimy, że to proces cykliczny:

• analiza działania i rejestrowanie błędów
• edycja kodu źródłowego
• powrót do edycji kodu
• uruchomienie programu

3. „Analizuje kod źródłowy, a przeanalizowane fragmenty od razu wykonuje.” – kompilator czy interpreter?

4. Które zdanie o aplikacji internetowej jest prawdziwe?

a) Działa wyłącznie w przeglądarce i nie potrzebuje serwera.
b) Pracuje na serwerze, a użytkownik korzysta z niej przez przeglądarkę; pośredniczy serwer WWW.
c) To każdy plik HTML zapisany na dysku komputera.

5. Na wzór przykładu z lekcji zapisz w PHP zdanie: „Jeżeli liczba jest mniejsza od zera, to wypisz, że jest ujemna”.

6. Co jest nie tak z tym zapisem bloków instrukcji?

{ instrukcja_1; { instrukcja_2; instrukcja_3; }

Na zakończenie ostatniego tematu poprosiłam Cię o stworzenie „zeszytu elektronicznego”. W panelu lewym Twojego „zeszytu” dodaj link o treści: „PHP – pierwszy skrypt, echo, komentarze.”, który przeniesie Cię do podstrony o nazwie: „data_dziesiejszych_zajec.php” (oczywiście wpisz datę zajęć np. 280918.php).

Pliki projektu zapisuj w katalogu serwera WWW, np. C:\xampp\htdocs\NAZWA_PROJEKTU\ (Windows + XAMPP). Dzięki temu nie mieszasz plików z innymi ćwiczeniami i łatwo przenosisz projekt.

Uwaga: skrypty php muszą być zapisane w pliku z rozszerzeniem .php, NIE .html.

Uruchom XAMPP Control Panel i wystartuj Apache. MySQL uruchamiaj tylko wtedy, gdy dana lekcja faktycznie korzysta z bazy danych. Uruchom przeglądarkę internetową wpisując w pasku adresu: localhost.

Jesteś gotowy do pracy.

Składnia PHP

O składni języka PHP mówiliśmy na poprzedniej lekcji, ale w celu przypomnienia, aby skrypt PHP został prawidłowo zinterpretowany musi znajdować się pomiędzy standardowymi znacznikami:

<?php 
    // kod PHP

Zamykanie ?> na końcu pliku PHP jest opcjonalne i często się go nie stosuje (zmniejsza ryzyko przypadkowego wysłania białych znaków i problemów z nagłówkami).

Komentarze

Pamiętasz jak wygląda komentarz w HTML?

<!-- komentarz -->

Komentarze w języku PHP występują w 3 postaciach:

<?php
// komentarz liniowy
# działa jak komentarz liniowy, ale w praktyce w PHP najczęściej spotkasz //
/* komentarza blokowy
kolejna linia
i kolejna
i kolejna
aż do zamknięcia komentarza */
?>

Uwaga: nie wolno zagnieżdżać w sobie komentarzy blokowych!

Komentarze są bardzo przydatnym narzędziem i nie bój się z nich korzystać.

Mamy jeszcze komentarz dokumentacyjny, który musi zaczynać się od /** (otwarcie) i kończyć na */ (zamknięcie). Każda linia wewnątrz bloku powinna zaczynać się od gwiazdki (*).

<?php
/**
 * Krótki opis (podsumowanie) funkcji.
 *
 * Dłuższy opis funkcji, który może zawierać szczegóły
 * dotyczące implementacji lub działania.
 *
 * @param string $param1 Opis parametru pierwszego.
 * @param int    $param2 Opis parametru drugiego.
 * @return array         Opis zwracanej wartości.
 */
function przykladowaFunkcja($param1, $param2) {
    // ... kod
}
?>

• @param <typ> <zmienna> <opis>: Opisuje parametry funkcji/metody.
• @return <typ> <opis>: Opisuje zwracaną wartość.
• @var <typ>: Używany do definiowania typu zmiennych (np. właściwości klasy).
• @author: Autor kodu.
• @since: Wersja, od której element jest dostępny.
• @throws <typ> <opis>: Opisuje wyjątki, które mogą zostać wyrzucone.

Wyświetlanie tekstu w przeglądarce

Aby wyświetlić tekst w przeglądarce posługujemy się instrukcją echo

echo "Hello World!"; // wyświetli napis: Hello World! 

Alternatywnie możesz posłużyć się funkcją print

print "Hello World!"; // wyświetli napis: Hello World!  

Hmm… czy są identyczne?

echo i print służą do wypisywania tekstu.
– echo to konstrukcja językowa i nie zwraca wartości.
– print zachowuje się jak wyrażenie i zwraca `1`, więc teoretycznie można go użyć w wyrażeniach.
W praktyce w nowoczesnym PHP (7/8) różnice wydajności są pomijalne — używaj tego, co jest czytelniejsze (najczęściej `echo`).

ale co i jak jeszcze można wyświetlać:

echo "<br>"; //w ten sposób dodajemy wyświetlanie nowej linii w HTML
echo "Linia 1\nLinia 2"; //w samym tekście (np. do pliku, do konsoli, do logów) używa się znaku nowej linii \n

//wyświetlanie wielu linii
echo "Ten zapis obejmuje wiele linii, ale zostaną one wyświetlone w jednej linii, ponieważ sama instrukcja echo nie widzi w tym przypadku znaków nowej linii"; 

echo "<br>";
echo "<br>Ten zapis również obejmuje wiele linii.<br>
Będą one wyświetlane, w wielu liniach,<br>
przez dodanie znacznika nowego wiersza.";  

echo "<br>";
//alternatywna metoda wyświetlania. PHP umożliwia tworzenie wielowierszowych ciągów znaków za pomocą operatora <<<, czyli tzw. składni heredoc (here-document) umożliwiającej dosłowne wstawianie bloków tekstowych z zachowaniem miejsc łamania wierszy i innych białych znaków (w tym wcięć).Działa pod warunkiem, iż łańcuch rozpocznie się i zakończy tym samym słowem, w tym wypadku END. 
Heredoc jest użyteczny, gdy chcesz wstawić większy blok tekstu bez uciekania cudzysłowów.  
Uwaga: jeżeli wypisujesz tekst do przeglądarki, sam znak nowej linii w tekście nie zrobi „nowej linii” w HTML — do tego potrzebujesz np. `<br>` albo CSS (`white-space`).
echo <<<_END
Ten tekst może być wieloliniowy w edytorze.
Sprawdź czy zostanie tak wyświetlony w przeglądarce.
_END;

W PHP 8 masz też nowdoc (gdy nie chcesz interpretacji zmiennych):  
```php
$txt = <<<'END'
Tekst z $zmienna – tutaj NIE zostanie podstawiona.
END;
```

echo "<br>";

//wyświetlanie znaków specjalnych tj. "" musimy poprzedzić backslash'em
echo "Jeżeli chcemy wyświetlić cudzysłów \"Przykład\".";
/*
W łańcuchach w cudzysłowie `"` musisz uciekać znak `"` oraz możesz w nich używać sekwencji specjalnych (np. `\n`, `\t`).  
W apostrofach `'` nie ma interpretacji `\n` (poza `\'` i `\\`) i nie ma podstawiania zmiennych.
*/ 

echo "<br>"; 
 
echo "Znak dolara \$";
echo "<br>";
echo "\"Tekst ujęty w znaki cudzysłowia\"";
echo "<br>";

// Wyświetlanie zawartości zmiennych 
$zmienna1 = "wartość zmiennej 1"; 
$zmienna2 = "wartość zmiennej 2"; 
echo "zmienna1 = $zmienna1, a zmienna2 = $zmienna2"; // wyświetli: zmienna1 = wartość zmiennej 1, a zmienna2 = wartość zmiennej 2

echo "<br>"; 

// używając apostrofu wyświetlamy dokładnie to co znajduje się pomiędzy apostrofami (nie pobiera zawartości zmiennej)
echo 'wartość zmiennej 1 znajduje się w $zmienna1'; // wyświetli: wartość zmiennej 1 znajduje się w $zmienna1 

echo "<br>"; 

// jeżeli wyświetlamy samą zmienną nie musimy używać cudzysłowów, ani apostrofów 
echo $zmienna1; // wartość zmiennej 1

echo "<br>"; 

echo "Wartością zmiennej \$zmienna1 jest $zmienna1 <br>"; 

echo "<br>"; 
//łączenie wielu elementów do wyświetlenia
echo $zmienna1.$zmienna2."<br>"; // za pomocą kropki dołączamy kolejne zmienne 
echo $zmienna1,$zmienna2,"<br>"; // przecinek działa podobnie, tylko ma inne zachowanie (m.in. nie działa jak konkatenacja i ma inny priorytet) - stosujemy kropkę

// łączenie wielu elemetów - tekstu i zmiennych  
echo 'Można '.'łączyć '.'wiele '.'elementów '.' oraz dodawać zmienne '.$zmienna1.'<br>';

// wyświetlanie tablicowe
$tablica = ["indeks" => "wartość"];
echo "wartość dla indeksu = {$tablica['indeks']} !"; 
// wyświetli: wartość dla indeksu = wartość !

echo "<br>";

// wyświetlanie z warunkiem jeżeli (warunek) ? 'wartość gdy prawda' : 'wartość gdy fałsz'
$wiek = 18;
echo ($wiek >= 18) ? 'pełnoletni' : 'niepełnoletni';

Integracja PHP z HTML

Skrypty PHP możesz umieszczać w dowolnym miejscu kodu HTML, zarówno przed i za znacznikami jak i wewnątrz nich:

<!DOCTYPE html>
<html>
   <head>
   </head>
   <body>
      <section id="<?php dowolny skrypt ?>">
         <a href="<?php echo 'https://kamakaczmarek.net'; ?>">Materiały do nauki</a>
      </section>    
   </body>
</html>

Istnieją 2 szkoły integrowania PHP z HTML: pierwsza mówi o wyświetlaniu HTML za pomocą instrukcji echo, druga o rozdzieleniu HTML i PHP i umieszczaniu w kodzie HTML wielu skryptów objętych znacznikami <?php ?>. Ty decydujesz jakiej użyjesz. Ja jestem zwolenniczką 2 szkoły, ponieważ nie tracimy kolorowania składni HTML, a poza tym w testach jest odrobinę wydajniejsza ;P

<?php
   //wyświetlanie HTML w PHP  
   echo "<p>użycie HTML w PHP".$zmienna1."</p>";  
?>
<p>użycie PHP w HTML <?php echo $zmienna1; ?></p>
<p>użycie PHP w HTML w skróconej formie <?=$zmienna1;?></p>

Wszystkie kody zaprezentowane w tej lekcji powinny zostać zapisane w Twoim zeszycie, przetestuj ich działanie i za pomocą CSS „upiększ” ich wyświetlanie.

Zasady pisania kodu (dobre praktyki)

Dobrze napisany kod to taki, który jest czytelny, spójny, łatwy do rozbudowy i bezpieczny. Poniższe zasady warto stosować od pierwszych ćwiczeń.

1) Czytelne nazewnictwo (zmienne, funkcje, pliki)

• Używaj nazw, które mówią co przechowują / co robią, np. $cenaNetto, $liczbaPunktow, obliczSume().
• Unikaj skrótów typu $a, $x, $tmp (chyba że w bardzo krótkim fragmencie i ma to sens).
• Stosuj jeden styl zapisu, np. camelCase w PHP:
  • zmienne i funkcje: $nazwaUcznia, policzSrednia()
  • klasy: NazwaKlasy
• Nazwy nie powinny być za długie, ale muszą być jednoznaczne.

2) Jeden język w kodzie

• Trzymaj się konsekwentnie jednego języka nazw w projekcie.
• Najczęściej spotkasz angielski (np. $userName, $totalPrice), ale jeśli w klasie/zeszycie ustalacie polski — używaj polskiego wszędzie.
• Nie mieszaj: np. nie rób $userImie albo $cenaTotal.

3) Wcięcia, spacje i estetyka

• Stosuj wcięcia (indentację) w blokach { } — kod ma „wyglądać jak drzewko”.
• Daj spacje po przecinkach i wokół operatorów:
  • dobrze: $a = $b + 2;
  • źle: $a=$b+2;
• Jedna instrukcja na linię — unikaj „ściany kodu”.
• Zostaw puste linie między logicznymi częściami programu (np. deklaracje zmiennych, obliczenia, wyświetlanie wyniku).

4) Komentarze – po co i jak

• Komentarze mają tłumaczyć dlaczego coś robisz, a nie przepisywać oczywistości.
• Dobre komentarze opisują zamiar, np. „Walidacja danych z formularza”, „Zabezpieczenie przed pustym parametrem”.

5) Unikaj powtórzeń (DRY)

• Jeśli ten sam fragment kodu powtarza się 3+ razy, to znak, że warto zrobić:
  • funkcję, np. formatujDate()
  • lub osobny plik/klasę (w większym projekcie)

6) Prosta struktura i podział na elementy

• Mieszanie wszystkiego w jednym miejscu utrudnia pracę.
• Staraj się rozdzielać:
  • pobieranie danych (np. z formularza)
  • przetwarzanie (logika)
  • wyświetlanie (HTML)

7) Przewidywalność i bezpieczeństwo danych

• Nie ufaj danym z zewnątrz (formularze, URL) — sprawdzaj je (walidacja).
• Przy wyświetlaniu tekstu w HTML stosuj escapowanie (ochrona przed XSS), np. htmlspecialchars(...).
• Ustal, co ma się stać w przypadku błędu (np. brak danych, zły format) i obsłuż to w kodzie.

8) Stała konsekwencja

Najważniejsza zasada: konsekwencja. Jeśli w projekcie ustalisz:

• styl nazw,
• wcięcia,
• sposób formatowania, to trzymaj się tego w całym kodzie. Dzięki temu kod jest czytelny nie tylko dla Ciebie, ale też dla innych.

TaskQuest — Twój projekt na cały semestr

<?php
// Nazwa aplikacji — na razie na sztywno
echo "<h1>TaskQuest</h1>";
/* Krótki opis aplikacji wyświetlany na stronie głównej */
echo "<p>Zdobywaj punkty za wykonane zadania!</p>";
?>

PODSUMOWANIE LEKCJI

W skrócie

• PHP wykonuje się na serwerze. Przeglądarka dostaje tylko wynik (HTML), nigdy kod PHP. Dlatego plik musi mieć rozszerzenie .php, leżeć w katalogu serwera (htdocs) i być otwierany przez http://localhost/... przy uruchomionym Apache – nie dwuklikiem z dysku.
• Kod PHP piszemy między <?php a ?>. Każda instrukcja kończy się średnikiem ;. Zamknięcie ?> można pominąć tylko wtedy, gdy za kodem PHP nie ma już HTML.
• Komentarze: // i # – do końca linii, /* */ – blokowy (nie wolno ich zagnieżdżać), /** */ – dokumentacyjny z tagami @param, @return. Dobry komentarz mówi dlaczego, a nie powtarza, co widać w kodzie.
• echo i print wypisują tekst. W praktyce używamy echo. echo przyjmuje kilka argumentów po przecinku, print – tylko jeden (i zwraca 1).
• Nowa linia: w przeglądarce działa <br> (lub CSS). Znak \n robi nową linię tylko w źródle strony / w tekście.
• Cudzysłów a apostrof:
  • "..." – podstawia wartości zmiennych i rozumie sekwencje \n, \t, \", \$,
  • '...' – wypisuje tekst dosłownie (wyjątki: \' i \\).
• Łączenie (konkatenacja) tekstów i zmiennych – kropką ..
• Element tablicy wewnątrz "..." zapisujemy w klamrach: "{$tablica['indeks']}".
• HTML generowany przez echo: cudzysłowy atrybutów muszą być inne niż te, które otaczają cały tekst, albo poprzedzone \. To najczęstsze źródło błędów składni.
• PHP w HTML: <?= $zmienna1 ?> to skrót od <?php echo $zmienna1; ?>.
• Kod piszemy w edytorze kodu, nie w Wordzie – „ładne” cudzysłowy „ ” nie są dla PHP cudzysłowami.

Co trzeba umieć na INF.03?

• uruchomić Apache w XAMPP, zapisać plik .php w htdocs i otworzyć go przez localhost,
• wstawić blok PHP w wybrane miejsce strony HTML (np. do <aside>, <section>, <footer>),
• napisać echo, które wygeneruje poprawny znacznik HTML z atrybutem, np. <a href="index.php">...</a>,
• połączyć tekst i zmienną – kropką lub przez podstawienie w "...",
• rozpoznać i poprawić błąd składni spowodowany cudzysłowami lub brakującym średnikiem,
• dodać komentarz jednoliniowy i blokowy,
• nadawać zmiennym nazwy mówiące, co przechowują.

Minimum, które powinno wejść w pamięć

1. Plik .php + katalog htdocs + uruchomiony Apache + adres http://localhost/....
2. Kod PHP między <?php a ?>, każda instrukcja kończy się ;.
3. Nowa linia w przeglądarce to <br>, nie \n.
4. "..." podstawia zmienne, '...' wypisuje dosłownie.
5. Łączymy kropką: "Witaj " . $imie.
6. HTML w echo: w środku inne cudzysłowy niż na zewnątrz albo \".
7. Komentarze: // oraz /* */ – bloków nie zagnieżdżamy.
8. <?= $x ?> = <?php echo $x; ?>.

Ściągawka – najważniejsze polecenia i składnia

<?php
// komentarz jednoliniowy
# też komentarz jednoliniowy
/* komentarz
   blokowy */

echo "Tekst";                     // wypisanie tekstu
echo "Linia 1<br>Linia 2";        // nowa linia w przeglądarce
echo "Imię: $imie";               // podstawienie zmiennej
echo 'Imię: $imie';               // dosłownie: Imię: $imie
echo "Imię: " . $imie . "<br>";   // konkatenacja kropką
echo "Cudzysłów: \"tekst\"";      // \" – cudzysłów w "..."
echo "Znak dolara: \$";           // \$ – dolar zamiast zmiennej
echo "Wartość: {$tab['klucz']}";  // element tablicy w "..."
?>

HTML z atrybutem w echo – trzy poprawne sposoby:

echo '<a href="index.php">Start</a>';
echo "<a href='index.php'>Start</a>";
echo "<a href=\"index.php\">Start</a>";

PHP wewnątrz HTML:

<p><?php echo $imie; ?></p>
<p><?= $imie ?></p>

Quiz – sprawdź się

1. Co zostanie wyświetlone w przeglądarce?

$imie = "Ola";
echo "Cześć $imie!<br>";
echo 'Cześć $imie!';

2. Co zobaczysz w przeglądarce, a co w źródle strony (Ctrl+U)?

echo "Linia 1\nLinia 2";

3. Dlaczego ten kod powoduje błąd? Podaj dwie poprawione wersje.

echo "<a href="index.php">Start</a>";

4. Uczeń skopiował kod z dokumentu tekstowego i dostał błąd. Dlaczego?

echo „TaskQuest”;

5. Co się stanie po uruchomieniu tego pliku?

<?php
/* Sekcja nagłówka
   /* stary kod */
   echo "<h1>TaskQuest</h1>";
*/

6. Uzupełnij jedną instrukcję echo w cudzysłowach "..." tak, aby dla $imie = "Ola"; wyświetliła dokładnie:

Zmienna $imie ma wartość Ola

7. Mamy $uczen = ["imie" => "Ola"];. Która wersja poprawnie wyświetli Imię: Ola?

a) echo "Imię: $uczen['imie']";
b) echo "Imię: {$uczen['imie']}";
c) echo 'Imię: {$uczen['imie']}';

8. Który zapis zadziała, a który spowoduje błąd? Dlaczego?

echo "A", "B";
print "A", "B";

9. Plik zapisano jako index.html i otwarto przez localhost. W środku jest <?php echo "TaskQuest"; ?>. Co zobaczysz w przeglądarce i jak to naprawić?

10. Zapisz krócej, tak aby działało tak samo:

<footer><?php echo $autor; ?></footer>

11. Który komentarz jest bardziej wartościowy i dlaczego?

a) // wyświetlam h1
b) // Nazwa aplikacji na sztywno – w kolejnych lekcjach zastąpimy ją zmienną

12. W jakiej sytuacji nie możesz pominąć znacznika ?>?

13. (zadanie w stylu egzaminacyjnym) Masz zmienne:

$plik = "index.php";
$nazwa = "TaskQuest";

Jedną instrukcją echo wygeneruj odnośnik: <a href="index.php">TaskQuest</a>. Wartości weź ze zmiennych, nie wpisuj ich ręcznie.