> ## Documentation Index
> Fetch the complete documentation index at: https://docs-kit.lucdidion.lu/llms.txt
> Use this file to discover all available pages before exploring further.

# Bienvenue sur Kit'Asso

> Boîte à outils numérique pour associations luxembourgeoises

<img src="https://mintcdn.com/assopedia/JGaRWLLJV_Zgnl0l/images/kitasso-1.png?fit=max&auto=format&n=JGaRWLLJV_Zgnl0l&q=85&s=19d2191d00c24ef863461fb6a4f43293" alt="Kit'Asso Hero" lightAlt="Kit'Asso Hero" darkAlt="Kit'Asso Hero" className="hidden dark:block" width="1600" height="1200" data-path="images/kitasso-1.png" />

<img src="https://mintcdn.com/assopedia/JGaRWLLJV_Zgnl0l/images/kitasso.png?fit=max&auto=format&n=JGaRWLLJV_Zgnl0l&q=85&s=3320587a88a920a596155e640cb9c241" alt="Kit'Asso Hero" lightAlt="Kit'Asso Hero" darkAlt="Kit'Asso Hero" className="dark:hidden" width="1600" height="1200" data-path="images/kitasso.png" />

## Qu'est-ce que Kit'Asso ?

Kit'Asso est une plateforme qui aide les associations luxembourgeoises à découvrir, comparer et adopter les meilleurs outils numériques adaptés à leurs besoins. En 2 minutes, un diagnostic interactif de 7 questions recommande les 6 outils les plus adaptés avec un profil personnalisé et un plan d'action.

**Mission :** Simplifier la transformation digitale des associations en offrant un catalogue curé, des kits prêts-à-l'emploi, des guides pas-à-pas et des recommandations personnalisées via un quiz diagnostic avec scoring pondéré.

***

## En chiffres

<CardGroup cols={4}>
  <Card title="35+ Outils" icon="wrench">
    Catalogue d'outils testés et sélectionnés
  </Card>

  <Card title="13 Tables" icon="database">
    Architecture Nhost/Hasura avec permissions GraphQL
  </Card>

  <Card title="5 Kits" icon="box">
    Packs thématiques prêts-à-l'emploi
  </Card>

  <Card title="5 Guides" icon="route">
    Parcours pas-à-pas pour chaque besoin
  </Card>
</CardGroup>

***

## Fonctionnalités principales

### 🔍 Discovery & Comparaison d'outils

Explorez un catalogue de 35+ outils numériques :

* Recherche avancée avec filtres multiples
* Comparaison côte à côte de 2 outils
* Système de favoris persistant
* Catégorisation par usage et pricing

<Card title="Découvrir la feature Tools" icon="arrow-right" href="/features/tools">
  Documentation complète
</Card>

***

### 📦 Kits Prêts-à-l'Emploi (Tool Packs)

Des bundles thématiques pour démarrer rapidement :

* Starter Pack ⭐ (essentiels débutants — 0€)
* Communication & Email
* Automatisation
* Paiements & Dons
* Sites Web

<Card title="Voir les Kits" icon="arrow-right" href="/features/tool-packs">
  Documentation complète
</Card>

***

### 🛤️ Guides Pas-à-Pas (Workflows)

Des tutoriels étape par étape pour vos projets digitaux :

* 3 niveaux de difficulté (Débutant, Intermédiaire, Expert)
* Recommandations d'outils intégrées
* De zéro à opérationnel en moins d'1h

<Card title="Explorer les Guides" icon="arrow-right" href="/features/workflows">
  Documentation complète
</Card>

***

### 📊 Quiz Diagnostic V2

Diagnostic interactif avec moteur de scoring pondéré :

* 7 questions avec branchement conditionnel
* Scoring V2 : pondération par réponse pour des recommandations précises
* 3 profils : Débutant, Transition, Connecté
* Top 6 outils recommandés avec raisons personnalisées
* Plan d'action en 3 étapes
* Résultats partageables via URL
* Envoi du rapport par email

<Card title="Système Quiz" icon="arrow-right" href="/features/quiz">
  Documentation complète
</Card>

***

### ⚙️ Dashboard Admin

Interface de gestion complète :

* CRUD complet sur tous les contenus
* Upload de logos vers Nhost Storage
* Éditeur visuel de workflows
* Builder de quiz avec scoring weights et branchement

<Card title="Admin Dashboard" icon="arrow-right" href="/features/admin">
  Documentation complète
</Card>

***

## Stack technique

<AccordionGroup>
  <Accordion title="Frontend">
    * **React 18** avec TypeScript strict
    * **Vite 6** pour builds ultra-rapides
    * **Tailwind CSS** pour le design system
    * **React Router v6** pour navigation client (single-page)
    * **React Hook Form + Zod** pour validation
    * **Lucide React** pour les icônes
    * **clsx** pour composition de classes
  </Accordion>

  <Accordion title="Backend — Nhost">
    * **Nhost** (PostgreSQL + Hasura GraphQL + Auth + Storage)
    * **Hasura** pour API GraphQL auto-générée
    * **13 tables** avec relations complètes
    * **Permissions Hasura** pour contrôle d'accès (public/admin)
    * **Nhost Storage** pour upload de logos et assets
  </Accordion>

  <Accordion title="Déploiement">
    * **Netlify** pour hosting frontend + serverless functions
    * **Nhost Cloud** (eu-central-1) pour backend
    * **Netlify Functions** pour envoi d'email (Resend API)
    * **Umami** pour analytics
    * **SPA redirects** configurés
    * **Optimisations** : code splitting, lazy loading
  </Accordion>

  <Accordion title="Testing & Quality">
    * **Vitest** pour tests unitaires
    * **@testing-library/react** pour composants
    * **ESLint** pour linting
    * **TypeScript** strict mode
  </Accordion>
</AccordionGroup>

***

## Architecture

Kit'Asso utilise une **architecture feature-based** avec une page unique scrollable et une API layer centralisée via GraphQL.

```mermaid theme={null}
graph TD
    A[React App - Single Page] --> B[Features]
    B --> C[Tools]
    B --> D[Workflows]
    B --> E[Tool Packs]
    B --> F[Quiz]

    A --> G[API Layer - apiCall/apiCallVoid]
    G --> H[Nhost GraphQL Client]
    H --> I[Hasura]
    I --> J[(PostgreSQL)]

    A --> K[Shared Components]
    A --> L[Custom Hooks]

    style B fill:#4F46E5
    style G fill:#3B82F6
    style I fill:#22C55E
```

<CardGroup cols={2}>
  <Card title="Architecture globale" icon="sitemap" href="/architecture/overview">
    Vue d'ensemble du projet
  </Card>

  <Card title="Feature-Based" icon="layer-group" href="/architecture/feature-based">
    Organisation par domaine métier
  </Card>

  <Card title="Nhost & GraphQL" icon="plug" href="/architecture/nhost-graphql">
    Backend Nhost, Hasura et API Layer
  </Card>

  <Card title="Database Schema" icon="database" href="/database/schema">
    13 tables détaillées
  </Card>
</CardGroup>

***

## Démarrage rapide

<Steps>
  <Step title="Cloner le projet">
    ```bash theme={null}
    git clone https://github.com/Lucdidi3514/assopedia-v2.git
    cd assopedia-v2
    npm install
    ```
  </Step>

  <Step title="Configuration Nhost">
    Créez un fichier `.env` :

    ```bash theme={null}
    VITE_NHOST_SUBDOMAIN=your_nhost_subdomain
    VITE_NHOST_REGION=eu-central-1
    ```
  </Step>

  <Step title="Lancer le serveur">
    ```bash theme={null}
    npm run dev
    ```

    Ouvrez [http://localhost:5173](http://localhost:5173)
  </Step>
</Steps>

<Card title="Guide complet d'installation" icon="rocket" href="/quickstart">
  Configuration détaillée étape par étape
</Card>

***

## Navigation recommandée

### Pour les développeurs débutants

<Steps>
  <Step title="Quickstart">
    [Installation locale](/quickstart)
  </Step>

  <Step title="Architecture">
    [Comprendre l'organisation](/architecture/overview)
  </Step>

  <Step title="Nhost & GraphQL">
    [Backend et API](/architecture/nhost-graphql)
  </Step>
</Steps>

### Pour les développeurs expérimentés

<CardGroup cols={3}>
  <Card title="API Layer" icon="plug" href="/development/api-layer">
    apiCall + GraphQL
  </Card>

  <Card title="Custom Hooks" icon="hook" href="/development/hooks">
    Logique métier réutilisable
  </Card>

  <Card title="Testing" icon="flask" href="/development/testing">
    Vitest + Testing Library
  </Card>
</CardGroup>

***

## Contribution

Kit'Asso est un projet en constante évolution. Pour contribuer :

1. **Lisez les conventions** → [Conventions de code](/development/conventions)
2. **Créez une branche** → `feature/votre-feature`
3. **Écrivez des tests** → Coverage minimum 70%
4. **Soumettez une PR** → Review par l'équipe

***

## Support

<CardGroup cols={2}>
  <Card title="GitHub Issues" icon="github" href="https://github.com/Lucdidi3514/assopedia-v2/issues">
    Signaler un bug ou proposer une feature
  </Card>

  <Card title="Discussions" icon="comments" href="https://github.com/Lucdidi3514/assopedia-v2/discussions">
    Questions et échanges
  </Card>
</CardGroup>