Návštěvní kniha napořád

Co stavíme

Stejné API jako v Úrovni 3 – GET /api/vzkazy a POST /api/vzkazy – ale místo pole v paměti čteme a zapisujeme do SQLite. Frontend v Reactu může zůstat sk casi stejný.

Ukaž mi to: server s databází

const express = require("express");
const cors = require("cors");
const Database = require("better-sqlite3");

const aplikace = express();
const db = new Database("web.db");

db.exec(`
  CREATE TABLE IF NOT EXISTS vzkazy (
    id INTEGER PRIMARY KEY AUTOINCREMENT,
    jmeno TEXT NOT NULL,
    text TEXT NOT NULL,
    vytvoreno TEXT DEFAULT CURRENT_TIMESTAMP
  )
`);

aplikace.use(cors());
aplikace.use(express.json());

// GET – všechny vzkazy z databáze
aplikace.get("/api/vzkazy", (pozadavek, odpoved) => {
  const radky = db.prepare(
    "SELECT id, jmeno, text, vytvoreno FROM vzkazy ORDER BY id DESC"
  ).all();
  odpoved.json(radky);
});

// POST – nový vzkaz do databáze
aplikace.post("/api/vzkazy", (pozadavek, odpoved) => {
  const { jmeno, text } = pozadavek.body;

  if (!jmeno || !text || jmeno.length > 50 || text.length > 500) {
    return odpoved.status(400).json({ chyba: "Neplatný vzkaz." });
  }

  const vloz = db.prepare("INSERT INTO vzkazy (jmeno, text) VALUES (?, ?)");
  const vysledek = vloz.run(jmeno, text);

  odpoved.json({ ulozeno: true, id: vysledek.lastInsertRowid });
});

aplikace.listen(3900, () => {
  console.log("Server běží na http://localhost:3900");
});

Ukaž mi to: frontend

React komponenta z Úrovně 3 funguje beze změny – server vrací stejný JSON, jen s navíc id a vytvoreno. Můžeš je zobrazit pod vzkazem malým šedým textem.

Teď ty 💪

1. Nahraď pole vzkazy v server.js kódem výše (nebo postupně – nejdřív GET, pak POST).
2. Spusť server, pošli 2 vzkazy z Reactu.
3. Vypni server, znovu zapni, obnov stránku – vzkazy musí zůstat.
4. Commitni změny do Gitu a pushni na GitHub (bez web.db – je v .gitignore).

Co si z téhle lekce odnést

• API + SQLite = trvalá data.
• prepare + ? pro bezpečné INSERT.
• web.db nepatří do Gitu; na cloudu později PostgreSQL.

© 2026 Ing. Martin Polak / AlgoRhino · Podmínky užití obsahu