STRONA TYPU ONE PAGE

<!DOCTYPE html>
<html lang="pl">
<head>
  <meta charset="UTF-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  <title>Nowoczesna Strona Szkoleniowa - Bazy Danych & SQL</title>
  <style>
    :root {
      --primary: #2563eb;
      --secondary: #1e40af;
      --light: #f8fafc;
      --dark: #0f172a;
    }
    * {
      margin: 0;
      padding: 0;
      box-sizing: border-box;
      font-family: 'Segoe UI', Tahoma, sans-serif;
    }
    body {
      background: var(--light);
      color: var(--dark);
      line-height: 1.6;
    }
    header {
      background: linear-gradient(135deg, var(--primary), var(--secondary));
      color: white;
      padding: 70px 20px;
      text-align: center;
      border-bottom-left-radius: 40px;
      border-bottom-right-radius: 40px;
      box-shadow: 0 8px 20px rgba(0,0,0,0.15);
    }
    header h1 {
      font-size: 2.8rem;
    }
    nav {
      background: white;
      display: flex;
      justify-content: center;
      gap: 30px;
      padding: 15px;
      position: sticky;
      top: 0;
      z-index: 1000;
      box-shadow: 0 2px 8px rgba(0,0,0,0.08);
    }
    nav a {
      text-decoration: none;
      font-weight: 600;
      color: var(--primary);
      transition: 1s;
    }
    nav a:hover {
      color: var(--secondary);
    }
    section {
      padding: 70px 20px;
      max-width: 1000px;
      margin: auto;
    }
    .block {
      background: white;
      padding: 40px;
      border-radius: 20px;
      margin-bottom: 50px;
      box-shadow: 0 4px 12px rgba(0,0,0,0.1);
      animation: fadeIn 1s ease;
    }
    h2 {
      color: var(--primary);
      margin-bottom: 15px;
      font-size: 1.9rem;
    }
    footer {
      background: var(--dark);
      color: white;
      text-align: center;
      padding: 30px;
      margin-top: 30px;
    }
    @keyframes fadeIn {
      from { opacity: 0; transform: translateY(40px); }
      to { opacity: 1; transform: translateY(0); }
    }
  </style>
</head>
<body>
  <header>
    <h1>Szkolenie z Baz Danych i SQL</h1>
    <p>Nowoczesny przewodnik dla uczniów technikum TEB</p>
  </header>

  <nav>
    <a href="#o_kursie">O kursie</a>
    <a href="#bazy">Podstawy baz danych</a>
    <a href="#sql">SQL w praktyce</a>
    <a href="#zadania">Zadania</a>
    <a href="#kontakt">Kontakt</a>
  </nav>

  <section id="o_kursie" class="block">
    <h2>O kursie</h2>
    <p>Ten kurs został stworzony, aby wprowadzić uczniów technikum w świat baz danych i języka SQL. Jest on fundamentem dla większości zawodów IT — od programistów, przez analityków danych, aż po administratorów systemów.</p>
    <p>W ramach kursu poznasz:</p>
    <ul>
      <li>jak działają relacyjne bazy danych,</li>
      <li>jak planować strukturę danych,</li>
      <li>jak pisać zapytania SQL na poziomie początkującym i średniozaawansowanym,</li>
      <li>jak analizować dane i wyciągać wnioski.</li>
    </ul>
  </section>

  <section id="bazy" class="block">
    <h2>Podstawy relacyjnych baz danych</h2>
    <p>Relacyjne bazy danych to systemy, w których dane przechowywane są w tabelach. Każda tabela składa się z:</p>
    <ul>
      <li><strong>kolumn</strong> — opisujących typ danych (np. imię, nazwisko, wiek),</li>
      <li><strong>wierszy</strong> — pojedynczych rekordów danych.</li>
    </ul>
    <p>Najważniejsze pojęcia:</p>
    <ul>
      <li><strong>Primary Key (Klucz główny)</strong> — unikalny identyfikator rekordu.</li>
      <li><strong>Foreign Key (Klucz obcy)</strong> — połączenie między tabelami.</li>
      <li><strong>Normalizacja danych</strong> — proces eliminacji duplikacji danych.</li>
      <li><strong>Relacje</strong>: 1:1, 1:N, N:M.</li>
    </ul>
    <p>Najpopularniejsze systemy baz danych to: MySQL, PostgreSQL, SQL Server oraz Oracle. W szkolnych warunkach pracujemy najczęściej z <strong>phpMyAdmin</strong> wykorzystującym silnik MySQL.</p>
  </section>

  <section id="sql" class="block">
    <h2>SQL – praktyczne komendy</h2>
    <p>SQL (Structured Query Language) to język służący do komunikacji z bazą danych. Poznasz najważniejsze polecenia:</p>

    <h3>1. Pobieranie danych – SELECT</h3>
    <pre>SELECT imie, nazwisko FROM uczniowie WHERE srednia > 4.0;</pre>

    <h3>2. Dodawanie rekordów – INSERT</h3>
    <pre>INSERT INTO uczniowie (imie, nazwisko, klasa) VALUES ('Jan', 'Kowalski', '2TI');</pre>

    <h3>3. Aktualizowanie danych – UPDATE</h3>
    <pre>UPDATE uczniowie SET nazwisko = 'Nowak' WHERE id = 3;</pre>

    <h3>4. Usuwanie danych – DELETE</h3>
    <pre>DELETE FROM uczniowie WHERE id = 5;</pre>

    <h3>5. Tworzenie tabel – CREATE TABLE</h3>
    <pre>CREATE TABLE przedmioty (
  id INT PRIMARY KEY AUTO_INCREMENT,
  nazwa VARCHAR(50),
  nauczyciel VARCHAR(50)
);</pre>
  </section>

  <section id="zadania" class="block">
    <h2>Zadania praktyczne</h2>
    <ol>
      <li>Stwórz bazę danych <strong>szkola</strong> i zaprojektuj 3 tabele: <em>uczniowie</em>, <em>przedmioty</em>, <em>oceny</em>.</li>
      <li>Dodaj przykładowe rekordy do każdej tabeli (minimum 5 uczniów, 5 przedmiotów i 15 ocen).</li>
      <li>Wyświetl uczniów z najwyższą średnią.</li>
      <li>Połącz tabele za pomocą JOIN, aby wyświetlić listę ocen z nazwą przedmiotu.</li>
      <li>Usuń wszystkie oceny poniżej 2.0.</li>
      <li>Przygotuj raport SQL z liczbą ocen z każdego przedmiotu.</li>
    </ol>
  </section>

  <section id="kontakt" class="block">
    <h2>Kontakt</h2>
    <p>Masz pytania? Skontaktuj się ze swoim nauczycielem poprzez:</p>
    <ul>
      <li>Microsoft Teams</li>
      <li>E-dziennik</li>
      <li>Konsultacje po lekcjach</li>
    </ul>
  </section>

  <footer>
    <p>&copy 2025 Bazy danych dla technikum</p>
  </footer>
</body>
</html>

Podobne wpisy

Dodaj komentarz

Twój adres e-mail nie zostanie opublikowany. Wymagane pola są oznaczone *