Skip to main content
Flutter Basics – Complete Beginner to Advanced Guide
CHAPTER 02 Beginner

Setting Up Flutter Development Environment

Updated: May 16, 2026
20 min read

# CHAPTER 2

Setting Up Flutter Development Environment

1. Introduction

Before you can write a single line of Dart code, you need to prepare your digital workshop. Setting up a mobile development environment involves installing several pieces of heavy software, configuring system paths, and setting up virtual phones (emulators). Do not be intimidated if this process takes an hour or two—you only have to do it once! In this chapter, we will master Setting Up the Flutter Development Environment. We will download the Flutter SDK, configure Visual Studio Code, set up Android Studio for its emulators, and use the magical flutter doctor command to ensure everything is perfect.

2. Learning Objectives

By the end of this chapter, you will be able to:
  • Download and extract the Flutter SDK for your operating system.
  • Add Flutter to your system's Environment Variables (PATH).
  • Install Visual Studio Code and the required Flutter/Dart extensions.
  • Install Android Studio to manage Android SDKs and virtual devices.
  • Run flutter doctor to diagnose and fix installation issues.

3. Installing the Flutter SDK

The Software Development Kit (SDK) contains the compiler and libraries. For Windows:
  1. 1. Go to flutter.dev and download the Windows .zip file.
  1. 2. Extract the .zip file to a stable location, like C:\src\flutter. Do NOT extract it to C:\Program Files\ (this causes permission errors).
  1. 3. Update your Path: Search Windows for "Environment Variables". Edit the system variables, find Path, and add the full path to your Flutter bin directory: C:\src\flutter\bin.

For macOS:

  1. 1. Download the macOS .zip from flutter.dev.
  1. 2. Extract it to ~/development/flutter.
  1. 3. Add it to your path by opening your terminal and editing your ~/.zshrc profile: export PATH="$PATH:pwd/flutter/bin".

4. Installing Visual Studio Code

You need a text editor to write your code. We highly recommend Visual Studio Code (VS Code) because it is lightweight and fast.
  1. 1. Download VS Code from code.visualstudio.com.
  1. 2. Open VS Code, click the Extensions icon on the left panel (the four squares).
  1. 3. Search for Flutter (the official extension by Dart Code) and click Install. This automatically installs the Dart extension as well.

5. Installing Android Studio and Emulators

Even though we code in VS Code, we *must* install Android Studio because it provides the Android SDK tools and the virtual phones.
  1. 1. Download Android Studio from developer.android.com/studio.
  1. 2. Run the installer and accept all default SDK installations.
  1. 3. Open Android Studio -> Click More Actions -> Virtual Device Manager (AVD).
  1. 4. Click Create Device, choose a phone (like Pixel 6), download the latest system image, and click Finish. You now have a virtual Android phone!

6. The Magic Command: flutter doctor

Flutter provides a built-in diagnostic tool to ensure you didn't miss a step.
  1. 1. Open your computer's Terminal (or Command Prompt).
  1. 2. Type flutter doctor and hit Enter.
  1. 3. Flutter will scan your computer and output a checklist:
txt
123456789101112131415161718 
   [✓] Flutter (Channel stable, 3.10.0)
   [✓] Android toolchain - develop for Android devices
   [✓] Chrome - develop for the web
   [✓] Android Studio
   [✓] VS Code
   ```
4. If there is a `[!]` or `[X]`, read the instructions next to it (e.g., `flutter doctor --android-licenses` to accept Google's terms). Keep fixing things until all checks are green!

### 7. Step-by-Step Guide: Running Your First App
1. Open VS Code.
2. Press `Ctrl+Shift+P` (Windows) or `Cmd+Shift+P` (Mac) to open the Command Palette.
3. Type **Flutter: New Project** and select it.
4. Choose **Application**, select a folder on your computer, and name the app `my_first_app`.
5. VS Code will generate a complete starter app.
6. In the bottom right corner of VS Code, click the device selector and choose your running Android Emulator (or Chrome for web testing).
7. Press `F5` (or Run -> Start Debugging). The app will compile and launch on your emulator!

### 8. Visual Learning: The IDE Layout

txt [ VISUAL STUDIO CODE ] +-------------------+-----------------------------------+ | Explorer | main.dart | | > android | import 'package:flutter... | | > ios | void main() { | | > lib | runApp(MyApp()); | | - main.dart | } | | > pubspec.yaml | | +-------------------+-----------------------------------+ | Terminal: flutter run | +-------------------------------------------------------+ ``

9. Common Mistakes

  • Putting the SDK in Program Files: As mentioned, Windows blocks standard users from writing files in C:\Program Files. Flutter needs to write to its own folder when downloading packages. Always use C:\src\ or your Documents folder.
  • Ignoring Android Licenses: If flutter doctor complains about Android Licenses, simply open your terminal and run flutter doctor --android-licenses, pressing 'y' to accept them all.

10. Best Practices

  • Use Physical Devices: Emulators take up a massive amount of RAM. If your computer is slow, plug your physical Android phone into your PC via USB, enable "USB Debugging" in the phone's Developer Options, and run the app directly on your physical phone!

11. Practice Exercises

  1. 1. What command line tool do you run to verify that your Flutter installation is complete and error-free?
  1. 2. Which IDE extension must you install to get syntax highlighting, code completion, and debugging support for Flutter?

12. MCQs with Answers

Question 1

Why is it mandatory to install Android Studio even if you plan to write all your code inside VS Code?

Question 2

When adding the Flutter SDK to your Windows Environment Variables, which specific subfolder must be added to the Path?

13. Interview Questions

  • Q: Describe the output and purpose of the flutter doctor command. Provide an example of an issue it commonly identifies for new developers.
  • Q: Explain the necessity of the system Path variable in Windows/macOS. What happens if you skip this step during the Flutter SDK installation?
  • Q: Contrast running a Flutter app on an Android Emulator versus connecting a physical device via USB Debugging regarding system resource usage.

14. FAQs

Q: Can I build an iOS app on my Windows computer? A: No. While you can write the Flutter code on Windows, Apple's strict licensing requires you to use a physical Mac computer running Xcode to compile the final iOS build and upload it to the App Store.

15. Summary

In Chapter 2, we built our digital workbench. We downloaded the Flutter SDK and mapped it to our system's PATH. We installed VS Code for a lightweight coding experience and configured Android Studio to provide the heavy lifting of SDK management and virtual emulators. We ran flutter doctor` to ensure our environment was perfectly healthy, and successfully generated and launched our very first Flutter counter app.

16. Next Chapter Recommendation

Before we dive into building UI screens, we must learn the language that powers them. Proceed to Chapter 3: Understanding Dart Programming Basics.

Finish this Chapter

Save your progress on your learning path and prepare for coding interview challenges.

Previous Chapter Introduction to Flutter and Dart
Next Chapter Understanding Dart Programming Basics

Discussion

Join the discussion

Log in or create a free account to participate.

Sort: ·

Explore More

📖 Related Tutorials 5

🎥 Related Videos 1