Co zbudujemy
To samo API co na poziomie 3 – GET /api/vzkazy i POST /api/vzkazy – ale zamiast tablicy w pamięci czytamy i piszemy do SQLite. Frontend w React może zostać prawie bez zmian.
Pokażę ci: serwer z bazą danych
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 – all messages from the database
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 – a new message into the database
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: "Invalid message." });
}
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 running at http://localhost:3900");
});
Pokażę ci: frontend
Komponent React z poziomu 3 działa bez zmian – serwer zwraca ten sam JSON, tylko z dodatkowymi polami id i vytvoreno. Możesz je pokazać pod wiadomością małym szarym tekstem.
Teraz ty 💪
- Zamień tablicę
vzkazywserver.jsna kod powyżej (albo krok po kroku – najpierw GET, potem POST). - Uruchom serwer i wyślij 2 wiadomości z Reacta.
- Zatrzymaj serwer, uruchom znowu, odśwież stronę – wiadomości muszą zostać.
- Zrób commit zmian w Git i push na GitHub (bez
web.db– jest w.gitignore).
Na Render/Railway dysk bywa tymczasowy – web.db może zniknąć po nowym wdrożeniu. W produkcji użyj później hostowanej bazy (Render ma darmowy PostgreSQL). Do nauki i localhost SQLite jest idealny.
Sprawdź się: Księga gości przetrwa restart. Walidacja jest po stronie serwera. Używasz parametryzowanego SQL.
Co wyniesiesz z tej lekcji
- API + SQLite = dane na stałe.
prepare+?dla bezpiecznych INSERTów.web.dbnie idzie do Gita; w chmurze później PostgreSQL.
© 2026 Ing. Martin Polak / AlgoRhino · Warunki korzystania z treści