Qu'est-ce que Flutter | Comment l'installer
Tags: flutter, dart, google, mobile
Published: 2021-03-28 22:10:45

Bonjour à tous 👋!

j'espère que vous allez bien.

Cet article est le premier d'une longue série que je ferais autour de Flutter/Dart. Je partagerais avec vous comment créer de belles applications mobiles Android/IOS. Et comme vous pouvez le constater tout ceci en français 😉. 

N'hésitez pas à vous abonner, liker👍 et partager ce contenu si vous avez aimé.

Sur ce entrons dans le vif du sujet 😃!!!

# Qu'est ce que Flutter

Selon la documentation, **Flutter** est la boîte à outils d'interface utilisateur de Google permettant de créer de superbes applications **compilées en mode natif pour le mobile, le web et le bureau à partir d'un seul code**.

En d'autres termes, avec **Flutter** je peux développer des applications mobile (Android & IOS), des sites web, des applications pour bureau (Mac, Windows et Linux), tout ceci avec une seule base de code. C'est certainement pour cette raison que Flutter a été facilement adopté par la communauté des développeurs.

Entre autre, Flutter permet:

 1.**Le développement rapide**

Grâce au Hot reload et à un ensemble de widgets personnalisables (Nous expliquerons ces termes dans les prochains articles), flutter nous permet de développer rapidement (quelques millisecondes/secondes) de belles interfaces utilisateurs.

 2.**Des interfaces utilisateur expressives et flexibles**

L'architecture en couche de Flutter permet une personnalisation complète de l'interface utilisateur se traduisant par un rendu incroyablement rapide et des conceptions expressives et flexibles.

 3.**Performances natives**

On pourrait penser que, parce que Flutter est un Framework, il ne dispose pas de performances natives. ben...c'est tous le contraire.
Le code Flutter est compilé en code machine ARM ([plus d'info ici](https://fr.wikipedia.org/wiki/Architecture_ARM)) natif à l'aide des compilateurs natifs de Dart. Ce qui veux dire qu'à la fin vous obtenez un code natif. En plus Les widgets de Flutter intègrent toutes les différences essentielles des plateformes, telles que le défilement, la navigation, les icônes et les polices.

Bon...ça fait beaucoup de bavardage 🥱. Passons maintenant à un peu de pratique et voyons comment installer Flutter sur notre machine (Windows).

# Installation de Flutter

Pour développer avec Flutter, vous avez principalement besoin de 2 choses:

1. [le SDK Flutter](https://flutter.dev/docs/get-started/install)
2. un éditeur de texte ([VS Code](https://code.visualstudio.com/), [Android Studio](https://developer.android.com/studio))


#### Les étapes d'installation

1. Téléchargez le SDK sur [le Site de Flutter](https://flutter.dev/docs/get-started/install)
2. Une fois le SDK téléchargé, Extrayez le fichier zip et placez le dossier flutter dans l'emplacement d'installation (par exemple, `C:\src\flutter` recommandé).
3. Ajoutez Flutter à la variable d'environnement PATH pour pouvoir exécuter les commandes Flutter.

  * Dans la barre de recherche du menu Démarrer, tapez "env" et sélectionnez Modifier les variables d'environnement de votre compte.
  * Sous Variables utilisateur, vérifiez s'il existe une entrée appelée Path:
     *  Si l'entrée existe, ajoutez le chemin complet vers `flutter\bin` en utilisant `;` comme séparateur des valeurs existantes.
     *  Si l'entrée n'existe pas, créez une nouvelle variable utilisateur nommée Path avec le chemin complet vers `flutter\bin` comme valeur.


Une fois tous ceci fait, ouvrez votre terminal et tapez la commande `flutter doctor`. Si vous voyez un retour similaire à celui de l'image ci-dessous alors tout est ok sinon rassuré d'avoir suivis toutes les étapes.

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/fwd0qp5vh0h6c5dymdz4.png)
Ne vous inquiétez pas si vous n'avez pas toutes ces cases cochez ça viendra par la suite. Tant que vous avez une réponse positive tout est bon 🤗.


Ainsi prend fin ce premier article. Félicitations pour l'avoir terminé 👏.

Dans la suite nous verrons comment installer Flutter sur VS Code et Android Studio.