Comment créer une application mobile Android/iOS avec Flutter #4 : installation sur Windows


salut à tous dans cette vidéo nous
allons voir comment installer Flutter et les logiciels de développement sur
windows pour créer nos applications mobiles avant de commencer la vidéo je
voudrais sincèrement vous remercier car vous êtes de plus en plus nombreux à
vous abonner à la chaîne youtube pour moi ça signifie que ça intéresse un
public ça me motive donc je voulais vous remercier
merci beaucoup alors on va commencer on va lancer le navigateur chrome internet
explorer ce que vous voulez on va taper Flutter.dev pour ceux qui ont
visionné la vidéo pour l’installation de mac os
c’est à peu près pareil au début site Flutter.dev on clique sur get
started et là on va choisir
au niveau de l’install windows voici là page où on va le plus travailler on va
commencer par là il nous dit que pour installer le prérequis il nous faut
windows powershell et Git PowerShell est installé par défaut sur windows 10
et sur les autres windows je vous invite à voir la version à, à
cliquer dessus si vous n’avez pas la bonne version
sinon on va attaquer directement Git for windows, on le lance voilà ça se télécharge
directement, c’est super on n’avait pas cette automatisme là sur mac os je sens
que ça va aller vite on revient tout de suite après la fin du téléchargement
le téléchargement est fini vous avez remarqué que je me suis remis sur la
page. Pour éviter que ça change votre page direct de windows faites un clic
droit sur le lien Git for windows et puis vous en voyez ça sur un nouvel
onglet. On va lancer Git pour l’installation on clic dessus, on exécute là la sécurité nous dit
êtes vous sûr de vraiment installé sur l’ordinateur, on mais oui
next là faites bien attention, faut bien
cocher les cases pour un usage futur Cela va permettre de lancer Git dans le
terminal de commandes ensuite on met next next next voilà qu’il faut me command
line also floch pâtit sauveteurs pièce s next
là vous choisissez c’est pour le style ok on est bon
niche c’était voir
si on a bien configuré on a bien installé guide pour qu’il fonctionne sur
l’invité de commande là on va aller chercher notre invite de
commande voilà vous l’avez là
cliquer dessus et on va aller paix juste git
voilà s’il fonctionne correctement vous avez ces informations-là s’affiche ça on
va mettre de côté on va le réutiliser après donc pour ici c’est bon on a bien
rempli les prérequis on a tout ce qu’il faut pour commencer on va passer à
l’installation du sdk au téléchargement du sdk de flotteurs pour ce faire on va
créer un dossier là où vous voulez moi de mon côté je veux créer dans document document up nouveaux dossiers à
l’appeler dave et ce con c’est qu’on va télécharger flotteurs
dans ce dossier là donc là on revient on va lancer l’invité de commande ici
cliquez sur guide bâche que donc envie de commandes qui est fournie par
guy tu vous pouvez aussi utiliser l’invite de commandes classiques de
windows les deux marchés en place a permis directement d’atterrir sur le
dossier des erreurs on va taper la commande qui est indiqué la ces deux
commandes là va télécharger la version stable
si vous cliquez ici on va le faire tout de suite vous avez les différentes
versions qui sont indiqués là donc vous pouvez télécharger soit la
version stable la version bêta dave ou le version
master version principale ça c’est ce qu’on appelle des channel
vous prenez votre commande guide qui est ici et on va la taper
tapez gay voilà exactement la commande qui est là
pour avoir le canal stable de flotteurs lancer la commande ça va télécharger pas
mal de fichiers y en a au moins pour 300 mo donc on revient tout de suite le
téléchargement vient de finir je vais vous montrer avant de passer à la
prochaine étape une petite astuce vous avez la possibilité de cliquer
aussi ici interface graphique donc c’est à peu
près le même principe il vous suffira de cliquer sur clown
existing et de copier la le lien pouvait faire ça aussi avec cette interface là
donc vous avez trois choix soit l’invite de commandes classiques vous vous mettez
à la racine de votre dossier et après vous tapez la commande guide soit avec
la ville de commandes fourni par git ou l’interface fournis par guide ensuite on a fini cette partie là
maintenant on va s’attaquer à la variable d’environnement
donc il faut installer cette variable à pour lancer flotteurs dans l’invité de
commande en fait quand on va taper flotteurs ici
on va avoir accès à l’ensemble de l’application flotteurs là pour
l’instant il nous dit que le flotteur n’est pas reconnue en tant que comme en
interne ce qui est normal car on n’a pas encore mis la variable d’environnement
pour installer ça on va taper ici le nv ça va nous mettre modifier les variables
d’environnement système en cliquer dessus
on va dans variables d’environnement et on regarde la place qui nous dit où les variables d’utilisateurs vérifier
qu’il y à une entrée appelé paf si c’est le cas rajoutez flotteurs been
avec bien sûr le chemin complet si ce n’est pas le cas il faut la créer puis
rajouter flotteurs been donc là on revient un regarde il y à bien une
variable paf en cliquer dessus et là nous allons rajouter le dossier flotteur
c’est l’âge been pour ce faire on se remet en rva dans
notre document on va cliquer là sur le dossier des rouges et télécharger
flotteurs dont va dans le dossier flotteurs et on va sélectionner been
pourvoir chemin complet jusqu’à bin là vous avez le chemin complet
la contrôler pour copier et on va le mettre dans la
variable environnement on va sur variable environnement tac paf en rage
sous au lever
ok ok ok on va essayer
voir si c’est bon pour ce faire il nous dit qu’il faut fermer et réouvrir la
console windows la vie de terminale ici présents en ferme on tape invite de
commande flotteur et voilà ça marche on va
que c’est parce qu’on veut terminer le programme oui si vous avez encore
l’histoire flotteurs n’est pas reconnu il faut refaire les étapes précédentes
avec le chemin complet vérifiez bien votre chemin qu’il allait bien jusqu’à
been ensuite on wallon
ces flotteurs docteur cette commande là va nous permettre de savoir qu’est ce
qu’on doit installer qu’est-ce qui nous restent installés
pour que flotteurs fonctionne correctement
on lance flotteurs docteur là il va commencer à télécharger le sdk ça va
prendre un certain temps on se revoit tout de suite
là il a téléchargé et installé les fichiers dont ils avaient besoin
marquer que ça a pris pas mal de temps selon votre connexion internet ça
prendra plus ou moins – temps là il nous dit il affiche une grosse croix rouge il
nous dit android tout chaîne développe frandroid une humble locked android sdk
c’est normal car on n’a pas encore installé on va le faire tout de suite
après on s’occupera des points d’exclamation kiala on se remet sur la doc ça on l’a fait ça
on l’a déjà fait là il nous met fort exemple tacle erreur exactement l’erreur
qu’on a et en plus il nous donne le lien hop on
va sur se lire la vous ouvrez un nouvel onglet s’en va
fermer vous ouvrez un nouvel angle est en collant le lien et vous allez tomber directement sur le
site d’android développeurs android copier coller le lien soit vous tapez
android android studio d’un ordre dans la barre de
georges si pareille sur la même page
une fois qu’on est sur cette page là on va télécharger l’ensemble des outils qui
va permettre de gérer android sdk et qui va fixer cette erreur là alors ce qu’on fait c’est qu’on va
télécharger ici android studio pourquoi android studio
pas ce qui va nous installer facilement il va configurer facilement tout ce
qu’on a besoin dans les émulateurs virtuel on en reparlera plus tard et
aussi le sdk d’android sélectionnez votre version si vous êtes
32 bits ou 64 on va prendre celle ci cochez hybrid
on va enlever ça me prend la tête et on va le télécharger d’autres cela va
prendre beaucoup de temps 710 mhz au hockey notre téléchargements
est fini on va le lancer avec un clic exécutez dakhla
next l’a indiqué bien android virtuel device ça ça va prendre un giga ça va
télécharger un gigas de données en plus juste après l’emplacement d’android
studio la stalle
une fois la scène on finit en clic sur next
c’est android studio et c’est là qu’après il va nous faire tout le
téléchargement il prend un peu de temps pour démarrer
voilà si vous avez un fichier importés en ce qui concerne la configuration dans
l’eau estudio au préalable sinon vous mettez rock si pour l’envoi de données à google pour
les statistiques oui ou non et nous voici dans la
pour la configuration dans un studio là on va cliquer next custom
next la sq il déchire next ici c’est pour l’accélération virtuel
pour avoir de bonnes capacités graphiques dans votre émulateur virtuel
android et la no émulateur virtuel android donc les émulateurs pour ceux
qui ne connaissent pas c’est ce qui va nous permettre de tester nos
applications directement sur des téléphones virtuel vous aurez votre
téléphone ici et puis on lancera nos applications là dessus ça nous évite de
branche est sytématiquement des téléphones et d’avoir acheté je ne sais
combien de téléphones pour tester nos applications ici super important le sdk
d’android l’emplacement du sdk faut bien mémorisé au chaos si vous avez un autre
problème encore une croix juste après il faudra
vérifier cet emplacement l’a donc mémoriser bien cet emplacement là une
fois que ceci est bon cliquez sur next la ici ils vous demandent combien de ram
et de vous prêt à allouer pour l’émulateur virtuel donc laissé sur deux
gigas recommandé si vous avez plus de ram dispo mettez en plus on va laisser
sur la valeur recommandée l’ex on est bon et on envoie finish là
il va nous télécharger tout ce que l’on a besoin dont le sdk android pour lancer
android studio si l’installation s’y déroulent sans encombre
vous devrez avoir ce genre de message une fois que c’est fini en clic sur
finish ça va lancer directement android studio
là on va passer on va repasser sur l’invité de commande on va retaper notre
cher flotteurs docteur pour voir où on en est si lacroix a disparu ok
donc là on a plus la croix on a le point d’exclamation mais il nous dit les
licences ne sont pas acceptés pour résoudre cela lancer flottant au docteur
android les sens on va faire ça tout de suite
on prend la commande ont fait un contrôle c et on va leur coller ici on
va relancer et on va accepter les licences tant que la liasse pouvait lien ces licences d’utilisation
d’android laisse vous mettez y est ça tout y est
tous là c’est fini en var
ces flotteurs docteur pour voir ce qu’il nous dit maintenant parfait s’est passé
au vert on va finir cela il nous dit pour android studio il manque les plus
jeunes flotteurs et d’arte on va installer ça tout de suite pour
cela mettez vous sur l’application android studio vous allez dans configure là vous allez taper flotteurs ici entrée
et on va allez ici flotteurs on mais accepte et
nous demandent si on veut installer d’arte en plus mais
oui comme ça il va installer les deux ares web studio vous avez maintenant accès à la création
de projets flotteurs ici-même start new flotteurs project on va fermer ça on va
relancer flotteurs docteur voir ce qu’il nous dit s’il a bien enlevé ce point
d’exclamation et on va s’attaquer à l’installation devait scott kelly nous
dit android studio installé il ya plus de problème avec les plus jeunes on va
installer et scott pour ce faire on se remet sur navigateur on va chercher ps
code dans la barre de recherche cliquez ici download visual studio cote
on ferme ça et on va installer pour notre version va se lancer directement et on revient tout
ensuite quand c’est fini en su ça
et il était bien r on va mettre exécuté je compte
c’est bon vous voulez créer une icône sur le
bureau et voilà vous avez maintenant visual
studio code installé sur votre windows il manque juste une chose pour clôturer
ce et les extensions flotteurs et d’arc comme se rendre au studio pour les
installer on va ici au niveau 2 extensions et on va chercher flotteur
qui est ici le premier en installe avec le petit bouton là il va
les d’arte en même temps normalement on vérifie ça mais d’arte et vous voyez qu’il est installé aussi
parfait on peut fermer ça en relance flotteurs docteur pour voir s’il détecte
tout c’est parfait il a détecté android studio et éviter ce code avec les plus
jeunes installés allez tous les logiciels pour commencer
à créer nos applications il ne reste plus qu’à commencer à créer
une application dans la prochaine vidéo nous commencerons à créer notre première
application avec vs cote a très vite

2 thoughts on “Comment créer une application mobile Android/iOS avec Flutter #4 : installation sur Windows

  1. Une idée d'application que vous voudriez que l'on crée ensemble ? L'idée sera peut-être sélectionnée pour être réalisée.

Leave a Reply

Your email address will not be published. Required fields are marked *