---
title: 'Démarrage rapide'
description: 'Installez votre environnement de développement, lancez TrainUs en local, et faites votre première modification.'
slug: 'demarrage-rapide'
weight: 1
date: 2026-06-16
---

## Ce dont vous aurez besoin

- **Node.js** ≥ 18
- **Python** ≥ 3.10 (uniquement pour lancer la suite de tests)
- Un navigateur récent — Firefox 111+, Chrome 102+, ou Safari 16.4+. TrainUs s'appuie sur OPFS (Origin Private File System) pour sa base de données, qui n'existe pas dans les navigateurs anciens ni dans les fenêtres de navigation privée.

## Cloner et installer

```bash
git clone <repo-url>
cd trainUs
npm install
```

## Lancer l'application

```bash
npm run dev
```

Cela démarre le serveur de développement Vite sur `http://localhost:5173`. Ouvrez-le dans votre navigateur — au premier lancement, TrainUs crée une base de données locale et génère un identifiant utilisateur aléatoire pour vous. Il n'y a rien d'autre à configurer : pas de fichier `.env`, pas de serveur, pas de compte.

## Petit tour de `src/`

Pas besoin de tout retenir — juste assez pour savoir où chercher :

| Dossier         | Ce qu'on y trouve                                                                                       |
| --------------- | ------------------------------------------------------------------------------------------------------- |
| `views/`        | Un composant Vue par route (`ExerciseListView.vue`, `SettingsView.vue`, …)                              |
| `components/`   | Des éléments plus petits et réutilisables entre les vues (dialogues, barre d'action, …)                 |
| `composables/`  | État réactif + logique partagés entre composants (`useExercises`, `useSessionExecution`, …)             |
| `db/`           | Tout ce qui touche à SQLite : le worker, le schéma, et un repository par entité dans `db/repositories/` |
| `i18n/locales/` | Fichiers de traduction — `en.json`, `fr.json`, `da.json`                                                |
| `styles/`       | Variables CSS (thèmes) et règles de mise en page globales                                               |
| `utils/`        | Petites fonctions utilitaires pures (validation, formatage de dates, rendu Markdown, …)                 |

La page [Référence]({{< relref "technical.fr.md" >}}) couvre tout ça en détail — schéma, routes, chaque composable. Gardez-la ouverte dans un onglet dès que vous travaillez sur quelque chose de concret.

## Lancer la suite de tests

TrainUs est testé de bout en bout avec Playwright, piloté depuis Python. Le serveur de développement démarre automatiquement pendant la durée des tests — pas besoin de garder `npm run dev` lancé séparément.

```bash
cd tests
python -m venv .venv
.venv/bin/pip install -r requirements.txt
.venv/bin/playwright install firefox chromium
cd ..
npm test                 # Firefox uniquement — la cible principale du projet
npm run test:parallel    # Firefox + Chromium, en parallèle
```

Voir `tests/README.md` dans le dépôt pour la configuration complète si quelque chose ne fonctionne pas du premier coup.

## Faire une petite modification

Avant de vous lancer dans quelque chose de réel, ça vaut le coup de boucler la boucle une fois : modifier, voir le rechargement, lancer les vérifications.

1. Avec `npm run dev` lancé, ouvrez `src/i18n/locales/en.json` et changez la valeur de `"settings.title"` en autre chose — par exemple `"Settings (testing)"`.
2. Enregistrez le fichier. Le navigateur devrait se recharger automatiquement et afficher votre changement sur la page Réglages.
3. Annulez la modification, puis lancez le formateur pour vérifier que votre éditeur est bien configuré comme celui du projet :

   ```bash
   npm run format:check
   ```

C'est toute la boucle de travail : modifier → recharger → vérifier le formatage. La page [Guides pratiques]({{< relref "how-to-guides.fr.md" >}}) détaille des tâches complètes et réalistes (ajouter une langue, ajouter un thème, déployer, ajouter une migration) construites exactement sur cette même boucle.

## Pour aller plus loin

- [Guides pratiques]({{< relref "how-to-guides.fr.md" >}}) — des recettes concrètes pour les tâches courantes de contribution.
- [Référence]({{< relref "technical.fr.md" >}}) — architecture, schéma de base de données, routes et chaque composable, en détail.
- [Comprendre l'architecture]({{< relref "understanding-the-architecture.fr.md" >}}) — le pourquoi des choix : local-first, le thread Worker, le système de migration.