Set up Visual Studio Code for use with Flutter

Install Visual Studio Code. Go here for the installer; https://code.visualstudio.com/

Click the “Download for Windows” (I’m assuming you’re using Windows)

When the installer finishes downloading then run it.

Agree to the terms and conditions (if you agree with them) and click “Next”

Select the install location (I leave it at the defaults) and click “Next”

Select the Start Menu Folder. Again, just hit “Next” and leave at the default

Select Additional Tasks. Again, I leave at the defaults and just click “Next”

“Ready to Install”… just click “Install”

Let the install complete…

…and we’re done. Just click “Finish” to launch VSCode

Once VSCode starts up, you’ll see something along the lines of this: –

Next, we need to install the Flutter extension

Select View->Command Palette. This will show a list of commands that can be executed withing VSCode

Type “Install Extensions” and select the line shown below

In the search box (shown below), type “Flutter” to find the Flutter extension. You’ll know you’ve got the right one as it’s got a LOT of installs

Click Install to install it

Wait for the install to complete…

If you now run flutter doctor again, you’ll see that it’s found the VSCode install (see below)

Setting up a New Flutter Project

Still in Visual Studio Code, select View->Command Palette and type “Flutter”. In the selection is shows (below), click on “Flutter: New Project”

Now, you could well see this (below). If you do then restart Visual Studio Code. It just needs a restart to find the flutter SDK. Either way, I’d recommend restarting VSCode after installing the Flutter extension

After a restart, repeat the View-Command Palette in the first step and you should now see this…

Select “Application”

Select a location to store the application in the dialog that shows

Now select the name for your application in this dialog

Then in the “Trust” dialog, select “yes, I trust the authors”

You will now see the screenshot below and you are ready to deploy your first flutter app

In the bottom right, you’ll see the pop-up below. Select Yes on this one to use the recommended settings

…and for this one, just click the cross in the upper right to close it

Now press F5 to build and deploy and you’ll see this…

You’ve now built and deployed your first Flutter app! Well done!