Passer au playerPasser au contenu principal
📱 Installer Flutter avec Visual Studio Code – Tuto Débutant Flutter
Dans cette vidéo, je te montre étape par étape comment installer Flutter, Visual Studio Code, et Android Studio pour bien démarrer le développement mobile en Flutter.
Parfait pour les débutants qui veulent créer leur première application mobile !

🧰 Ce qu'on voit dans la vidéo :
Installation de Flutter SDK

Configuration de Visual Studio Code (VS Code)

Installation d'Android Studio

Configuration de l’environnement (variables, PATH)

Premier test d'application Flutter

🧡 Abonne-toi pour plus de tutos Flutter

📎 Liens utiles :

Git : https://git-scm.com/downloads

VS Code : https://code.visualstudio.com/Download

Android Studio : https://developer.android.com/studio

les chapitres :

00:00 Introduction
00:40 Installation de Git
01:51 Installation de VS Code
02:55 Installation d'Android Studio
05:00 Configuration des variables d’environnement
07:21 Installation Flutter et ses variable d'environnement
10:00 Premier projet Flutter
11:03 Bonus : simulateur Android
12:27 Bonus de fin

#Flutter #TutoFlutter #FlutterDébutant #VisualStudioCode #AndroidStudio #ApprendreFlutter #DéveloppementMobile
Transcription
00:00Yo, today we're installing Flutter. I promise, it's simpler than assembling Ikea furniture.
00:06And you won't have any screws in the hole.
00:08Do you want to create a mobile application, a web application, or even a stock management system?
00:14But you don't want to learn three different languages.
00:17Don't worry, I've got what you need, Flutter.
00:21It's a framework developed by Google that allows you to code once
00:26and launch your app everywhere.
00:29Yes, yes, even on your fridge, if you're motivated.
00:32In the end, you'll be able to launch your first project and struggle like any real Flutter developer.
00:38Here we go ?
00:39Let's start with the prerogatives.
00:41First, let's install Git.
00:43Why install Git for Flutter?
00:46Git is a bit like the Swiss Army knife for developers.
00:49Flutter uses Git internally to clone, update, and manage its own source code.
00:56So, even if you don't plan to use it directly at the beginning,
01:01Flutter needs it to function properly on your PC.
01:05Let's install Git.
01:10I'll put the link in the description.
01:13It will be simpler.
01:17For me, it will be for Windows.
01:20Windows, 64-bit, let's open it.
01:30Next, always next, next, next, again next, always, always.
01:45Once finished, we can close it.
01:49Now we can move on to the next step.
01:52Now that we have installed Git, we need a code editor.
01:56VS Code, Android Studio.
01:58For me, it will be VS Code.
02:00We're going to install Android Studio anyway.
02:03We need this for the Android emulator.
02:06Let's install VS Code.
02:07Likewise, I'll put the link in the description.
02:10This will be easier for you.
02:13So, VS Code, Windows.
02:26So, I understand the terms.
02:28I agree.
02:29Next, next, next, next.
02:33Create an icon on the desktop to find it later.
02:37Next, install.
02:39The installation is quite quick.
02:50Once installed, VS Code can be left aside.
02:53No need to execute it right away.
02:55Finished.
02:57Now we're going to download Android Studio.
02:59I'll also put the links in the description.
03:06Download.
03:07Top right.
03:09Left.
03:10Excuse me.
03:11Download.
03:13Accepted.
03:16Download.
03:16For Windows.
03:18Once downloaded, open the file.
03:24Next.
03:26Android.
03:27Leave the Android Virtual Devices option checked.
03:30This will be for emulators.
03:33Next.
03:34Next.
03:35Once this lengthy installation is complete.
03:37Next.
03:38Let's start Android Studio.
03:41So, Don't Sound.
03:45Next.
03:47Standard.
03:49Next.
03:51Appset.
03:53Finished.
03:56And we leave IP addresses.
03:58Once finished.
04:01Finished.
04:04We don't create a project.
04:06We're just going to...
04:07More Action.
04:09We'll go to Virtual Devices Manager.
04:14And we're going to create...
04:16We're going to create an emulator.
04:24Generally, I choose the Pixel 5.
04:27I'm used to the Pixel 5.
04:29Next.
04:31He will be in 36.
04:33He will be in 36.
04:33API 36.
04:33We're going to switch it to 34.
04:40And...
04:42Finished.
04:44Yes.
04:47We let the installation take place.
04:50Once the installation is complete.
04:51Finished.
04:53We can close.
04:55We can close it too.
04:58Now, let's set up the environment variables.
05:01To do this, we will first find the path to the Android SDK.
05:06We open a file.
05:09We're going to C.
05:11In User.
05:13The name of the PC.
05:19Apps Data.
05:20So if you don't see Apps Data, click Show.
05:24Display.
05:27And...
05:27Okay, I've hidden it now.
05:29Display.
05:31Hidden element.
05:32Tac.
05:33App Data.
05:36Local.
05:37Android.
05:40SDK.
05:42Then, we click up there.
05:45CTRL-C.
05:46Or copy, as you wish.
05:50OK.
05:54We go to the search bar.
05:56We type Variable.
06:00Variable.
06:01Modify the variables.
06:03System.
06:08Environmental variable.
06:11System variable.
06:13We create a new one.
06:15So it will be...
06:18Android.
06:20In capital letters.
06:22All in capital letters.
06:24Android.
06:27Home.
06:38And we glue...
06:42And we stick to our path.
06:47OK.
06:48Next, we go to Patch.
06:49We're doing something new.
06:52And you will be able to copy this variable.
06:57OK.
06:59Patch again.
07:06New.
07:07And also this variable.
07:13For now, we're done with the variables.
07:15We will come back to install the Flutter variables later.
07:20OK.
07:21Farm.
07:22And now, the most interesting part.
07:24Install Flutter.
07:27Installing Flutter will be very simple, since we already have VS Code.
07:31We're going to use VS Code.
07:34Let's go into the extensions.
07:37And then we type Flutter.
07:40Flutter.
07:42We'll take the first expansion.
07:44Install.
07:47We are waiting for the installation.
07:51Once installed, open the VS Code palette with CTRL, SHIFT and P.
07:59We type Flutter.
08:02New project.
08:06There, it asks us to download the SDK.
08:10We select the folder where we want to put it.
08:14And.
08:14So we're going to label it Flutter.
08:17New file.
08:19Flutter.
08:24Clone.
08:28Clone.
08:30Here we go.
08:34Now that Flutter is cloned, we will install the system variables.
08:38We'll do the same as before.
08:41Here, variables.
08:44Variables.
08:46Up.
08:47Modify the variables.
08:50Environmental variables.
08:53We're going into Patch.
08:57To modify.
09:00We're looking for the path to Flutter, which we just cloned.
09:04So generally in C.
09:06User.
09:07The name of the computer.
09:10Flutter.
09:12Flutter.
09:12And BAM.
09:18We copy the path at the top.
09:23New patch.
09:27Copy and paste.
09:29OK.
09:33OK.
09:34And OK.
09:35We close VSCode.
09:38We restart VSCode.
09:40We open the terminal.
09:43We're doing Flutter.
09:48Doctor.
09:50Doctor.
09:54And there.
09:57We realize that Flutter is working.
10:01Come on.
10:02Now comes the most enjoyable part.
10:04Create your first project.
10:06Let's create your first project.
10:08Up.
10:08We open the terminal.
10:10In the terminal, enter the Flutter command.
10:17Create.
10:17Created.
10:18The name of your project now.
10:20Note: no capital letters or spaces.
10:23Otherwise it won't work.
10:25I'm going to call it Tuto.
10:29And.
10:30Entrance.
10:32And here we go.
10:33It creates.
10:36So.
10:36It is created.
10:38Now created.
10:39We're going to open the file.
10:41Openfolder.
10:43I have a flawless tab.
10:46Tutorial.
10:48Oops.
10:50Tutorial.
10:55Yes.
10:56I am the author.
10:56So yes, I trust the author.
11:00And there you have it.
11:01Another project.
11:03Come on.
11:04A little bonus.
11:05How to open the emulator.
11:07Control.
11:08Shift.
11:08P.
11:09There.
11:10Okay, it appears right away.
11:11Flutter.
11:12Select.
11:12Select.
11:13Estimate.
11:14If it does not appear.
11:15We label it flutter.
11:17Select.
11:17Estimate.
11:18Or just screws.
11:20We select.
11:22Just now.
11:23We created a pixel 5.
11:25In my opinion.
11:26We select pixel 5.
11:31And there.
11:32It's going to start.
11:34So Pixel 5 has just started.
11:36We'll leave it.
11:37Keep searching.
11:40Once the emulator has started.
11:44We're reopening the terminal.
11:46We make sure we're in our file.
11:50And there.
11:51We label it flutter.
11:54Run.
11:58And.
12:01He's going to start us.
12:03Our application.
12:06The first time is always a bit long.
12:12And there you have it.
12:13After 5 minutes.
12:14Here we go.
12:17Your first wall light that appears.
12:21It is already functional.
12:22If you press the little plus sign.
12:28Now you've just installed VS Code.
12:30Android.
12:31Git.
12:32Ah.
12:33I don't know if you noticed.
12:34But Git was used for cloning flutter.
12:37If the video helped you.
12:39Don't hesitate to give yourself a little like.
12:40If you want more content.
12:41You can subscribe.
12:43It costs nothing.
12:44And if you encounter a problem.
12:47Anything for installing VS Code.
12:49From Git.
12:50Or whatever.
12:51Leave a comment.
12:52I will try to answer you as soon as possible.
Commentaires

Recommandations