Arkusz EE.09 : 2022 - styczeń - zad. 01 (php)

Oznaczenie: EE.09-01-22.01-SG   Limit czasu: 150 minut

Zadanie egzaminacyjne

Wykonaj aplikację internetową portalu kart wędkarskich wykorzystując pakiet XAMPP oraz edytor zaznaczający składnię.

Aby wykonać zadanie, zaloguj się na konto Egzamin bez hasła. Na pulpicie znajdziesz archiwum ZIP o nazwie wedkarstwo.zip zabezpieczone hasłem: K@RTY*

Archiwum należy rozpakować.

Pobierz wedkarstwo.zip

Należy utworzyć folder o nazwie odpowiadającej numerowi PESEL zdającego lub w przypadku jego braku innemu numerowi, którym został podpisany arkusz. Archiwum należy rozpakować do tego folderu.

Ważne! Wszystkie wykonane w czasie egzaminu pliki w tym zrzuty ekranu, pliki strony, stylów należy umieścić w tym folderze.

Operacje na bazie danych

Baza danych jest zgodna ze strukturą przedstawioną na Obrazie 1. Tabela Zawody_wedkarskie jest połączona relacją z tabelą Lowisko (opisuje łowisko, gdzie będą się odbywać zawody) oraz tabelą Karty_wedkarskie (opisuje wędkarza, który wygrał zawody). Tabela Lowisko zawiera pole rodzaj, którego wartości oznaczają: 1 – morze, 2 – jezioro, 3 – rzeka, 4 – zalew, 5 – staw.

Obraz 1. Baza danych

Uruchom usługi MySQL i Apache za pomocą XAMPP Control Panel. Za pomocą narzędzia phpMyAdmin wykonaj podane operacje na bazie danych:

  • Utwórz bazę danych o nazwie wedkowanie
  • Do bazy wedkowanie zaimportuj tabele z pliku baza.sql z rozpakowanego archiwum
  • Wykonaj zrzut ekranu po imporcie. Zrzut zapisz w folderze z numerem PESEL, lub w przypadku jego braku w folderze z innym numerem, którym został podpisany arkusz, w formacie PNG i nazwij import. Nie kadruj zrzutu. Powinien on obejmować cały ekran monitora, z widocznym paskiem zadań. Na zrzucie powinny być widoczne elementy wskazujące na poprawnie wykonany import tabel
  • Zapisz i wykonaj zapytania SQL działające na bazie wedkowanie. Zapytania zapisz w pliku kwerendy.txt, w folderze z numerem PESEL lub w przypadku jego braku w folderze z innym numerem, którym został podpisany arkusz. Wykonaj zrzuty ekranu przedstawiające wyniki działania kwerend. Zrzuty zapisz w formacie JPEG i nadaj im nazwy kw1, kw2, kw3, kw4. Zrzuty powinny obejmować cały ekran monitora z widocznym paskiem zadań.
    • Zapytanie 1: dodające rekord do tabeli Karty_wedkarskie dla Grzegorza Niemczyka, zamieszkałego pod adresem „Gdynia, Batorego 14/5”, z datą „2018-02-23”; wartość punktów: 0. Baza powinna sama nadać wartość pola id dla tabeli
    • Zapytanie 2: wybierające jedynie pola imie i nazwisko z tabeli Karty_wedkarskie dla wędkarzy, dla których liczba punktów jest większa niż 20
    • Zapytanie 3: wybierające jedynie pole akwen z tabeli Lowisko dla łowisk, gdzie sędzią zawodów jest Krzysztof Dobrowolski, należy użyć relacji
    • Zapytanie 4: tworzące użytkownika anna na localhost z hasłem anna123

Witryna internetowa

Obraz 2. Witryna internetowa

Przygotowanie grafiki:

  • Plik wedka.jpg, wypakowany z archiwum, należy przeskalować z zachowaniem proporcji tak, aby jego wysokość wynosiła dokładnie 220 px

Cechy witryny:

  • Składa się ze strony o nazwie karta.html oraz skryptu zapisz.php. Poniższe wymagania dotyczą tylko pliku karta.html
  • Zastosowany właściwy standard kodowania polskich znaków
  • Tytuł strony widoczny na karcie przeglądarki: „Karty wędkarskie”
  • Arkusz stylów w pliku o nazwie styl_1.css prawidłowo połączony z kodem strony
  • Podział strony na bloki: na górze blok banera, poniżej blok główny, na dole trzy bloki: lewy, środkowy i prawy. Podział zrealizowany za pomocą znaczników sekcji tak, aby po uruchomieniu w przeglądarce wygląd układu bloków był zgodny z Obrazem 2
  • Zawartość bloku banera: nagłówek drugiego stopnia o treści „Zgłoszenie na kartę wędkarską”
  • Zawartość bloku głównego:
    • Nagłówek czwartego stopnia o treści: „Formularz - karta wędkarska”
    • Formularz wysyłający dane metodą POST do pliku zapisz.php zawierający pola
      • Pole edycyjne podpisane powyżej tekstem: „imię: ”
      • Pole edycyjne podpisane powyżej tekstem: „nazwisko: ”
      • Pole edycyjne podpisane powyżej tekstem: „adres: ”; pole ma rozmiar 30
      • Przycisk czyszczący zawartość formularza z etykietą „CZYŚĆ”
      • Przycisk wysyłający zawartość formularza z etykietą „ZAPISZ”
  • Zawartość bloku lewego:
    • Nagłówek czwartego stopnia o treści: „Typy łowisk”
    • Lista punktowana (nieuporządkowana) zawierająca elementy: Zalewy, Stawy, Jeziora, Rzeki
  • Zawartość bloku środkowego: obraz wedka.jpg z tekstem alternatywnym o treści: „karta wędkarska”
  • Zawartość bloku prawego:
    • Akapit (paragraf) o treści: „Stronę przygotował: ”, dalej wstawiony numer PESEL zdającego lub w przypadku jego braku inny numer, którym został podpisany arkusz
    • Odnośnik do strony „http://www.kartawedkarska.pl/” o treści: „Karta wędkarska”

Styl CSS witryny internetowej

Cechy formatowania CSS:

  • Są zawarte wyłącznie w zewnętrznym arkuszu stylów
  • Domyślne dla całej strony: krój czcionki Georgia
  • Dla bloku banera: kolor tła DodgerBlue, biały kolor czcionki, marginesy wewnętrzne 10 px, wyrównanie tekstu do środka
  • Dla bloku głównego: kolor tła LightBlue, marginesy wewnętrzne 100 px
  • Dla bloku lewego: kolor tła DodgerBlue, biały kolor czcionki, szerokość 20%, wysokość 220 px
  • Wspólne dla bloku środkowego i bloku prawego: kolor tła DodgerBlue, biały kolor czcionki, szerokość 40%, wysokość 220 px, wyrównanie tekstu do środka
  • Dla znacznika odnośnika: obramowanie linią kreskowaną o szerokości 1 px i kolorze DimGray, kolor tła Gold, kolor czcionki DarkRed, marginesy wewnętrzne 10 px

Skrypt połączenia z bazą

W Tabeli 1 podano wybór funkcji PHP do obsługi bazy danych. Wymagania dotyczące skryptu:

  • Napisany w języku PHP, w pliku zapisz.php
  • Skrypt działa na danych przesłanych z formularza
  • Skrypt łączy się z serwerem bazodanowym na localhost, użytkownik root bez hasła, baza danych o nazwie wedkowanie
  • Skrypt wysyła do bazy danych zmodyfikowane zapytanie 1, które w polach data_zezwolenia i punkty zawiera wartość NULL, pozostałe wartości wypełnione są danymi z formularza
  • Na końcu działania skrypt zamyka połączenie z serwerem

Tabela 1. Wybór funkcji języka PHP do obsługi bazy MySQL i MariaDB

Funkcje bilioteki mysqli Zwracana wartość
mysqli_connect(serwer, uzytkownik, haslo, nazwa_bazy) id połączenia lub FALSE, gdy niepowodzenie
mysqli_select_db(id_polaczenia, nazwa_bazy) TRUE / FALSE, w zależności od stanu operacji
mysqli_error(id_polaczenia) Tekst komunikatu błędu
mysqli_close(id_polaczenia) TRUE / FALSE, w zależności od stanu operacji
mysqli_query(id_polaczenia, zapytanie) Wynik zapytania
mysqli_fetch_row(wynik_zapytania) Tablica numeryczna odpowiadająca wierszowi zapytania
mysqli_fetch_array(wynik_zapytania) Tablica zawierająca kolejny wiersz z podanych w wyniku zapytania lub FALSE, jeżeli nie ma więcej wierszy w wyniku zapytania
mysqli_num_rows(wynik_zapytania) Liczba wierszy w podanym zapytaniu
mysqli_num_fields (wynik_zapytania) Liczba kolumn w podanym zapytaniu
UWAGA!
Po zakończeniu pracy utwórz w folderze z numerem PESEL lub w przypadku jego braku w folderze z innym numerem, którym został podpisany arkusz plik tekstowy o nazwie przeglądarka.txt. Zapisz w nim nazwę przeglądarki internetowej, w której weryfikowano poprawność działania witryny.
Nagraj płytę z rezultatami pracy. W folderze z numerem PESEL lub w przypadku jego braku w folderze z innym numerem, którym został podpisany arkusz powinny się znajdować pliki: import.png, karta.html, kw1.jpg, kw2.jpg, kw3.jpg, kw4.jpg, kwerendy.txt, przeglądarka.txt, styl_1.css, wedka.jpg, zapisz.php, ewentualnie inne przygotowane pliki.
Po nagraniu płyty sprawdź poprawność jej odczytu w obecności przewodniczącego zespołu nadzorującego, na specjalnie przygotowanym do tego celu stanowisku. Opisz płytę swoim numerem PESEL lub w przypadku jego braku innym numerem, którym został podpisany arkusz i pozostaw na stanowisku, zapakowaną w pudełku wraz z arkuszem egzaminacyjnym.

Czas przeznaczony na wykonanie zadania wynosi 150 minut.

Ocenie będzie podlegać 5 rezultatów:

  • operacje na bazie danych
  • zawartość witryny internetowej
  • działanie witryny internetowej
  • styl CSS witryny internetowej
  • skrypt.