Arkusz EE.09 : 2021 - czerwiec - zad. 02 (php)

Oznaczenie: EE.09-02-21.06-SG   Limit czasu: 150 minut

Zadanie egzaminacyjne

Wykonaj stronę prezentującą produkty w sklepie, wykorzystując pakiet XAMPP oraz edytor zaznaczający składnię oraz edytor grafiki rastrowej.

Aby wykonać zadanie, zaloguj się na konto Egzamin bez hasła. Na pulpicie znajduje się archiwum ZIP o nazwie warzywniak.zip zabezpieczone hasłem: #Warzywni@czeK

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! Aby strona działała poprawnie rozpakowane pliki muszą znaleźć się w tym samym folderze, co pliki strony. 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

Do wykonania operacji na bazie należy wykorzystać tabele produkty, producenci oraz rodzaje przedstawione na Obrazie 1.

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 dane2
• Do bazy dane2 zaimportuj plik dane.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 JPEG i nazwij egzamin. 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 dane2. 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 PNG i nadaj im nazwy kw1, kw2, kw3, kw4. Zrzuty powinny obejmować cały ekran monitora z widocznym paskiem zadań
  • Zapytanie 1: wybierające jedynie pola nazwa, ilosc, opis, cena, zdjecie z tabeli Produkty, dla produktów, których pole Rodzaje_id przyjmuje jedną z wartości: 1, 2
  • Zapytanie 2: wybierające jedynie nazwę produktu z tabeli Produkty i odpowiadającą mu nazwę producenta z tabeli Producenci dla produktów, dla których ilość jest mniejsza od 10 oraz pole Rodzaje_id przyjmuje wartość 1
  • Zapytanie 3: tworzące użytkownika anna z hasłem @nna23
  • Zapytanie 4: wstawiające wiersz do tabeli Produkty według specyfikacji:
    • klucz główny nadany automatycznie
    • Rodzaje_id – id wiersza z nazwą owoce w tabeli Rodzaje
    • Producenci_id – id wiersza z nazwą warzywa-rolnik w tabeli Producenci
    • pozostałe dane: nazwa: owoc1, ilość: 10, opis: puste pole, cena: 9,99, zdjecie: owoce.jpg

Witryna internetowa

Cechy grafiki:

• Plik arbuz.jpg, wypakowany z archiwum, należy skadrować do proporcji 3:2, a następnie przeskalować z zachowaniem proporcji do rozmiaru 300 px na 200 px

Pozostałe pliki graficzne są przygotowane i nie należy ich zmieniać.

Cechy witryny:

• Składa się ze strony o nazwie sklep.php
• Zastosowany właściwy standard kodowania polskich znaków
• Tytuł strony widoczny na karcie przeglądarki: „Warzywniak”
• Arkusz stylów w pliku o nazwie styl2.css prawidłowo połączony z kodem strony
• Podział strony na bloki: dwa bloki banera obok siebie, blok główny i stopka. W bloku głównym znajdują się bloki produktów generowane przez skrypt. Podział zrealizowany za pomocą znaczników sekcji tak, aby wygląd układu bloków strony po uruchomieniu w przeglądarce, był zgodny z Obrazem 2
• Zawartość banera lewego: nagłówek pierwszego stopnia o treści „Internetowy sklep z eko-warzywami”
• Zawartość banera prawego:
  • Lista numerowana (uporządkowana) z elementami: warzywa, owoce, soki
  • Element soki jest odnośnikiem prowadzącym do strony o adresie: https://terapiasokami.pl/, odnośnik otwiera się w osobnym oknie
• Zawartość bloku głównego: efekt działania skryptu 1
• Zawartość stopki:
  • Formularz wysyłający dane do tego samego pliku metodą POST z zawartością:
    • Pole edycyjne poprzedzone wpisem „Nazwa:”
    • Pole edycyjne poprzedzone wpisem „Cena:”
    • Przycisk „Dodaj produkt” wysyłający dane do skryptu 2
  • Napis o treści „Stronę wykonał: ”, dalej wstawiony numer PESEL zdającego lub w przypadku jego braku inny numer, którym został podpisany arkusz

Styl CSS witryny internetowej

Cechy formatowania CSS:

• Domyślne dla całej strony: krój czcionki Garamond
• Dla banera lewego: kolor tła #00600F, biały kolor czcionki, wyrównanie tekstu do środka, szerokość 75%, wysokość 90 px
• Dla banera prawego: kolor tła #00600F, biały kolor czcionki, szerokość 25%, wysokość 90 px
• Dla bloku głównego: kolor tła #C8E6C9, wysokość 600 px, paski przesuwania (scroll)
• Dla stopki: kolor tła #00600F, biały kolor czcionki
• Dla selektora nagłówka piątego stopnia: kolor tła #00600F, biały kolor czcionki, rozmiar czcionki 200%, wyrównanie tekstu do środka, marginesy zewnętrzne 0 px
• Dla selektora nagłówka drugiego stopnia: wyrównanie tekstu do prawej
• Dla bloku produktu generowanego przez skrypt 1: marginesy zewnętrzne 10 px, obramowanie linia ciągła 1 px w kolorze #00600F, szerokość 300 px

Skrypt

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

• Napisany w języku PHP
• Skrypt łączy się z serwerem bazy danych na localhost, użytkownik root bez hasła, baza danych o nazwie dane2
• Po wykonaniu operacji na bazie danych skrypt zamyka połączenie z serwerem
• Działanie skryptu 1
  • Wysyła do bazy zapytanie 1
  • Dla każdego zwróconego zapytaniem wiersza tworzy blok produktu, w którym znajdują się:
    • Obraz o nazwie pobranej z bazy danych i tekście alternatywnym „warzywniak”
    • Nagłówek piątego stopnia z nazwą pobraną z bazy
    • Paragraf (akapit) o treści „opis: <opis>”
    • Paragraf o treści „na stanie: <ilosc>”
    • Nagłówek drugiego stopnia o treści „<cena> zł”, gdzie pola umieszczone w nawiasach < > oznaczają dane pobrane z bazy danych
• Działanie skryptu 2
  • Jeśli wypełniono formularz, pobiera z niego dane
  • Wysyła zmodyfikowane zapytanie 4 do bazy danych. Dane nazwa i cena są pobrane z formularza, reszta danych zapytania 4 nie ulega zmianie

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 weryfikowałeś 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: arbuz.jpg, egzamin.jpg, gruszka.jpg, koper.jpg, kw1.png, kw2.png, kw3.png, kw4.png, kwerendy.txt, marchew.jpg, morela.jpg, owoce.jpg, papaja.jpg, papryka.jpg, przeglądarka.txt, sklep.php, styl2.css, ziemniak.jpg, ewentualnie inne przygotowane pliki.

Po nagraniu płyty sprawdź poprawność nagrania. 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.