apairon
4020ad62c5
- Implemented `resolveApiAssetUrl` function to normalize asset URLs based on API base. - Updated `MedialibImage` component to utilize new asset URL resolution and added support for alt text and class properties. - Enhanced image loading behavior with improved width measurement and focal point handling. - Added placeholder image handling and improved accessibility with alt text. - Introduced new test script for auditing broken links in skill documentation. - Expanded seeded test content to include medialib entries and updated related tests for pagebuilder previews. - Improved global setup and teardown logging for clarity on seeded content management.
37 lines
1.8 KiB
Markdown
37 lines
1.8 KiB
Markdown
# tibi-starter
|
|
|
|
Starter Kit für SPAs(s) `;)` mit Svelte und TibiCMS inkl. SSR
|
|
|
|
> **Neues Projekt aufsetzen?** → Skill `.agents/skills/tibi-project-setup/SKILL.md`
|
|
|
|
## Setup-Checkliste
|
|
|
|
```text
|
|
[ ] Repository geklont und Remotes konfiguriert
|
|
[ ] __PROJECT_NAME__ in .env ersetzt (kebab-case)
|
|
[ ] __TIBI_NAMESPACE__ in .env ersetzt (snake_case)
|
|
[ ] __TIBI_NAMESPACE__ in api/config.yml und, falls Apache-Rewrite/Proxy genutzt wird, in frontend/.htaccess ersetzt
|
|
[ ] Keine verbleibenden __*__-Platzhalter (mit grep prüfen)
|
|
[ ] App.svelte hat <svelte:head> mit <title>
|
|
[ ] ADMIN_TOKEN in api/config.yml.env gesetzt
|
|
[ ] yarn install && yarn upgrade ausgeführt
|
|
[ ] make docker-up gestartet
|
|
[ ] Website erreichbar unter https://{PROJECT_NAME}.code.testversion.online/
|
|
[ ] yarn validate zeigt 0 Fehler und 0 Warnungen
|
|
[ ] yarn build und yarn build:server erfolgreich
|
|
```
|
|
|
|
## Architektur
|
|
|
|
Via Svelte wird eine SPA (Single-Page-App) programmiert. Der Code wird einmal für den Browser aufbereitet und außerdem für den Server kompiliert und transpiliert. Der Server-Code wird in einem tibi-server SSR-Hook eingebunden und generiert fertiges HTML anhand der aktuellen Route — für SEO und optimierte Ladezeiten.
|
|
|
|
Die Navigation innerhalb der App löst nur API-Aufrufe aus, ohne jedes Mal SSR anzustoßen. Ein Cache in der `ssr`-Collection minimiert die SSR-Last.
|
|
|
|
**SSR-Details:**
|
|
|
|
- `<title>` und `<meta description>` kommen über `<svelte:head>` aus `App.svelte` → SSR injiziert sie in den `<!--HEAD-->`-Platzhalter von `spa.html`
|
|
- `<html lang>` wird vom SSR-Hook (`api/hooks/ssr/get_read.js`) anhand der URL-Sprache gesetzt
|
|
- SSR-Bundle wird mit `yarn build:server` erstellt und landet in `api/hooks/lib/app.server.js`
|
|
|
|
Der normale Frontend-Build `yarn build` erzeugt sowohl das Frontend-Bundle als auch das Admin-Modul `admin.mjs`.
|