Marcin Rapacz
Full-Stack TypeScript Developer
React / Next.js · Vue / Nuxt · Node / Strapi · AI/LLM · PostgreSQL
Ponad 6 lat komercyjnego doświadczenia frontendowego, TypeScript strict od początku kariery. Pracuję w obu głównych ekosystemach — React/Next.js i Vue/Nuxt — komercyjnie platforma e-commerce dla kilkudziesięciu marek (Shopware 6, headless), architektura wielomarkowych motywów, SSR/SSG, testy automatyczne.
Pełny obraz warsztatu pokazuje StoryForge — mój autorski projekt full-stack (Next.js, Strapi, FastAPI, PostgreSQL): od architektury usługowej z wydzielonym serwisem AI, przez RAG pipeline z bazą wektorową, po CI/CD i deployment na VPS.
Doświadczenie komercyjne
6+ lat · e-commerce headless · Shopware 6
Platforma e-commerce dla kilkudziesięciu marek w architekturze monorepo. Odpowiedzialność za architekturę frontend, system motywów wielomarkowych oraz wdrożenia produkcyjne.
- Monorepo — 3-poziomowe: packages / themes / brand apps, kilkadziesiąt marek, pnpm workspaces
- Nuxt Layers — system dziedziczenia motywów i komponentów między markami
- SSR + SSG — optymalizacja wydajności na skalę produkcyjną
- Testy — Vitest + Playwright, pokrycie funkcji krytycznych
- Shopware 6 — headless commerce, Store API + Admin API
- CI/CD — GitLab CI/CD, Docker, Redis (cache)
Umiejętności
Technologie i narzędzia, z którymi pracuję na co dzień
- React 19 / Next.js 16
- Vue 3 / Nuxt 3
- TypeScript strict
- Tailwind CSS v4 / SCSS
- Pinia / Zustand
- shadcn/ui + Radix UI
- Vercel AI SDK
- next-intl
- Strapi 5 (headless CMS)
- Node.js / NestJS
- FastAPI (Python)
- PostgreSQL 16
- Qdrant (baza wektorowa)
- JWT / autoryzacja s2s
- REST API
- Redis
- RAG pipeline (chunking, embeddingi, Qdrant)
- LLM streaming (AI SDK, Gemini)
- Claude Code (subagenci, teams, agentic workflow)
- Prompt engineering
- Docker multi-stage builds
- GitLab CI/CD / GitHub Actions
- Traefik (reverse proxy, auto-TLS)
- Turborepo, pnpm, Vite
Projekt autorski: StoryForge
Platforma do pisania wspierana przez AI, która zna treść Twojej książki
Asystent RAG odpowiada na pytania o fabułę, sprawdza gramatykę i streamuje odpowiedzi na żywo. Cztery serwisy (Next.js, Strapi 5, FastAPI, Qdrant) za Traefikiem, wdrażane na VPS przez GitLab CI.
Kod źródłowy dostępny na życzenie
Wypróbuj aplikacjęZaimplementowane funkcjonalności
Działające funkcje dostępne w aktualnej wersji aplikacji
Uwierzytelnianie JWT
Rejestracja i logowanie przez Strapi users-permissions; treści prywatne, dostępne tylko dla właściciela.
Zarządzanie książkami
CRUD, statusy postępu pisania, gatunki literackie.
Edytor rozdziałów
Auto-save co 2s; przycisk Zapisz wysyła treść do indeksu AI, więc asystent zawsze zna ostatnią wersję.
Drag & drop
Zmiana kolejności rozdziałów z optymistycznym UI (@dnd-kit).
Dwujęzyczność
Pełna obsługa PL/EN z next-intl, automatyczna detekcja.
Kontrola dostępu
Walidacja ownership w kontrolerach, wewnętrzny token service-to-service między backendem a serwisem AI.
System kredytów
Bonus na start, opłata za każdą operację AI, automatyczny refund przy awarii, pełny ledger transakcji.
Monitoring błędów
Sentry we frontendzie i backendzie.
Baza wektorowa (Qdrant)
Embeddingi Google 768-wymiarowe, metryka cosinusowa, payload z metadanymi rozdziałów.
RAG Pipeline
Chunkowanie tekstu, generowanie embeddingów, wyszukiwanie kontekstu całej książki; usunięcie rozdziału czyści wektory.
Integracja z LLM
Google Gemini w wydzielonym serwisie FastAPI (Python) — backend CRUD bez zależności od LLM.
Streaming AI
Odpowiedzi LLM w czasie rzeczywistym, na froncie konsumowane przez AI SDK.
Sprawdzanie gramatyki
AI proponuje poprawki jako diff — autor decyduje, które zaakceptować.
Architektura systemu
Cztery serwisy za wspólnym reverse proxy, AI odseparowane od CRUD
Przeglądarka ──► Traefik (reverse proxy, auto-TLS)
├──► Frontend (Next.js)
└──► Backend (Strapi 5) ──► PostgreSQL
│ token s2s (sieć wewnętrzna)
▼
Serwis AI (FastAPI) ──► Qdrant (wektory)
└──► Google GeminiKluczowe decyzje
- Wydzielony serwis AI (FastAPI) — bez publicznego portu; każda operacja AI przechodzi przez backend, który egzekwuje ownership i kredyty, zanim żądanie dotrze do LLM
- Strapi jako źródło prawdy o treści — serwis AI pobiera rozdziały tokenem read-only, a indeks wektorowy nadąża za treścią (kontrakt „Zapisz = wyślij do AI”)
- Osobne repozytoria zamiast monorepo — frontend, backend, serwis AI i infrastruktura z niezależnymi pipeline'ami GitLab CI (build obrazu → rejestr → deploy przez SSH)
- Traefik— auto-HTTPS (Let's Encrypt), security headers, routing po subdomenach; wspólna infrastruktura VPS niezależna od deployów aplikacji
Stack technologiczny
Nowoczesne technologie i przejrzysta separacja odpowiedzialności
- Next.js 16 (App Router)
- React 19
- TypeScript 5 (strict)
- Tailwind CSS v4
- shadcn/ui + Radix UI
- TanStack React Query v5
- Zustand v5
- next-intl (PL/EN)
- @dnd-kit (drag & drop)
- AI SDK (streaming czatu)
- Sentry
- Strapi 5 (headless CMS, Node.js)
- PostgreSQL 16
- JWT (users-permissions)
- Własne kontrolery: czat RAG, gramatyka, embed
- System kredytów z ledgerem transakcji
- Migracje bazy danych
- Sentry
- Python + FastAPI
- Qdrant (baza wektorowa)
- Google Gemini (google-genai)
- Embeddingi 768-wymiarowe
- Pydantic v2
- httpx + Uvicorn
- 4 repozytoria + repo infrastruktury
- Docker (multi-stage builds)
- GitLab CI/CD + Container Registry
- Traefik (reverse proxy, auto-TLS)
- VPS (deploy przez SSH z CI)
- Skrypty bootstrap VPS i smoke E2E
Planowane funkcjonalności
Kolejne kroki w rozwoju projektu
- W planachPublikacja historii i publiczna biblioteka (natywny draft & publish Strapi)
- W planachAnaliza stylu tekstu
- W planachEdytor WYSIWYG (Tiptap / Lexical)
StoryForge jest rozwijany jako proof of concept — obecna wersja skupia się na wsparciu procesu pisania (edytor, asystent AI, gramatyka); publikowanie treści świadomie odłożono na później. Aplikacja może zawierać błędy. Projekt służy jako demonstracja umiejętności technicznych i podejścia do tworzenia oprogramowania.