Motyw (Vue + Inertia)

Motyw, czyli kod publicznej witryny, jest częścią aplikacji Laravel. Laravel dopasowuje URL, pobiera dane i wskazuje komponent strony; Inertia przekazuje komponent wraz z propsami do Vue. Pierwsze wejście korzysta z widoku resources/views/site.blade.php, a kolejne nawigacje Inertia aktualizują stronę bez pełnego przeładowania dokumentu. SSR może wyrenderować początkowy HTML po stronie Node.

Struktura resources/js/site

resources/js/site/
  app.ts          wejście Inertia i konfiguracja aplikacji
  pages/          strony wskazywane przez kontrolery Laravel
  layouts/        layouty witryny
  components/     komponenty wspólne i sekcje treści
  composables/    ustawienia, menu, locale i zgody cookies
  lib/            mapowanie i formatowanie danych widoku
  lang/           tłumaczenia interfejsu
  types/          typy propsów i danych

To nie jest routing oparty o pliki: nowy plik w pages/ sam nie tworzy URL-a. Komponent wybiera kontroler przez Inertia::render() lub handler typu strony. Dane pierwszego renderu zawsze dostarczaj z Laravel przez propsy. REST API służy tylko do doładowań po stronie klienta (wyszukiwarka, „pokaż więcej”, filtry bez przeładowania): composable usePublicApi() woła wyłącznie publiczne endpointy /api/public/* i dokleja bieżący język.

Jak URL trafia do komponentu

Jawne trasy motywu są w routes/web.php: strona główna (/), pojedynczy artykuł bloga (<segment-bloga>/{slug}), wysyłka formularza kontaktowego (POST /contact) i /styleguide. Lista artykułów i strona kontaktu nie mają własnych tras — to typy stron CMS obsługiwane przez końcowy catch-all /{slug}. Trasy są lokalizowane i korzystają z PublishedScope oraz HandleInertiaRequests.

Catch-all obejmuje tylko jeden segment adresu i jest rejestrowany po trasach modułów, żeby ich nie przesłaniać. Obsługuje go App\Http\Controllers\SlugController: najpierw pyta resolvery ze stałej RESOLVERS (w bazowym repozytorium pustej), a jeśli żaden nie obsłuży sluga, przekazuje żądanie do PageController. Ten wybiera handler na podstawie page.types w Modules/Page/Config/config.php. Typ bez handlera renderuje stronę generyczną.

URL → routes/web.php → kontroler / SlugController
    → resolver treści lub PageController
    → komponent Inertia + propsy → resources/js/site/pages

Dodawanie typu strony CMS

Handler typu implementuje Modules\Page\Contracts\PageType: zwraca nazwę komponentu z resources/js/site/pages i dodatkowe propsy.

class FaqPageType implements PageType
{
    public function component(): string
    {
        return 'Faq/FaqPage';
    }

    public function props(Page $page): array
    {
        return [
            'categories' => fn () => $this->categories(),
        ];
    }
}

Propsy zwracaj jako closure — Inertia rozwiązuje je na żądanie, a przy częściowym przeładowaniu liczy tylko ten, o który prosi strona. Listy z paginacją buduje Modules\Core\Http\Inertia\PaginatedProp::make().

Handler rejestruje się w Modules/Page/Config/config.php:

'types' => [
    'faq' => FaqPageType::class,
],

Do kompletu potrzebna jest strona resources/js/site/pages/<Moduł>/<Typ>Page.vue z propsem page i propsami handlera. Prop page, SEO i alternatywne ścieżki językowe dostarcza PageController. Przy wyłączaniu modułu usuń jego wpis z mapy.

Dodawanie strony z własnym modelem

php artisan mb:make-inertia <Moduł> <Model>

Generator tworzy kontroler w Modules/<Moduł>/Http/Controllers/Web, stronę resources/js/site/pages/<Moduł>/<Model>Show.vue i dopisuje trasę w routes/web.php przy markerach // inertia-use // i // inertia-routes //. Markerów nie usuwaj.

Propsy współdzielone i SEO

Modules/Core/Http/Middleware/HandleInertiaRequests przekazuje każdej stronie propsy: settings, googleTags, staticTexts, cookies (aktywne kategorie zgód; sam stan zgody użytkownika jest po stronie przeglądarki), menus, locale, defaultLocale, routeSegments, locales, breadcrumbs i siteUrl. Dane konkretnej strony zwraca jej kontroler. Publiczne Resources są rozwiązywane do propsów, żeby witryna i API korzystały ze wspólnego kształtu danych.

resources/views/site.blade.php odpowiada za dokument HTML oraz metadane takie jak canonical, hreflang, Open Graph i JSON-LD. Dane SEO i alternatywne ścieżki dostarcza backend; layout Vue aktualizuje tytuł i opis podczas nawigacji.

Skrypty Google tylko na produkcji

googleTags (GTM, GA) są wypełniane wyłącznie przy APP_ENV=production. Lokalnie ich nie zobaczysz.

Języki i adresy

Domyślny język ma adres bez prefiksu, a pozostałe języki używają prefiksu, np. /en. Route::localized() i Modules/Core/Services/LocaleService.php budują trasy oraz ścieżki tłumaczeń. Stałe segmenty adresów (np. segment bloga) są w Modules/Core/Config/site.php.

Języki witryny ustawia SITE_LOCALES w .env (albo komenda php artisan mb:set-locales pl,en), a domyślny — SITE_DEFAULT_LOCALE. Witryna udostępnia tylko te języki, które są jednocześnie na liście locales w config/translatable.php.

Budowanie adresów, hreflang, tłumaczone człony tras i dodawanie języka opisują Wielojęzyczne adresy URL. Model tłumaczeń po stronie backendu opisuje Obsługa wielu języków.

Przekierowania

Moduł Redirect sprawdza aktywne wpisy przed routingiem, dla żądań GET i HEAD kierowanych do motywu. Pole from jest ścieżką razem z prefiksem języka, a to ścieżką albo pełnym URL-em; query z żądania przechodzi do celu. Wpisami zarządza się w panelu.