# Installation

> Créez un site en une commande, ou ajoutez ZenithDocs à un projet Astro.

Source: https://aymericchaverot.github.io/zenith-docs/fr/installation/

ZenithDocs demande Astro 7 et Node.js 22.18 ou plus récent. Il n'est pas publié sur le registre npm : il s'installe directement depuis son [dépôt GitHub](https://github.com/AymericChaverot/zenith-docs), ce qui demande Git sur votre machine.

## Créer un site

Une commande crée un projet prêt à lancer :

<Tabs items={['npm', 'pnpm']} groupId="package-manager" persist>
  <Tab value="npm">
    ```sh
    npx github:AymericChaverot/zenith-docs create my-docs
    ```
  </Tab>
  <Tab value="pnpm">
    ```sh
    pnpm dlx --allow-build=esbuild github:AymericChaverot/zenith-docs create my-docs
    ```
  </Tab>
</Tabs>

C'est la même commande `zenith` que celle utilisée ensuite dans le projet, lancée directement depuis GitHub. Le premier lancement télécharge ZenithDocs et Astro, ce qui peut prendre une minute ; les suivants passent par le cache.

Dans un terminal, la commande demande le dossier, le titre, le gabarit (`cli` ou `astro`), un [thème](/fr/customization/theming/#packaged-themes), s'il faut ajouter un [Dockerfile](/fr/deployment/#docker) et installer les dépendances. Chaque réponse a son option, pour les scripts : `--template`, `--title`, `--theme`, `--docker` et `--install`, et `--yes` accepte les valeurs par défaut.

## Ajouter à un projet Astro

<Steps>

### Installer le paquet

<Tabs items={['npm', 'pnpm']} groupId="package-manager" persist>
  <Tab value="npm">
    ```sh
    npm install github:AymericChaverot/zenith-docs
    ```
  </Tab>
  <Tab value="pnpm">
    ```sh
    pnpm add github:AymericChaverot/zenith-docs
    ```
  </Tab>
</Tabs>

Cela suit la branche `main`. Ajoutez un tag de version pour la figer, comme `github:AymericChaverot/zenith-docs#v0.2.1` : les sites créés par `create` sont figés ainsi dès le départ.

### Ajouter l'intégration

Déclarez ZenithDocs dans votre configuration Astro et donnez un titre à votre site.

```js title="astro.config.mjs"

  integrations: [
    zenith({ title: 'Ma documentation' }), // [!code ++]
  ],
});
```

### Déclarer les collections de contenu

ZenithDocs lit les pages dans une collection `docs` et les métadonnées de navigation dans une collection `meta`.

```ts title="src/content.config.ts"

  docs: defineCollection({ loader: docsLoader(), schema: docsSchema() }),
  meta: defineCollection({ loader: metaLoader(), schema: metaSchema() }),
};
```

### Écrire votre première page

```mdx title="src/content/docs/index.mdx"
---
title: Bienvenue
description: La première page de ma documentation.
---

Bonjour tout le monde !
```

</Steps>

Lancez `astro dev` et ouvrez le site : votre page est servie à la racine, avec la sidebar, le sommaire et le thème sombre déjà en place.

:::note
Les pages sont prérendues, donc `astro build` produit un site entièrement statique, hébergeable n'importe où.
:::