Dart Fundamentals – Visual Studio Code and Dart

In this article I will show you how to setup and use Visual Studio Code to develop dart applications.

Setup is pretty straight-forward - we shall:

  • Install the Dart SDK
  • Install the Dart Code extension into VS Code
  • Create and run our first app

Install the Dart SDK

Make sure you have the Dart SDK installed. If you are using Windows, I recommend you install using the Dart SDK Installer for Windows. Another recommendation, regardless of platform, is that you choose the Stable channel release as opposed to the Dev channel unless you have a very specific need to do so.

NOTE: If you are already using Flutter the Dart SDK is already installed...

Installing the Dart Extension into Visual Studio Code

You can open up the extensions list in VS Code or browse directly to the extensions marketplace and click the install link. This extension is going to give you a lot of cool features for programming in Dart and Flutter such as syntax highlighting, code completion, and running/debugging your apps.

Building Your First Dart App

From within Visual Studio Code, use the following command appropriate to your platform:

Platform Command
Windows Ctrl+Shift+P
Mac Cmd+Shift+P

This will open up the VS Code command palette. Choose Dart: New Project.
You will now be prompted to install Stagehand. Click activate and Stagehand will be installed. Stagehand is a project generator for the Dart language. It will help scaffold your new projects.

You will also need to choose a project template once Stagehand is ready - for our purposes we will simply choose Console Application. To get scaffolding started you will specify a project name and a folder to create the application in. Once you have done so, you will a console app is generated with a structure similar to the following:

Sample Dart Project

Open up the main.dart file and as you can see, it has what you might expect to see in a console application - a main entry point method. This one is simply boiler-plate that Stagehand put in here for you. Let's run the app just to make sure everything is working and to see the output. Running the app is easy - just hit F5 from within VS code and you should see the following output:

Output

And that is about all there is to it. Explore more of the options of Dart and Stagehand and be sure to check out my ever-growing number of articles on Flutter and Dart.

-Joe

1 thought on “Dart Fundamentals – Visual Studio Code and Dart”

Leave a Reply

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