how to install flutter in vscode

 how to install flutter in vscode

I always wonder how people build apps. What kind of tools and where to start? And then I found Flutter which I want to give it a try. I will try to make it simple and clean for the installation and if there is something wrong feels free to message me.

Step 1: Android Studio w Emulator

First please download Android Studio

Download Android Studio and SDK tools | Android Developers

Android Studio Android Studio provides the fastest tools for building apps on every type of Android device. Platform…

developer.android.com

Then click on AVD Manager and Create a Virtual Device

AVD Manager

You can choose yours but in this case, I choose Pixel 3 :)

Create a Virtual Device (Pixel 3)

You can try playing with this but I always stick to Android 9.0

Select System Image

Then just click Next until your virtual device is ready.

Our Virtual Devices

Pixel 3 Ready

Step 2: Flutter

Second, please download flutter.

Windows install

To install and run Flutter, your development environment must meet these minimum requirements: Operating Systems…

flutter.dev

Extract the file that you download and put it inside C Drive

After that make sure the PATH is being set up like this.

PATH environment

Step 3: Visual Studio Code

Please download Visual Studio Code and follow the steps below

Download Visual Studio Code - Mac, Linux, Windows

Visual Studio Code is free and available on your favorite platform - Linux, macOS, and Windows. Download Visual Studio…

code.visualstudio.com

After download and install please make sure that you have this extension installed on your VSC

Flutter

The extension (Flutter)

Dart

The extension (Dart)

 Step 4: Dart SDK

Please download Dart SDK to make sure we can create and run flutter apps successfully

Dart SDK archive

Use this archive to download specific versions of the Dart SDK and the Dart API documentation. Want to install Dart…

dart.dev

Download x64 architecture

Dart SDK Download

Then create a new folder name as Dart inside Program Files and put the folder inside that newly created folder.

C:\Program Files\Dart

New Dart Folder

After that make sure the PATH is being set up like this.

PATH environment

First Project with Flutter!!!

Okay! Supposedly it should be working right now. So let's try to check using Visual Studio Code the version of our flutter.

flutter --version

Check flutter version

Let's try to upgrade our flutter if its not the updated one.

flutter upgrade

Upgrade Flutter

Okay, let's check flutter using its doctor haha.

flutter doctor

Check Flutter Health

Okay right now let's try to create our first simple project.

flutter create first_project

Flutter create the first project

So supposedly it should like the above figure. Right now go back to AVD Manager and start our virtual device. After that let's try to run the application and make sure you are inside the same directory with pubspec.yaml file.

flutter run

Flutter work successfully

So now you can start to make your first mobile application using Flutter! Enjoy and have fun with flutter :) In case you wonder what theme I use for my visual studio code is it's from HackTheBox and I will put it in the references.