Produkty, które można zrozumieć. Systemy, na których można budować.

Co było do rozwiązania

Centrum medyczne z nomenklaturą setek usług taryfowych potrzebowało, aby każda usługa była osobną stroną, możliwą do znalezienia w wyszukiwarce, z ceną i jednostką miary — a nie PDF-em z listą cen. Dodatkowo ceny i zespół się zmieniają, więc klinika musiała móc edytować je samodzielnie, a zapisy miały trafiać do recepcji od razu, a nie do skrzynki e-mail.

Co zbudowaliśmy

Next.js 14.2.35 (App Router) z React 18, TypeScript i Tailwind. Każda pozycja z nomenklatury medycznej stała się własną statyczną trasą: 521 plików `page.tsx` w `src/app`, z czego 481 pod `/servicii` — 184 fizioterapie, 122 servicii consultative, 61 examene medicale periodice, 27 ginecologie, 26 ozonoterapie, 23 pachete de tratament, 18 medicină alternativă, 12 diagnostic, reszta według sekcji. Sitemap na produkcji zawiera 890 adresów. Strona jest dwujęzyczna ro/ru. Edytowalna zawartość (lekarze, pakiety, zabiegi, artykuły, ustawienia, obrazy) jest przechowywana w lokalnej bazie SQLite przez `better-sqlite3`, z dziennikiem WAL i aktywnymi kluczami obcymi, zarządzana z `/admin` przez 20 tras API; uwierzytelnianie używa `jose` do sesji i `bcryptjs` do hasła, a zmiana hasła unieważnia istniejące sesje. Formularze zapisu i kontaktu są walidowane przez `zod` + `react-hook-form` i wysyłają sformatowaną wiadomość bezpośrednio do Telegrama, przez Bot API. Istnieje też kalkulator cen na `calculator`.

Co było do rozwiązania

Menu klubu często się zmienia, ma ceny i objętości, które muszą być dokładne, i jest czytane na telefonie, w ciemności, przez osoby mówiące trzema językami. Zeskanowany PDF na kodzie QR nie rozwiązuje niczego z tego: nie da się go przeszukiwać, nie da się go przetłumaczyć, nie da się go zaktualizować bez ponownego wydrukowania kodu.

Co zbudowaliśmy

Cyfrowe menu bez frameworka i bez pakietów: rzeczywiste źródła to cztery pliki JSON, a generator Python o długości 402 linii tworzy z nich jeden `index.html`. 119 produktów w 21 kategoriach, każdy z ceną, objętością, składem i fotografią; 119 krótkich tekstów prezentacyjnych, po jednym na produkt; 119 zestawów rekomendacji łączenia („z czym pasuje”), które widzi odwiedzający na każdej karcie. Menu ma trzy języki: rumuński jest bazą, a rosyjski i angielski obejmują nie tylko interfejs, lecz także kategorie, objętości, składy, 82 etykiety smaku i wszystkie 119 tekstów prezentacyjnych. Koszyk, lista ulubionych i dzielenie rachunku działają w przeglądarce, bez konta i bez serwera. Czcionki są hostowane na tej samej domenie, a nie w Google. Przed każdą publikacją skrypt o długości 233 linii wykonuje 16 sprawdzeń — czy nie wkradł się żaden tracker, czy nic nie jest pobierane z domeny zewnętrznej, czy JSON jest poprawny i każdy obraz istnieje, czy menu jest kompletne we wszystkich trzech językach, czy ceny maleją w każdej kategorii i czy dane strukturalne na stronie są poprawne. Publikacja odbywa się automatycznie z GitHub Actions przy scaleniu do `main`, po tym jak workflow robi pełną kopię produkcji i przechowuje ją przez 30 dni.

Co było do rozwiązania

Urząd gminy musi mieć oficjalną stronę internetową zgodną z HG 728/2023 — z stałymi sekcjami (transparentność decyzyjna, projekty i decyzje, ogłoszenia, dokumenty, kontakty, budżet) — i musi móc aktualizować ją samodzielnie, bez programistki lub programisty przy każdym ogłoszeniu. Bez tego informacja publiczna pozostaje na papierze albo w grupie na Facebooku.

Co zbudowaliśmy

Aplikacja Laravel 12 na PHP 8.2 z MySQL 8, front-end Vite + Tailwind, spakowana w dwa kontenery Docker (`japca_app` = nginx + PHP-FPM, `japca_db` = MySQL). Architektura celowo rozdziela dwa rodzaje treści: redakcyjne, które zmieniają się rzadko (geografia, historia, instytucje, kontakty, budżet), są w jednym pliku konfiguracji PHP o 1613 wierszach, który bezpośrednio odczytują szablony Blade, a te, które zmieniają się często (ogłoszenia, galeria zdjęć, projekty i decyzje, dokumenty, ustawienia przejrzystości) są w MySQL i edytuje się je z panelu `/admin`. 40 szablonów Blade, 32 trasy, 10 migracji bazy danych. Uwierzytelnianie w panelu jest ograniczone do 5 żądań na minutę z tego samego adresu — szóste dostaje 429 — a każda akcja administracyjna trafia do tabeli audytu. Nagłówki bezpieczeństwa i sitemap są objęte testami automatycznymi uruchamianymi w CI.

Co było do rozwiązania

To samo co przy każdym menu w kodzie QR: ma być szybkie na telefonie, poprawne cenowo, czytelne w trzech językach i możliwe do zmiany w pięć minut, gdy kuchnia usuwa danie. Poza tym restauracja nie potrzebuje żadnego śledzenia klienteli — a więc prawdziwe pytanie brzmi, czy ktoś naprawdę buduje stronę, która niczego nie zbiera, czy tylko tak pisze w polityce prywatności.

Co zbudowaliśmy

Jeden `index.html` generowany przez skrypt Python o 377 wierszach z plików JSON: 146 produktów w 31 kategoriach, 143 krótkie teksty prezentacyjne, plus tłumaczenia na rosyjski i angielski dla kategorii, nazw, objętości, składów, etykiet i tekstów. Koszyk, lista ulubionych i dzielenie rachunku działają w przeglądarce. Strona jest serwowana bezpośrednio przez Caddy 2, z automatycznym HTTPS. Interesujące jest to, że niewykrywanie użytkownika nie jest obietnicą, lecz regułą wymuszaną przez ciągłą integrację: przy każdym żądaniu scalenia CI regeneruje `index.html` ze źródeł i odrzuca PR, jeśli wynik różni się od pliku w repo (więc opublikowana strona zawsze odpowiada źródłom), a następnie uruchamia 14 kontroli — bez śledzących, bez żadnego zasobu ładowanego automatycznie z domeny trzeciej, fonty hostowane lokalnie, bez plików kopii zapasowej, które trafiły do repo, polityka prywatności obecna i podlinkowana z stopki, pełne menu w trzech językach, ceny w kolejności malejącej w każdej kategorii, poprawne dane strukturalne — i sprawdza także, czy z konfiguracji serwera nie zniknęły nagłówki bezpieczeństwa oraz maskowanie adresu IP w logach. Wszystkie użyte akcje GitHub są przypięte do sumy kontrolnej commitu, a workflow startuje z `permissions: {}`.

Co było do rozwiązania

niesprawdzone — nie mamy źródeł, więc nie mogę opisać problemu roboczego bez wymyślania go.

Co zbudowaliśmy

Aplikacja React skompilowana z Vite, serwowana statycznie przez nginx, z wersją rosyjską pod `/ru/`. 181 adresów w sitemapie produkcyjnej. Tyle da się stwierdzić z zewnątrz: źródeł nie ma na tej maszynie, więc nie mogę nazwać bibliotek, struktury ani integracji.

Co było do rozwiązania

Raionalny ośrodek stomatologiczny potrzebował publicznej listy usług z cenami, jasnego oznaczenia tych objętych obowiązkowym ubezpieczeniem, zespołu, harmonogramu dyżurów i stron przejrzystości — edytowalnych przez personel, nie przez programistę. Gdy przejęliśmy projekt, panel administracyjny miał poważny problem: hasło admina było porównywane w przeglądarce i trafiało do publicznego pakietu JavaScript, a żądania zapisu do API mógł wykonać każdy z internetu.

Co zbudowaliśmy

Aplikacja React 18 + TypeScript na Vite 6, z routingiem `react-router-dom` — 22 ekrany, od usług i cen po dyżury, ortodoncję, implanty, pedodoncję, przejrzystość i feedback. Z tyłu API Express 4 uruchomione pod PM2; nginx serwuje zbudowane pliki i przekazuje dalej tylko `/api`. Dane publiczne (usługi, zespół) są w plikach JSON czytanych zarówno przez API, jak i bezpośrednio przez front-end. Część, którą wprowadziliśmy, to zabezpieczenie: hasło nie opuszcza już serwera — `POST `login` sprawdza je tam i zwraca podpisany token HMAC-SHA256 ważny 12 godzin, z limitem 8 prób na 15 minut na adres IP i porównaniami w stałym czasie; zapisy do `services` i `team` teraz wymagają tokenu; sekret podpisu generuje się sam w pliku z uprawnieniami 0600, trzymanym poza repozytorium; API nasłuchuje tylko na 127.0.0.1, więc nginx jest jedyną publiczną drogą; CORS jest ograniczony do własnych domen, a ciało JSON ma limit 1 MB. Ponadto dodaliśmy CI, które buduje, sprawdza typy i odrzuca pakiet, jeśli znajdzie w nim sekret, oraz Dependabot z tygodniowym rytmem dla npm.

Co było do rozwiązania

Firma kredytowa potrzebuje czegoś więcej niż strony: wniosek musi wejść online, przejść przez przepływ decyzji, wygenerować umowę PDF, utworzyć harmonogram spłat i zostawić ślad w audycie — a wszystko to musi wytrzymać pytania, jakie zada osoba prosząca o zwrot swoich danych osobowych. Część publiczna (kalkulatory, artykuły, strony według typu kredytu) musi jednocześnie przyciągać osoby z wyszukiwarki.

Co zbudowaliśmy

Dwie połówki w jednym repozytorium. Część publiczna to aplikacja Vite + React Router kompilowana statycznie — 50 ekranów, w tym cztery kalkulatory (kredytu, kwalifikacji, refinansowania, harmonogramu spłat), osobne strony według typu kredytu, blog, strony informacyjne przedumowne i zgodności. Trasy rumuńskie pozostają bez prefiksu, a rosyjskie idą przez `/ru/…`, z tagami kanonicznymi i alternatywami generowanymi z języka aktywnej trasy. Część biznesowa to modułowy backend Express w TypeScript, z Prisma nad PostgreSQL: 16 modułów — uwierzytelnianie, uprawnienia według ról, przepływ wniosków, dokumenty, płatności, powiadomienia, zadania planowane, blog, SEO, GDPR, klienci, leady, kontakt, kalkulator, Google Ads, zdrowie — oraz 18 tabel w schemacie Prisma, w tym `Contract`, `Payment`, `AuditLog`, `GdprRequest`, `UploadedDocument`, `DailyKpiSnapshot` i `CronJobRun`. Działa pod PM2, z osobnymi skryptami do migracji w produkcji, kontroli przed wdrożeniem, generowania sekretów, kopii zapasowej i odtwarzania bazy.

Co było do rozwiązania

Usługę samochodową wyszukuje się w bardzo konkretnych kombinacjach — marka plus operacja plus dzielnica („naprawa automatycznej skrzyni BMW Botanica”). Jedna strona „Usługi” nie może na to nic odpowiedzieć. Problem techniczny polega na tym, że strona jest aplikacją React na jednej stronie, więc to, co widzi wyszukiwarka, to pusty `<div>`, jeśli nie zrobi się nic konkretnego.

Co zbudowaliśmy

Aplikacja React 19 + TypeScript na Vite 6, z React Router, ale prerenderowana przy kompilacji: każda trasa wychodzi z builda jako własny plik HTML, więc wyszukiwarka dostaje treść, a nie pustą stronę. Struktura adresów została rozszerzona etapami, możliwymi do sprawdzenia w historii — od 206 stron indeksowalnych do 316 przez dodanie kombinacji marka × kategoria prac, artykułów i stron według sektora Kiszyniowa. Trasy mają wersje językowe, osobny sitemap obrazów, obrazy Open Graph i podział pakietu JavaScript dla szybszego ładowania. Ostatni commit poprawił szczegół, który po cichu psuje indeksowanie: adres kanoniczny, `hreflang` i adresy w sitemapie nadają teraz wszystkie tę samą formę z końcowym ukośnikiem.