System bloków
Jak działają bloki w modelu headless - defineBlock, instancje, komponent, context i loader danych.
Przegląd
Bloki to jednostki budulcowe każdej strony Cmssy. W modelu headless blok to komponent React w Twoim repozytorium Next.js, zadeklarowany przez defineBlock i schemę fields. Admin Cmssy pozwala edytorom umieszczać i konfigurować instancje bloków; Twoja strona renderuje je przez SDK. Blok ma trzy części:
- Schema (
fields) — edytowalne pola pokazywane w adminie - Komponent — komponent React renderujący treść
- Rejestracja — blok dodany do tablicy
cmssy/blocks.ts
Definiowanie bloku
Blok deklarujesz przez defineBlock i schemat fields, a jego komponent wyprowadza propsy z tego samego schematu przez BlockProps<typeof props> - dzięki temu pole ma nazwę dokładnie w jednym miejscu. Tworzenie bloków prowadzi przez całość; Schema i typy pól wymienia wszystkie typy pól.
Instancje bloków
Gdy edytor doda Twój blok do strony, Cmssy zapisuje instancję bloku:
{
id: string; // unikalny UUID tej instancji
type: string; // pasuje do `type` bloku (np. "hero")
content: Record<string, unknown>; // wartości pól per język
}Treść jest zapisana per język ({ en: {...}, pl: {...} }); SDK rozwiązuje aktywny język przed przekazaniem content do komponentu, więc czytasz pola bezpośrednio.
Komponent, context i dane
Twój komponent dostaje { content, context, data }. content jest już rozwiązany dla aktywnego języka i otypowany z Twojego schematu; context niesie locale i isPreview, a także forms oraz auth / workspace, gdy Twoja aplikacja poda je przez buildBlockContext; data to wynik loadera serwerowego.
Rejestracja to jedna tablica, cmssy/blocks.ts, i to ona jest jedynym źródłem prawdy: napędza renderowanie, a edytor uczy się z niej schematu każdego bloku przez most SDK, więc picker zawsze odpowiada temu, co Twój serwis potrafi wyrenderować. Bloki jadą na produkcję razem z deployem aplikacji - nie ma osobnego kroku budowania ani publikowania.
Bloki layoutu
Header, footer i inne współdzielone regiony to bloki layoutu — takie same jak bloki strony, ale oznaczone layoutPositions (np. ["header"]) i renderowane przez CmssyServerLayout per pozycja.
Internacjonalizacja
Treść jest kluczowana językiem w CMS i rozwiązywana per żądanie. Routing jest przez prefiks ścieżki (/pl/*), domyślny język używa czystych URL-i. Czytaj aktywny i włączone języki z context.locale.
Następne kroki
- Tworzenie bloków — pełny przewodnik: zdefiniuj, komponent, zarejestruj, wdróż
- Schema i typy pól — wszystkie typy pól, repeatery, grupy
- Zaawansowane funkcje — bloki layoutu, stylowanie, server loadery