# Installation

<div id="install"></div>

Trois commandes suffisent pour passer d'un dossier vide à une application Flutter opérationnelle, avec le routage, le réseau, les thèmes et la génération de code déjà configurés.

<div class="ny-doc-strip">
<span class="ny-doc-strip-label">Avant de commencer</span>
<span class="ny-doc-strip-item">SDK Flutter installé</span>
<span class="ny-doc-strip-dot"></span>
<span class="ny-doc-strip-item">Dart 3</span>
<span class="ny-doc-strip-dot"></span>
<a href="/fr/docs/7.x/requirements">Configuration requise →</a>
</div>

## Installer

Exécutez ces commandes dans l'ordre. Chacune peut être relancée sans risque.

<div class="ny-doc-steps">
<div class="ny-doc-step">
<span class="ny-doc-step-num">1</span>
<h3 class="ny-doc-step-title">Installer la CLI Nylo globalement</h3>

Installe la commande `nylo` sur votre système.

``` bash
dart pub global activate nylo_installer
```

</div>

<div class="ny-doc-step">
<span class="ny-doc-step-num">2</span>
<h3 class="ny-doc-step-title">Creer un nouveau projet</h3>

Cette commande clone le template Nylo, configure le projet avec le nom de votre application et installe automatiquement toutes les dependances.

``` bash
nylo new my_app
```

</div>

<div class="ny-doc-step">
<span class="ny-doc-step-num">3</span>
<h3 class="ny-doc-step-title">Configurer l&#039;alias Metro</h3>

Cela configure la commande `metro` pour votre projet, vous permettant d'utiliser les commandes Metro CLI sans la syntaxe complete `dart run`.

``` bash
cd my_app
nylo init
```

Redémarrez ensuite votre terminal, ou exécutez la commande `source` que `nylo init` affiche.

</div>
</div>

<div class="ny-doc-panel">
<div class="ny-doc-panel-head">
<img src="https://nylo.dev/images/nylo_logo.png" alt="" class="ny-mark h-[16px]">
<span>Ce que vous obtenez</span>
</div>
<div class="ny-doc-panel-body">
<div class="ny-doc-panel-grid">
<div class="ny-doc-panel-item">Routage et navigation pre-configures</div>
<div class="ny-doc-panel-item">Boilerplate de service API</div>
<div class="ny-doc-panel-item">Configuration du theme et de la localisation</div>
<div class="ny-doc-panel-item">Metro CLI pour la generation de code</div>
</div>
</div>
</div>


<div id="running-the-project"></div>

## Lancer le projet

Les projets Nylo s'executent comme toute application Flutter standard.

<div class="ny-doc-tabs" x-data="{ tab: 'Terminal' }">
<div class="ny-doc-tabbar" role="tablist">
<button type="button" role="tab" class="ny-doc-tab" @click="tab = 'Terminal'" :class="tab === 'Terminal' ? 'is-active' : ''" :aria-selected="tab === 'Terminal'">Terminal</button>
<button type="button" role="tab" class="ny-doc-tab" @click="tab = 'Android Studio'" :class="tab === 'Android Studio' ? 'is-active' : ''" :aria-selected="tab === 'Android Studio'">Android Studio</button>
<button type="button" role="tab" class="ny-doc-tab" @click="tab = 'VS Code'" :class="tab === 'VS Code' ? 'is-active' : ''" :aria-selected="tab === 'VS Code'">VS Code</button>
</div>

<div class="ny-doc-tabpanel" role="tabpanel" x-show="tab === 'Terminal'" x-cloak>

``` bash
flutter run
```

Si la compilation reussit, l'application affichera l'ecran d'accueil par defaut de Nylo.

</div>

<div class="ny-doc-tabpanel" role="tabpanel" x-show="tab === 'Android Studio'" x-cloak>

Ouvrez le dossier du projet, choisissez un appareil dans le sélecteur de cible, puis appuyez sur **Run**.

<a href="https://docs.flutter.dev/tools/android-studio#running-and-debugging" target="_BLANK">Documentation Flutter : exécution et débogage ↗</a>

</div>

<div class="ny-doc-tabpanel" role="tabpanel" x-show="tab === 'VS Code'" x-cloak>

Ouvrez le dossier du projet, puis exécutez **Debug: Start Without Debugging** depuis la palette de commandes.

<a href="https://docs.flutter.dev/tools/vs-code#run-app-without-breakpoints" target="_BLANK">Documentation Flutter : exécuter sans point d'arrêt ↗</a>

</div>

</div>


<div id="metro-cli"></div>

## Metro CLI

Metro génère les fichiers du projet pour vous. Lancez-le sans argument pour afficher le menu, ou appelez directement une commande.

``` plaintext
$ metro

Metro - Nylo's Companion to Build Flutter apps by Anthony Gordon

Usage:
    command [options] [arguments]

Options
    -h

All commands:

[Widget Commands]
  make:page
  make:stateful_widget
  make:stateless_widget
  make:state_managed_widget
  make:navigation_hub
  make:journey_widget
  make:bottom_sheet_modal
  make:button
  make:form

[Helper Commands]
  make:model
  make:provider
  make:api_service
  make:controller
  make:event
  make:route_guard
  make:config
  make:interceptor
  make:command
  make:env
```

### Référence des commandes

Chaque commande reçoit un nom, par exemple `metro make:page settings_page`

<div class="ny-doc-commands">
<div class="ny-doc-commands-head">Commandes de widgets</div>
<div class="ny-doc-command">
<code>metro make:page</code>
<span>Creer une nouvelle page</span>
</div>
<div class="ny-doc-command">
<code>metro make:stateful_widget</code>
<span>Creer un widget avec etat</span>
</div>
<div class="ny-doc-command">
<code>metro make:stateless_widget</code>
<span>Creer un widget sans etat</span>
</div>
<div class="ny-doc-command">
<code>metro make:state_managed_widget</code>
<span>Creer un widget a etat gere</span>
</div>
<div class="ny-doc-command">
<code>metro make:navigation_hub</code>
<span>Creer un hub de navigation (navigation inferieure)</span>
</div>
<div class="ny-doc-command">
<code>metro make:journey_widget</code>
<span>Creer un widget de parcours pour le hub de navigation</span>
</div>
<div class="ny-doc-command">
<code>metro make:bottom_sheet_modal</code>
<span>Creer une feuille modale inferieure</span>
</div>
<div class="ny-doc-command">
<code>metro make:button</code>
<span>Creer un widget bouton personnalise</span>
</div>
<div class="ny-doc-command">
<code>metro make:form</code>
<span>Creer un formulaire avec validation</span>
</div>
</div>

<div class="ny-doc-commands">
<div class="ny-doc-commands-head">Commandes utilitaires</div>
<div class="ny-doc-command">
<code>metro make:model</code>
<span>Creer une classe de modele</span>
</div>
<div class="ny-doc-command">
<code>metro make:provider</code>
<span>Creer un provider</span>
</div>
<div class="ny-doc-command">
<code>metro make:api_service</code>
<span>Creer un service API</span>
</div>
<div class="ny-doc-command">
<code>metro make:controller</code>
<span>Creer un controleur</span>
</div>
<div class="ny-doc-command">
<code>metro make:event</code>
<span>Creer un evenement</span>
</div>
<div class="ny-doc-command">
<code>metro make:route_guard</code>
<span>Creer un garde de route</span>
</div>
<div class="ny-doc-command">
<code>metro make:config</code>
<span>Creer un fichier de configuration</span>
</div>
<div class="ny-doc-command">
<code>metro make:interceptor</code>
<span>Creer un intercepteur reseau</span>
</div>
<div class="ny-doc-command">
<code>metro make:command</code>
<span>Creer une commande Metro personnalisee</span>
</div>
<div class="ny-doc-command">
<code>metro make:env</code>
<span>Generer la configuration d&#039;environnement a partir de .env</span>
</div>
</div>

### Exemples d'utilisation

``` bash
# Create a new page
metro make:page settings_page

# Create a model
metro make:model User

# Create an API service
metro make:api_service user_api_service
```


<div id="nylo-cli"></div>

## Nylo CLI

<!-- uncertain: le label "Requires" du x-doc-strip n'a pas de traduction établie dans cette locale -->
<div class="ny-doc-strip">
<span class="ny-doc-strip-label">Nécessite</span>
<span class="ny-doc-strip-item">nylo_installer 1.8.0+</span>
<span class="ny-doc-strip-dot"></span>
<a href="#nylo-self-update">Mettre à jour la CLI →</a>
</div>

La commande `nylo` de l'étape 1 fait plus que créer des projets. Exécutez-la depuis le répertoire de votre projet pour nettoyer les builds, actualiser les pods iOS, exécuter les tests et vérifier vos traductions.

<div class="ny-doc-commands">
<div class="ny-doc-commands-head">Commandes de projet</div>
<div class="ny-doc-command">
<code>nylo new</code>
<span>Créer un nouveau projet</span>
</div>
<div class="ny-doc-command">
<code>nylo init</code>
<span>Configurer l&#039;alias metro dans votre shell</span>
</div>
<div class="ny-doc-command">
<code>nylo clean</code>
<span>Exécuter flutter clean et flutter pub get</span>
</div>
<div class="ny-doc-command">
<code>nylo ios:pod-refresh</code>
<span>Réinstaller vos pods iOS</span>
</div>
<div class="ny-doc-command">
<code>nylo metro</code>
<span>Exécuter une commande Metro sans l&#039;alias</span>
</div>
</div>

<div class="ny-doc-commands">
<div class="ny-doc-commands-head">Tests et traductions</div>
<div class="ny-doc-command">
<code>nylo test</code>
<span>Formater et exécuter vos tests</span>
</div>
<div class="ny-doc-command">
<code>nylo locale:find-untranslated</code>
<span>Trouver le texte qui n&#039;est pas encapsulé dans .tr()</span>
</div>
<div class="ny-doc-command">
<code>nylo locale:check-missing-keys</code>
<span>Trouver les clés manquantes dans vos fichiers de langue</span>
</div>
</div>

<div class="ny-doc-commands">
<div class="ny-doc-commands-head">La CLI elle-même</div>
<div class="ny-doc-command">
<code>nylo self-update</code>
<span>Mettre à jour nylo vers la dernière version</span>
</div>
<div class="ny-doc-command">
<code>nylo --version</code>
<span>Afficher la version installée</span>
</div>
</div>

Les commandes qui acceptent des options les listent avec `-h`, par exemple `nylo test -h`. Les tests sont couverts dans [Exécuter les tests](/docs/7.x/testing#running-tests), et les commandes `locale:` dans [Auditer les traductions](/docs/7.x/localization#auditing-translations).

<div id="nylo-clean"></div>

### Nettoyer un projet

`nylo clean` exécute `flutter clean` puis `flutter pub get`. Ajoutez un flag de plateforme lorsqu'un nettoyage normal ne suffit pas :

``` bash
# flutter clean, puis flutter pub get
nylo clean

# Supprime aussi ios/Pods, ios/.symlinks et ios/Podfile.lock, puis exécute pod install --repo-update
nylo clean --ios

# Exécute aussi gradlew clean dans android/
nylo clean --android

# Les deux à la fois
nylo clean --all
```

Si un projet n'a pas de dossier `ios/` ou `android/`, cette plateforme est ignorée avec un avertissement. `pod install` ne s'exécute que sur macOS.

<div id="nylo-ios-pod-refresh"></div>

### Actualiser les pods iOS

Lorsque CocoaPods se désynchronise, `nylo ios:pod-refresh` supprime `ios/Pods`, `ios/.symlinks` et `ios/Podfile.lock`, puis exécute `pod install --repo-update` dans le dossier `ios/` :

``` bash
nylo ios:pod-refresh
```

Exécutez-la depuis la racine de votre projet sur macOS. Contrairement à `nylo clean --ios`, elle n'exécute ni `flutter clean` ni `flutter pub get`.

<div id="nylo-metro"></div>

### Exécuter Metro sans l'alias

`nylo metro` transmet tout ce qui suit à Metro (`dart run nylo_framework:main`). Utilisez-la avant d'avoir exécuté `nylo init`, ou sur Windows, où `nylo init` ne peut pas ajouter l'alias `metro` pour vous :

``` bash
nylo metro make:page settings_page
nylo metro make:model User
```

<div id="nylo-self-update"></div>

### Mettre à jour la CLI

``` bash
nylo self-update
```

Cela vérifie pub.dev et réinstalle `nylo_installer` si une version plus récente est disponible. Une fois une commande terminée, `nylo` vous indique également si une mise à jour est disponible. Elle reste silencieuse lorsque la sortie ne va pas vers un terminal, afin que l'avis ne se retrouve jamais dans les logs CI ou les rapports redirigés.

Pour voir quelle version vous avez installée :

``` bash
nylo --version
```
