[F0][FE] PK-71: Next.js 15 + Tailwind v4 + shadcn/ui + dark mode + home page (+ PK-74 fix) #5

Merged

forge-admin merged 2 commits from feature/f0-fe-bootstrap into main

2026-05-17 13:10:14 +00:00

forge-admin commented

2026-05-17 13:09:47 +00:00

Owner

Summary

Frontend bootstrap pre Fázu 0: Next.js 15 (App Router, RSC), Tailwind v4, shadcn/ui (style new-york, base neutral, CSS variables), dark mode cez next-themes, Geist font, home page + ThemeToggle. Plus PK-74 fix (public/.gitkeep) odblokujúci Docker build, squash-nutý do tohto PR.

Tracking issues:

PK-71 — [F0][FE] Next.js 15 + Tailwind v4 + shadcn/ui + dark mode + home page (mention://issue/2bf01120-1922-46cb-9b68-b6a38ae2efd7)
PK-74 — [F0][FE] fix: docker build padá lebo public/ adresár chýba (mention://issue/ee162148-ce23-44db-a5f6-233904ea37e1)

Commits:

9f793f3 feat(frontend): Next.js 15 + Tailwind v4 + shadcn/ui + dark mode + home page
25314a8 fix(frontend): add public/.gitkeep to unblock docker build (PK-74)

Base: main (723653b, po PR #1 / PK-69 squash). Rebase preskočil 4c3ee34 (PK-69 pre-squash, už v main cez squash).

Čo je v PR

apps/frontend/: Next.js 15.5 (App Router, RSC), React 19, TS strict + noUncheckedIndexedAccess, ESLint 9 (next/core-web-vitals + next/typescript).
Tailwind v4 syntax — @import "tailwindcss", @theme inline, CSS variables, žiadny JS Tailwind config.
shadcn/ui init cez components.json (style new-york, base neutral, cssVariables: true); src/lib/utils.ts s cn(). UI komponenty pridávam on-demand vo Fáze 1+.
Dark mode cez next-themes: prepína class="dark" na <html>. globals.css definuje obidva sety premenných (:root light, .dark dark, neutrálna OKLCH paleta). V komponentoch žiadne dark: prefixy.
Font: Geist Sans + Geist Mono cez next/font/google.
Home page (src/app/page.tsx): „Rule Studio" v text-xl font-semibold, podtitul v text-sm text-muted-foreground, ThemeToggle (Sun/Moon z lucide-react) vpravo hore.
next.config.ts: output: "standalone" + reactStrictMode.
apps/frontend/Dockerfile multi-stage (node:22-alpine: deps → builder → runner s non-root userom, server.js zo standalone outputu) + .dockerignore.
apps/frontend/public/.gitkeep — PK-74 fix: Dockerfile runner stage COPY-uje /app/public, čo bez tohto súboru padalo (Next.js 15 create-next-app public/ už negeneruje).
docker-compose.yml frontend: healthcheck cez node -e "fetch('http://127.0.0.1:3000/')..." (Node 22 má natívny fetch), interval 10s, retries 6, start_period 20s.
docker-compose.dev.yml frontend: stavia builder target a beží pnpm dev s bind mountom + named volume pre node_modules a .next cache.

Test plan

pnpm install (workspace) — ✓
pnpm -r run lint — ✓
pnpm -r run typecheck — ✓ (strict + noUncheckedIndexedAccess)
pnpm --filter frontend build — ✓ (/ ○ Static, 11.6 kB / 114 kB First Load)
docker compose up frontend — healthcheck healthy do 30 s, localhost:3000 vracia HTML s <title>Rule Studio</title>.
Toggle dark mode na / flipne class="dark" na <html> a téma sa vizuálne prepne.
CI matrix (frontend lint + typecheck) zelená.

Notes

Žiadne shadcn UI komponenty (Button, Input, ...) — pridávajú sa on-demand, vo F0 ich nepotrebujeme.
Žiadny TanStack Query / Zustand setup — Fáza 3.
Storybook / Vitest setup — F0 nemá UI testy, posun do Fázy 1.
Self-merge policy podľa PK-77 (✓ áno pre PK-71 + PK-74); po green CI squash-merge.

## Summary Frontend bootstrap pre Fázu 0: Next.js 15 (App Router, RSC), Tailwind v4, shadcn/ui (style new-york, base neutral, CSS variables), dark mode cez next-themes, Geist font, home page + ThemeToggle. Plus PK-74 fix (`public/.gitkeep`) odblokujúci Docker build, squash-nutý do tohto PR. Tracking issues: - **PK-71** — `[F0][FE] Next.js 15 + Tailwind v4 + shadcn/ui + dark mode + home page` (`mention://issue/2bf01120-1922-46cb-9b68-b6a38ae2efd7`) - **PK-74** — `[F0][FE] fix: docker build padá lebo public/ adresár chýba` (`mention://issue/ee162148-ce23-44db-a5f6-233904ea37e1`) Commits: - `9f793f3 feat(frontend): Next.js 15 + Tailwind v4 + shadcn/ui + dark mode + home page` - `25314a8 fix(frontend): add public/.gitkeep to unblock docker build (PK-74)` Base: `main` (`723653b`, po PR #1 / PK-69 squash). Rebase preskočil `4c3ee34` (PK-69 pre-squash, už v main cez squash). ## Čo je v PR - `apps/frontend/`: Next.js 15.5 (App Router, RSC), React 19, TS strict + `noUncheckedIndexedAccess`, ESLint 9 (`next/core-web-vitals` + `next/typescript`). - Tailwind v4 syntax — `@import "tailwindcss"`, `@theme inline`, CSS variables, žiadny JS Tailwind config. - **shadcn/ui** init cez `components.json` (style `new-york`, base `neutral`, `cssVariables: true`); `src/lib/utils.ts` s `cn()`. UI komponenty pridávam on-demand vo Fáze 1+. - **Dark mode** cez `next-themes`: prepína `class="dark"` na `<html>`. `globals.css` definuje obidva sety premenných (`:root` light, `.dark` dark, neutrálna OKLCH paleta). V komponentoch žiadne `dark:` prefixy. - Font: **Geist Sans + Geist Mono** cez `next/font/google`. - Home page (`src/app/page.tsx`): „Rule Studio" v `text-xl font-semibold`, podtitul v `text-sm text-muted-foreground`, `ThemeToggle` (Sun/Moon z `lucide-react`) vpravo hore. - `next.config.ts`: `output: "standalone"` + `reactStrictMode`. - `apps/frontend/Dockerfile` multi-stage (`node:22-alpine`: deps → builder → runner s non-root userom, `server.js` zo standalone outputu) + `.dockerignore`. - `apps/frontend/public/.gitkeep` — PK-74 fix: Dockerfile runner stage COPY-uje `/app/public`, čo bez tohto súboru padalo (Next.js 15 create-next-app `public/` už negeneruje). - `docker-compose.yml` frontend: healthcheck cez `node -e "fetch('http://127.0.0.1:3000/')..."` (Node 22 má natívny fetch), interval 10s, retries 6, start_period 20s. - `docker-compose.dev.yml` frontend: stavia `builder` target a beží `pnpm dev` s bind mountom + named volume pre `node_modules` a `.next` cache. ## Test plan - [x] `pnpm install` (workspace) — ✓ - [x] `pnpm -r run lint` — ✓ - [x] `pnpm -r run typecheck` — ✓ (strict + noUncheckedIndexedAccess) - [x] `pnpm --filter frontend build` — ✓ (`/` ○ Static, 11.6 kB / 114 kB First Load) - [ ] `docker compose up frontend` — healthcheck `healthy` do 30 s, `localhost:3000` vracia HTML s `<title>Rule Studio</title>`. - [ ] Toggle dark mode na `/` flipne `class="dark"` na `<html>` a téma sa vizuálne prepne. - [ ] CI matrix (frontend lint + typecheck) zelená. ## Notes - Žiadne shadcn UI komponenty (`Button`, `Input`, ...) — pridávajú sa on-demand, vo F0 ich nepotrebujeme. - Žiadny TanStack Query / Zustand setup — Fáza 3. - Storybook / Vitest setup — F0 nemá UI testy, posun do Fázy 1. - Self-merge policy podľa PK-77 (`✓ áno` pre PK-71 + PK-74); po green CI squash-merge.

forge-admin added 2 commits

2026-05-17 13:09:47 +00:00

feat(frontend): Next.js 15 + Tailwind v4 + shadcn/ui + dark mode + home page 9f793f3753

PK-71 (F0). Nahrádza placeholder nginx kontajner skutočným Next.js appkou:

- apps/frontend/: Next.js 15.5 (App Router, RSC), React 19, TypeScript v5
  strict + noUncheckedIndexedAccess; ESLint 9 (next/core-web-vitals + next/typescript)
- Tailwind v4 (@import "tailwindcss", @theme inline, CSS variables, žiadny JS config)
- shadcn/ui inicializované: style new-york, base color neutral, CSS variables yes
  (components.json + src/lib/utils.ts s cn() helperom, žiadne UI komponenty zatiaľ —
  pridávame on-demand vo Fáze 1+)
- Dark mode: next-themes prepína class="dark" na <html>, globals.css definuje
  oba sety premenných (:root pre light, .dark pre dark, neutrálna OKLCH paleta);
  v komponentoch sa NEPOUŽÍVAJÚ dark: prefixy (PROJECT.md fáza 1 zákaz)
- Font: Geist Sans + Geist Mono cez next/font/google
- Home page: title "Rule Studio" (text-xl font-semibold), podtitul
  "DMN Kokpit — Drools editor pre biznis pravidlá" (text-sm text-muted-foreground),
  ThemeToggle (Sun/Moon z lucide-react) vpravo hore
- next.config.ts: output: "standalone" + reactStrictMode
- Dockerfile multi-stage (node:22-alpine deps → builder → runner s non-root userom,
  Next.js standalone output, image rádovo desiatky MB << 200 MB limit) + .dockerignore
- docker-compose.yml frontend service: healthcheck cez node fetch na GET / → 200,
  interval 10s, retries 6, start_period 20s
- docker-compose.dev.yml: frontend stavia "builder" target a beží "pnpm dev"
  s bind mountom + named volume pre node_modules/.next cache

Overené lokálne:
- pnpm -r run lint                  zelený
- pnpm -r run typecheck             zelený
- pnpm --filter frontend build      zelený, /  prerendered as static
- pnpm --filter frontend exec next start: GET /  vracia HTTP 200,
  HTML obsahuje <title>Rule Studio</title> a "Rule Studio" v h1
- /static/css/*.css obsahuje --background/--foreground premenné, .dark selektor
  a OKLCH paletu (Tailwind v4 token output OK)

docker compose up smoke E2E je pokryté PK-73 (QA).

Co-authored-by: multica-agent <github@multica.ai>

fix(frontend): add public/.gitkeep to unblock docker build (PK-74)

CI / Lint (drl-generator) (pull_request) Successful in 6s

Details

CI / Lint (shared-types) (pull_request) Successful in 6s

Details

CI / Lint (frontend) (pull_request) Successful in 6s

Details

CI / Lint (backend) (pull_request) Successful in 6s

Details

CI / Typecheck (drl-generator) (pull_request) Successful in 6s

Details

CI / Typecheck (shared-types) (pull_request) Successful in 6s

Details

CI / Typecheck (backend) (pull_request) Successful in 6s

Details

CI / Typecheck (frontend) (pull_request) Successful in 6s

Details

25314a85ff

Dockerfile runner stage COPY-uje /app/public, ktorý však neexistoval
v repo (Next.js 15 create-next-app ho už nevygeneruje). docker compose
build padal s "/app/public: not found". Pridanie prázdneho public/
adresára cez .gitkeep odblokuje build a zachová možnosť pridať statické
assets neskôr.

Co-authored-by: multica-agent <github@multica.ai>