Przejdź do głównej zawartości
Codex13

Generator losowego cytatu

Cel projektu

Dział zatytułowany „Cel projektu”

Stworzysz Generator losowego cytatu - aplikację wyświetlającą inspirujące cytaty z kolekcji zapisanej w pliku JSON. Użytkownik może losować nowe cytaty, filtrować je według autora i dodawać własne do bazy.

Czego się nauczysz?

  • Wczytywania danych z pliku JSON
  • Losowania elementów z tablicy (array_rand)
  • Filtrowania danych po autorze/kategorii
  • Dodawania nowych rekordów do kolekcji
  • Tworzenia atrakcyjnej prezentacji tekstu

Dlaczego to jest ważne?

Dział zatytułowany „Dlaczego to jest ważne?”

W prawdziwej pracy...

Losowanie treści jest podstawą wielu aplikacji - od “cytat dnia” w aplikacjach motywacyjnych, przez losowe rekomendacje produktów, po systemy A/B testów. Umiejętność pracy z losowością, filtrowaniem i dynamiczną prezentacją treści jest fundamentem dla każdego programisty tworzącego aplikacje contentowe i marketingowe.

Co ma robić aplikacja?

Dział zatytułowany „Co ma robić aplikacja?”

Funkcje podstawowe

Dział zatytułowany „Funkcje podstawowe”

  1. Przycisk losowania Użytkownik klika przycisk “Losuj cytat” i widzi losowo wybrany cytat z kolekcji wraz z autorem.

  2. Wyświetlenie cytatu Cytat jest prezentowany w czytelnej formie - treść w cudzysłowie, autor poniżej, stylizacja graficzna.

  3. Obsługa błędów Jeśli plik jest pusty lub nie istnieje, system wyświetla odpowiedni komunikat zamiast błędu.

  4. Baza cytatów Cytaty są przechowywane w pliku JSON z autorem i opcjonalnie kategorią.

Dane i ich struktura

Dział zatytułowany „Dane i ich struktura”

Przykładowa struktura pliku JSON:

{
  "quotes": [
    {
      "id": 1,
      "text": "Jedynym sposobem na świetną pracę jest kochanie tego, co robisz.",
      "author": "Steve Jobs",
      "category": "motywacja",
      "created_at": "2026-01-01"
    },
    {
      "id": 2,
      "text": "Wyobraźnia jest ważniejsza od wiedzy.",
      "author": "Albert Einstein",
      "category": "nauka",
      "created_at": "2026-01-01"
    },
    {
      "id": 3,
      "text": "Kod jest jak humor. Kiedy musisz go wyjaśniać, jest zły.",
      "author": "Cory House",
      "category": "programowanie",
      "created_at": "2026-01-01"
    },
    {
      "id": 4,
      "text": "Prostota jest szczytem wyrafinowania.",
      "author": "Leonardo da Vinci",
      "category": "design",
      "created_at": "2026-01-01"
    },
    {
      "id": 5,
      "text": "Najtrudniejszą rzeczą na świecie jest prostota.",
      "author": "Charlie Chaplin",
      "category": "życie",
      "created_at": "2026-01-01"
    }
  ]
}

Warianty realizacji

Dział zatytułowany „Warianty realizacji”

Wariant podstawowy

Dział zatytułowany „Wariant podstawowy”

Wymagane funkcje:

  • Przycisk “Losuj cytat”
  • Wczytanie cytatów z pliku JSON
  • Wyświetlenie losowego cytatu z autorem
  • Obsługa pustego pliku/błędu
  • Prosty, czytelny interfejs CSS

Przykładowy scenariusz:

Użytkownik wchodzi na stronę i klika “Losuj cytat”. Pojawia się: “Jedynym sposobem na świetną pracę jest kochanie tego, co robisz.” — Steve Jobs. Po kolejnym kliknięciu wyświetla się inny cytat.

Ocena: 3.0

Wskazówki implementacyjne

Dział zatytułowany „Wskazówki implementacyjne”

Przydatne fragmenty kodu

Dział zatytułowany „Przydatne fragmenty kodu”

Wczytywanie cytatów z pliku:

function loadQuotes(string $filePath): array {
    if (!file_exists($filePath)) {
        return [];
    }


    $content = file_get_contents($filePath);
    $data = json_decode($content, true);


    if (json_last_error() !== JSON_ERROR_NONE) {
        return [];
    }


    return $data['quotes'] ?? [];
}

Losowanie cytatu:

function getRandomQuote(array $quotes): ?array {
    if (empty($quotes)) {
        return null;
    }


    $randomIndex = array_rand($quotes);
    return $quotes[$randomIndex];
}


// Użycie
$quotes = loadQuotes('data/quotes.json');
$quote = getRandomQuote($quotes);


if ($quote) {
    echo "\"{$quote['text']}\" — {$quote['author']}";
} else {
    echo "Brak cytatów do wyświetlenia";
}

Filtrowanie po autorze:

function filterByAuthor(array $quotes, string $author): array {
    if (empty($author)) {
        return $quotes;
    }


    return array_filter($quotes, function($q) use ($author) {
        return $q['author'] === $author;
    });
}


function getUniqueAuthors(array $quotes): array {
    $authors = array_column($quotes, 'author');
    $unique = array_unique($authors);
    sort($unique);
    return $unique;
}


// Użycie
$authors = getUniqueAuthors($quotes);
// Wynik: ['Albert Einstein', 'Charlie Chaplin', 'Cory House', ...]

Filtrowanie po kategorii:

function filterByCategory(array $quotes, string $category): array {
    if (empty($category)) {
        return $quotes;
    }


    return array_filter($quotes, function($q) use ($category) {
        return ($q['category'] ?? '') === $category;
    });
}


function getUniqueCategories(array $quotes): array {
    $categories = array_column($quotes, 'category');
    $unique = array_unique(array_filter($categories));
    sort($unique);
    return $unique;
}

Dodawanie nowego cytatu:

function addQuote(array &$quotes, string $text, string $author, string $category = ''): int {
    $newId = empty($quotes) ? 1 : max(array_column($quotes, 'id')) + 1;


    $newQuote = [
        'id' => $newId,
        'text' => trim($text),
        'author' => trim($author),
        'category' => trim($category),
        'created_at' => date('Y-m-d'),
    ];


    $quotes[] = $newQuote;
    return $newId;
}


function saveQuotes(string $filePath, array $quotes): bool {
    $data = ['quotes' => array_values($quotes)];
    $json = json_encode($data, JSON_PRETTY_PRINT | JSON_UNESCAPED_UNICODE);
    return file_put_contents($filePath, $json) !== false;
}

JavaScript - kopiowanie do schowka:

function copyQuote(text, author) {
    const fullQuote = `"${text}" — ${author}`;


    navigator.clipboard.writeText(fullQuote).then(() => {
        showNotification('Skopiowano do schowka!');
    }).catch(err => {
        console.error('Błąd kopiowania:', err);
    });
}


function showNotification(message) {
    const notification = document.createElement('div');
    notification.className = 'notification';
    notification.textContent = message;
    document.body.appendChild(notification);


    setTimeout(() => notification.remove(), 2000);
}

Sprawdzanie duplikatów:

function isDuplicate(array $quotes, string $text): bool {
    $normalizedText = strtolower(trim($text));


    foreach ($quotes as $quote) {
        $existingText = strtolower(trim($quote['text']));
        // Porównanie z tolerancją (np. usuń interpunkcję)
        if (similar_text($normalizedText, $existingText) / strlen($normalizedText) > 0.9) {
            return true;
        }
    }


    return false;
}

Najczęstsze błędy

Dział zatytułowany „Najczęstsze błędy”

Zasoby

Dział zatytułowany „Zasoby”
PHP: array_rand() Losowanie indeksu z tablicy
PHP: json_decode() Parsowanie JSON
PHP: array_filter() Filtrowanie tablic
Clipboard API Kopiowanie do schowka w JS

Do dzieła!

Dział zatytułowany „Do dzieła!”

Wykorzystaj lekcje!

Cotygodniowe spotkania podczas lekcji to idealny moment, by:

  • Pokazać postępy - nawet małe kroki się liczą
  • Wyjaśnić wątpliwości - pytaj, nie zgaduj
  • Skonsultować rozwiązania - feedback pomoże Ci się rozwijać

Pracuj iteracyjnie - lepiej mieć działający wariant A niż niedokończony C!