Flutter Development on Ubuntu

Setting Up Flutter with VS Code

Let’s break down the setup process for using Flutter with VS Code, known for its smooth performance even on lower-spec systems. Personally, I’ve found that using VS Code significantly reduces the time taken for various tasks compared to Android Studio. Here’s how you can get started:

1. Downloading VS Code

VS Code, or Visual Studio Code, is an all-in-one code editor developed by Microsoft. It is free, open-sourced, and easy to set up. Download VS Code from here. Alternatively, you can use the terminal to install VS Code on your system with the following command:

sudo apt install code

2. Downloading Flutter SDK

After installing VS Code, you need to install the Flutter SDK to enable VS Code to build Flutter applications. Open your terminal again and run the following line of code, or follow similar instructions from the Flutter Website:

sudo apt install flutter

3. Enabling Git in VS Code

Once VS Code and the Flutter SDK are installed, you need to enable Git, a version control system (VCS). Select the VCS option from the left side of the VS Code interface. If you’re new to VS Code, refer to the image below:

VCS in VS Code

After selecting VCS, you will find an option to install Git. Click on it to be redirected to the Git download website, or use the following terminal commands to install Git:

sudo apt update
sudo apt install git

4. Installing Flutter and Dart Extensions

Next, go back to VS Code and select the Extensions icon (two positions below VCS). Search for the Flutter and Dart extensions and install them.

Installing Flutter Extension

5. Installing Android Studio

Although you can download packages separately, installing Android Studio ensures all essential packages, like ADB Manager and AVD Manager, are correctly added. Use the following commands to install JDK and Android Studio:

First, install JDK:

sudo apt install openjdk-11-jdk

Now, install Android Studio:

sudo snap install android-studio --classic

Open Android Studio from the Applications directory, follow the setup wizard, and select ‘Configure’ > ‘SDK Manager’ to install the required Android SDKs for various OS versions. Make sure to install the SDK version corresponding to your phone or virtual device. Apply the changes and follow the prompts to complete the installation.

6. Creating a New Flutter Project

Once everything is set up, restart VS Code. Create a new workspace folder for your project files. Click on View from the top toolbar and select Command Palette. Type in Flutter: New Project and select it. If prompted, provide the location of your Flutter SDK.

Alternatively, you can create a new project by running the following command in the VS Code terminal:

flutter create $projectname

Replace $projectname with your preferred project name. Once the project loads, you can access all files from the Files section on the left side toolbar (two positions above VCS).

7. Running Your Flutter Application

Connect your physical Android device or set up a new Android Virtual Device from the AVD Manager. Use the Run option (below VCS) to run and debug your application.

Now you’re all set to develop Flutter applications using VS Code. Happy coding!