feat: add database initialization script and description for shoe store

Co-authored-by: aider (openrouter/qwen/qwen3-coder) <aider@aider.chat>
feat: add database integration and dynamic product listing
2025-09-08 15:24:31 +02:00 · 2025-09-08 15:23:40 +02:00 · 2025-09-07 00:47:54 +02:00 · 2025-09-04 13:12:02 +02:00 · 2025-09-04 13:09:35 +02:00 · 2025-09-04 13:08:20 +02:00
7 changed files with 199 additions and 26 deletions
--- a/config/database.php
+++ b/config/database.php
@ -0,0 +1,13 @@
+<?php
+$host = 'localhost';
+$dbname = 'shoe_store'; // Replace with your database name
+$username = 'root';     // Replace with your database username
+$password = '';         // Replace with your database password
+
+try {
+    $pdo = new PDO("mysql:host=$host;dbname=$dbname;charset=utf8", $username, $password);
+    $pdo->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
+} catch (PDOException $e) {
+    die("Database connection failed: " . $e->getMessage());
+}
+?>
--- a/css/layout.css
+++ b/css/layout.css
@ -1,68 +1,141 @@
 body {
+    /* Zobacz: https://developer.mozilla.org/en-US/docs/Web/CSS/font-family */
    font-family: Helvetica;
+    /* Zobacz: https://developer.mozilla.org/en-US/docs/Web/CSS/background-color */
    background-color: #EAEAEA;
+    /* Zobacz: https://developer.mozilla.org/en-US/docs/Web/CSS/margin */
    margin: 0;
+    /* Zobacz: https://developer.mozilla.org/en-US/docs/Web/CSS/padding */
    padding: 0;
 }

 header {
+    /* Zobacz: https://developer.mozilla.org/en-US/docs/Web/CSS/position */
    position: relative;
+    /* Zobacz: https://developer.mozilla.org/en-US/docs/Web/CSS/text-align */
    text-align: center;
 }

 header img {
+    /* Zobacz: https://developer.mozilla.org/en-US/docs/Web/CSS/width */
    width: 100%;
 }

+/* 
+    position: absolute – wyrzuca tekst z normalnego przepływu strony i umieszcza go nad obrazkiem.
+    top: 50%; left: 50% – zaczyna od środka nagłówka.
+    transform: translate(-50%, -50%) – przesuwa tekst o połowę jego szerokości/wysokości, by był idealnie wyśrodkowany.
+    color: white – biały tekst na ciemnym tle obrazka.
+    font-size: 48px – duży tekst. 
+*/
+
 .header-text {
+    /* Zobacz: https://developer.mozilla.org/en-US/docs/Web/CSS/position */
    position: absolute;
+    /* Zobacz: https://developer.mozilla.org/en-US/docs/Web/CSS/top */
    top: 50%;
+    /* Zobacz: https://developer.mozilla.org/en-US/docs/Web/CSS/left */
    left: 50%;
+    /* Zobacz: https://developer.mozilla.org/en-US/docs/Web/CSS/transform */
    transform: translate(-50%, -50%);
+    /* Zobacz: https://developer.mozilla.org/en-US/docs/Web/CSS/color */
    color: white;
+    /* Zobacz: https://developer.mozilla.org/en-US/docs/Web/CSS/font-size */
    font-size: 48px;
+    /* Zobacz: https://developer.mozilla.org/en-US/docs/Web/CSS/font-weight */
    font-weight: bold;
 }

+/* 
+nav (menu) i footer (stopka) mają ciemnoszare tło (#625B5B), biały tekst i padding.
+text-align: center – centruje zawartość. 
+*/
 nav, footer {
+    /* Zobacz: https://developer.mozilla.org/en-US/docs/Web/CSS/background-color */
    background-color: #625B5B;
+    /* Zobacz: https://developer.mozilla.org/en-US/docs/Web/CSS/color */
    color: white;
+    /* Zobacz: https://developer.mozilla.org/en-US/docs/Web/CSS/padding */
    padding: 20px;
+    /* Zobacz: https://developer.mozilla.org/en-US/docs/Web/CSS/text-align */
    text-align: center;
 }

+/* 
+a w nav to linki:
+font-weight: bold – pogrubienie
+background-color: #EAEAEA – jasny tło przycisków
+color: #625B5B – ciemny kolor tekstu
+padding: 10px – przestrzeń wewnątrz przycisku
+margin: 50px – duża przestrzeń między linkami
+border-radius: 20px – zaokrąglone rogi
+text-decoration: none – usuwa podkreślenie linków 
+*/
 nav a {
+    /* Zobacz: https://developer.mozilla.org/en-US/docs/Web/CSS/font-weight */
    font-weight: bold;
+    /* Zobacz: https://developer.mozilla.org/en-US/docs/Web/CSS/background-color */
    background-color: #EAEAEA;
+    /* Zobacz: https://developer.mozilla.org/en-US/docs/Web/CSS/color */
    color: #625B5B;
+    /* Zobacz: https://developer.mozilla.org/en-US/docs/Web/CSS/padding */
    padding: 10px;
+    /* Zobacz: https://developer.mozilla.org/en-US/docs/Web/CSS/margin */
    margin: 50px;
+    /* Zobacz: https://developer.mozilla.org/en-US/docs/Web/CSS/border-radius */
    border-radius: 20px;
+    /* Zobacz: https://developer.mozilla.org/en-US/docs/Web/CSS/text-decoration */
    text-decoration: none;
 }

+/* Efekt po najechaniu myszą:
+Tło staje się ciemne, tekst jasny → efekt "przełączania"
+border: 1px solid – dodaje obramowanie */
+
 nav a:hover {
+    /* Zobacz: https://developer.mozilla.org/en-US/docs/Web/CSS/background-color */
    background-color: #625B5B;
+    /* Zobacz: https://developer.mozilla.org/en-US/docs/Web/CSS/color */
    color: #EAEAEA;
+    /* Zobacz: https://developer.mozilla.org/en-US/docs/Web/CSS/border */
    border: 1px solid #EAEAEA;
 }

+/* margin-left: 40px – wcięcie listy
+list-style-type: circle – kropki jako kółka */
+
 ul {
+    /* Zobacz: https://developer.mozilla.org/en-US/docs/Web/CSS/margin */
    margin-left: 40px;
+    /* Zobacz: https://developer.mozilla.org/en-US/docs/Web/CSS/list-style-type */
    list-style-type: circle;
 }

+/* border: 1px dashed – przerywana linia wokół tabeli
+width: 60% – tabela zajmuje 60% szerokości kontenera
+margin-left: 40px – wcięcie od lewej
+text-align: center – tekst w tabeli jest wyśrodkowany */
+
 table {
+    /* Zobacz: https://developer.mozilla.org/en-US/docs/Web/CSS/border */
    border: 1px dashed #625B5B;
+    /* Zobacz: https://developer.mozilla.org/en-US/docs/Web/CSS/width */
    width: 60%;
+    /* Zobacz: https://developer.mozilla.org/en-US/docs/Web/CSS/margin */
    margin-left: 40px;
+    /* Zobacz: https://developer.mozilla.org/en-US/docs/Web/CSS/text-align */
    text-align: center;
 }

+/* Klasa .kontrolki – np. dla przycisków, daje mały margines. */
 .kontrolki {
+    /* Zobacz: https://developer.mozilla.org/en-US/docs/Web/CSS/margin */
    margin: 5px;
 }

+/* main – główna treść strony ma wewnętrzny odstęp 20px od brzegów. */
+
 main {
+    /* Zobacz: https://developer.mozilla.org/en-US/docs/Web/CSS/padding */
    padding: 20px;
 }
--- a/i1.html
+++ b/i1.html
@ -2,49 +2,60 @@
 <html lang="pl">
 <head>
    <meta charset="UTF-8">
-    <title>Kursy komputerowe</title>
+    <title>Sklep z obuwiem</title>
    <link rel="stylesheet" href="css/layout.css">
 </head>
 <body>
+
    <header>
-        <img src="imgs/baner.png" alt="kursy komputerowe">
-        <div class="header-text">hello</div>
+        <img src="imgs/baner.png" alt="sklep z obuwiem">
+        <div class="header-text">Sklep z obuwiem</div>
    </header>
+
    <nav>
-        <a href="i1.html">Strona główna</a>
+        <a href="i1.php">Strona główna</a>
        <a href="raty.html">Koszt rat</a>
        <a href="https://moje-szkolenia.pl/">Nasz partner</a>
    </nav>
+    
    <main>
-        <h3>Kursy komputerowe - programowanie</h3>
+        <h3>Oferta obuwia</h3>
        <table>
            <tr>
-                <th>Kurs</th>
-                <th>Czas trwania</th>
+                <th>Model</th>
+                <th>Kategoria</th>
                <th>Cena</th>
+                <th>Opis</th>
            </tr>
-            <tr>
-                <td>React.js</td>
-                <td>4 miesiące</td>
-                <td>1500 zł</td>
-            </tr>
-            <tr>
-                <td>JavaScript</td>
-                <td>3 miesiące</td>
-                <td>1200 zł</td>
-            </tr>
-            <tr>
-                <td>HTML + CSS</td>
-                <td>2 miesiące</td>
-                <td>800 zł</td>
-            </tr>
+            <?php
+            require_once 'config/database.php';
+            
+            try {
+                $stmt = $pdo->query("
+                    SELECT b.model, k.nazwa_kat, b.nazwa, b.cena, b.opis 
+                    FROM obuwie_buty b 
+                    JOIN obuwie_kategorie k ON b.id_kat = k.id_kat
+                ");
+                
+                while ($row = $stmt->fetch(PDO::FETCH_ASSOC)) {
+                    echo "<tr>";
+                    echo "<td>" . htmlspecialchars($row['nazwa']) . "</td>";
+                    echo "<td>" . htmlspecialchars($row['nazwa_kat']) . "</td>";
+                    echo "<td>" . number_format($row['cena'], 2) . " zł</td>";
+                    echo "<td>" . htmlspecialchars($row['opis']) . "</td>";
+                    echo "</tr>";
+                }
+            } catch (PDOException $e) {
+                echo "<tr><td colspan='4'>Błąd przy ładowaniu danych: " . $e->getMessage() . "</td></tr>";
+            }
+            ?>
        </table>
        <h3>Adres do korespondencji</h3>
        <ul>
            <li>Adres: Katowice, ul. Mariacka 5</li>
            <li>Telefon: 32 888 88 88</li>
        </ul>
-        <a href="mailto:kursy@komputerowe.pl">skontaktuj się</a>
+        <a href="mailto:sklep@obuwie.pl">skontaktuj się</a>
    </main>
    <footer>
        <p>Autor strony: 99010101010</p>
--- a/imgs/baner.png
+++ b/imgs/baner.png
--- a/raty.html
+++ b/raty.html
@ -7,11 +7,11 @@
 </head>
 <body>
    <header>
-        <img src="imgs/baner.png" alt="kursy komputerowe">
-        <div class="header-text">hello</div>
+        <img src="imgs/baner.png" alt="sklep z obuwiem">
+        <div class="header-text">Sklep z obuwiem</div>
    </header>
    <nav>
-        <a href="i1.html">Strona główna</a>
+        <a href="i1.php">Strona główna</a>
        <a href="raty.html">Koszt rat</a>
        <a href="https://moje-szkolenia.pl/">Nasz partner</a>
    </nav>
--- a/sql/init.sql
+++ b/sql/init.sql
@ -0,0 +1,55 @@
+-- Inicjalizacja bazy danych dla sklepu z obuwiem
+-- Autor: [Twoje Imię/Nazwa Projektu]
+-- Data: [Data]
+
+-- Usuń istniejące tabele (jeśli istnieją) — dla czystego startu
+DROP TABLE IF EXISTS obuwie_produkty;
+DROP TABLE IF EXISTS obuwie_buty;
+DROP TABLE IF EXISTS obuwie_kategorie;
+
+-- Tabela: Kategorie butów
+CREATE TABLE obuwie_kategorie (
+    id_kat INT(3) PRIMARY KEY AUTO_INCREMENT,
+    nazwa_kat VARCHAR(30) NOT NULL UNIQUE
+);
+
+-- Tabela: Buty (modele)
+CREATE TABLE obuwie_buty (
+    model VARCHAR(20) PRIMARY KEY,
+    id_kat INT(3) NOT NULL,
+    nazwa VARCHAR(30) NOT NULL,
+    cena DECIMAL(7,2) NOT NULL,
+    opis TEXT,
+    FOREIGN KEY (id_kat) REFERENCES obuwie_kategorie(id_kat)
+        ON DELETE CASCADE
+        ON UPDATE CASCADE
+);
+
+-- Tabela: Produkty (konkretne egzemplarze butów w różnych rozmiarach i kolorach)
+CREATE TABLE obuwie_produkty (
+    id_prod INT(5) PRIMARY KEY AUTO_INCREMENT,
+    model VARCHAR(20) NOT NULL,
+    rozmiar DECIMAL(3,1) NOT NULL,
+    kolor VARCHAR(20),
+    ilosc INT(4) DEFAULT 0 CHECK (ilosc >= 0),
+    FOREIGN KEY (model) REFERENCES obuwie_buty(model)
+        ON DELETE CASCADE
+        ON UPDATE CASCADE
+);
+
+-- Wstaw przykładowe dane (opcjonalnie, dla testów)
+INSERT INTO obuwie_kategorie (nazwa_kat) VALUES
+('Sportowe'), ('Klasyczne'), ('Zimowe');
+
+INSERT INTO obuwie_buty (model, id_kat, nazwa, cena, opis) VALUES
+('NIKE-AIR-01', 1, 'Nike Air Max', 499.99, 'Buty sportowe z amortyzacją Air'),
+('ADIDAS-CL-02', 1, 'Adidas Cloudfoam', 349.00, 'Wygodne buty do codziennego użytku'),
+('DERBY-BLACK', 2, 'Derby Czarny', 599.50, 'Klasyczne buty męskie');
+
+INSERT INTO obuwie_produkty (model, rozmiar, kolor, ilosc) VALUES
+('NIKE-AIR-01', 42.0, 'Czarny', 15),
+('NIKE-AIR-01', 43.0, 'Biały', 8),
+('ADIDAS-CL-02', 41.0, 'Szary', 20),
+('DERBY-BLACK', 44.0, 'Czarny', 5);
+
+-- Koniec inicjalizacji
--- a/sql/opis.txt
+++ b/sql/opis.txt
@ -0,0 +1,21 @@
+Baza danych: Sklep z obuwiem
+
+Tabele:
+
+1. obuwie_kategorie
+   - id_kat (PK) — unikalny identyfikator kategorii
+   - nazwa_kat — nazwa kategorii (np. "Sportowe", "Klasyczne")
+
+2. obuwie_buty
+   - model (PK) — kod/model buta
+   - id_kat (FK → obuwie_kategorie) — przypisanie do kategorii
+   - nazwa, cena, opis — szczegóły produktu
+
+3. obuwie_produkty
+   - id_prod (PK) — unikalny ID egzemplarza
+   - model (FK → obuwie_buty) — odniesienie do modelu
+   - rozmiar, kolor, ilosc — konkretne cechy dostępnej pary
+
+Relacje:
+- obuwie_buty → obuwie_kategorie (każdy but należy do jednej kategorii)
+- obuwie_produkty → obuwie_buty (każdy produkt to konkretna para danego modelu)
Author	SHA1	Message	Date
baiobelfer	459b13f5d8	feat: add database initialization script and description for shoe store Co-authored-by: aider (openrouter/qwen/qwen3-coder) <aider@aider.chat>	2025-09-08 15:24:31 +02:00
baiobelfer	2e8961f0cb	feat: add database integration and dynamic product listing Co-authored-by: aider (openrouter/deepseek/deepseek-chat-v3.1) <aider@aider.chat>	2025-09-08 15:23:40 +02:00
baiobelfer	3ea70349df	docs: add MDN documentation links to CSS properties Co-authored-by: aider (openrouter/deepseek/deepseek-chat-v3.1) <aider@aider.chat>	2025-09-07 00:47:54 +02:00
baiobelfer	86863e1fd9	main padding	2025-09-04 13:12:02 +02:00
baiobelfer	db80169e66	wciecie listy	2025-09-04 13:09:35 +02:00
baiobelfer	d850ff8029	u	2025-09-04 13:08:20 +02:00
baiobelfer	e717d96683	hover	2025-09-04 13:07:01 +02:00
baiobelfer	10a2452ad3	nav a	2025-09-04 13:06:05 +02:00
baiobelfer	a9e4b4bafb	add comments	2025-09-04 13:00:25 +02:00
baiobelfer	63060a9db8	pozycjonowaanie textu na png@header	2025-09-04 12:54:12 +02:00
baiobelfer	e26fa89233	replace png	2025-09-04 12:41:35 +02:00
baiobelfer	63c9e396b9	style body	2025-09-04 12:25:24 +02:00