Construit avec EmberKit

Ce site de documentation tourne sur EmberKit — choisi pour la vitesse (livraison HTML-first, JS client minimal sur les pages de docs) et la même stack décrite dans les guides ci-dessous.

Stack en bref

Élément	Comment ce site l'utilise
Vitesse	Le SSR envoie du HTML complet par requête ; les pages MDX restent surtout statiques — FCP rapide sans hydrater chaque paragraphe
Rendu	`mode: 'ssr'` dans `apps/docs/emberkit.config.ts` — HTML à chaque requête de doc en dev et production
Routes	`src/routes/*/.mdx` et `.tsx` sous routage par fichiers
Layout	`src/routes/_layout.tsx` avec sidebar + contenu MDX
Interactivité	`useNavigate`, signals et `data-ek-bind` sur la vitrine UI — pas sur chaque page de doc
Styles	Tailwind 4 via `@tailwindcss/vite`
Tooling	`emberkit dev` / `emberkit build` depuis la racine du monorepo

Pour les modes de rendu (hybrid, static, spa) et les artefacts de build, voir SSR et SSG — la référence canonique.

Ce que nous ne dupliquons pas ici

Les sujets suivants sont documentés une seule fois ailleurs ; cette page ne fait que renvoyer vers eux :

Hydratation et data-ek-bind → Hydratation
API Signals → Signals
Routes par fichier et params → Routage
<Head> et generateMeta → Head et SEO et Meta

Routes de docs en MDX

Les pages de contenu sont des fichiers MDX compilés par le plugin Vite :

apps/docs/src/routes/docs/
├── introduction.mdx
├── ssr.mdx
├── quick-start.mdx
└── …

Chaque fichier correspond à /docs/<name> sans table de routes manuelle.

Hydratation sélective en pratique

La plupart des pages MDX sont du HTML statique après SSR. Les parties interactives (CTA de la page d'accueil, navigation sidebar, démos de composants UI) utilisent des handlers client ou des liaisons de signals. Cela correspond au modèle de Composants : seules les régions avec onClick ou data-ek-bind paient du JS client.

Les sections below-the-fold utilisent LazyInView du framework sur la page d'accueil (features, aperçu de code, CTA), la grille d'icônes et les gros blocs sur la page de référence UI pour garder la peinture initiale légère.

Développement local

Depuis la racine du repo :

pnpm --filter docs dev    # ou emberkit dev dans apps/docs

Affichez le code source de n'importe quelle URL de doc — le contenu doit apparaître dans #app avant l'exécution de JavaScript.

Build de production

pnpm --filter docs build
pnpm --filter docs preview   # emberkit preview

Déployez dist/ sur votre hébergeur, ou lancez emberkit serve pour un routage de type SSR/hybrid. Voir Déploiement edge pour les patterns CDN et Workers.

Prochaines étapes

SSR et SSG — Comment fonctionnent les builds et le pré-rendu
Démarrage rapide — Démarrer votre propre projet
Composants UI — Exemples en direct d'hydratation avec signals