# Tq.HeaderFooter

Header et Footer de Télé-Québec.

## Version des logiciels

- Node : ^20.16.0
- PNPM : ^9.1.1

## Guide de démarrage rapide

### Pre-requis

    pnpm install

### Pour développer / tester

    pnpm dev

### Pour build\*

    pnpm build

Crée les fichiers js et cjs dans le dossier dist.

\*Le build est fait automatiquement au moment du déploiment.

### Pour déployer

Une fois les changements validés, faire partir la pipeline.

- Si les changements sont sur la branche master, la version sera mise à jour normalement.
- Si les changements sont sur la branche develop, la release sera marquée comme beta.
- Si les changements sont sur une branche autre, la release sera marquée comme alpha.

Dans le projet TQ.HeaderFooter dans pipelines, sélectionner TQ.HeaderFooter et Run pipeline.
Dans le panneau latéral sélectionner:

- La branche avec les derniers changements à déployer.
- Si le changement est mineur, majeur ou un simple patch.
- Puis cliquer sur Run.

## Intégration dans un site

### Ajout du package

Installer via la commande

    pnpm add @telequebec/tq-headerfooter

Selon le besoin, importer le module

    import "@telequebec/tq-headerfooter/tq-header";
    import "@telequebec/tq-headerfooter/tq-footer";

ou importer via require (CJS)

    require("@telequebec/tq-headerfooter/tq-header");
    require("@telequebec/tq-headerfooter/tq-footer");

Pour Next ou autre SSR

    useEffect(() => {
        import("@telequebec/tq-headerfooter/tq-header");
        import("@telequebec/tq-headerfooter/tq-footer");
    }, []);

Ajouter le web-component dans la page à l'endroit voulu

    <tq-header></tq-header>

ou

    <tq-footer></tq-footer>