How to Install Flutter on Visual Studio Code on Windows 11 | With Emulator

Want to install **Flutter** on **Windows 11** and set it up with **Visual Studio Code (VS Code)**? 🚀 This step-by-step tutorial will guide you through **installing Flutter**, **configuring VS Code**, **setting up an emulator**, and **running your first Flutter app**! By the end of this video, you'll have a **fully functional Flutter development environment** on Windows 11, ready for building amazing apps. 💻🔥 --- ### **🔹 What You’ll Learn in This Video:** ✅ How to **install Flutter SDK** on Windows 11 ✅ How to **set up Visual Studio Code for Flutter development** ✅ How to **install Flutter and Dart extensions in VS Code** ✅ How to **set up an Android Emulator in VS Code** ✅ How to **run your first Flutter app on an emulator or a physical device** --- ## **1️⃣ System Requirements for Flutter on Windows 11** Before you start, make sure your system meets the following requirements: ✔ **Windows 11 (64-bit)** ✔ **At least 8GB RAM (16GB recommended)** ✔ **10GB+ free disk space** ✔ **Git installed** (Required for Flutter) - [Download Git](https://git-scm.com/downloads) ✔ **Android SDK & Emulator (via Android Studio or standalone)** --- ## **2️⃣ Download and Install Flutter SDK** ### ✅ **Step 1: Download Flutter SDK** 1. Go to the **Flutter official website**: 🔗 [https://docs.flutter.dev/get-started/install/windows](https://docs.flutter.dev/get-started/install/windows) 2. Download the **Flutter SDK (Windows version, .zip file)**. ### ✅ **Step 2: Extract the Flutter SDK** 1. Extract the ZIP file to a **suitable location** (e.g., `C:\flutter`). 2. Ensure the extracted folder **does not have spaces or special characters in the path**. --- ## **3️⃣ Set Up Flutter Environment Variables** ### ✅ **Step 1: Add Flutter to System PATH** 1. Search for **"Environment Variables"** in Windows and open it. 2. Under **System Variables**, select **Path** and click **Edit**. 3. Click **New** and add the following path: ``` C:\flutter\bin ``` 4. Click **OK** to save the changes. ### ✅ **Step 2: Verify Flutter Installation** 1. Open **Command Prompt (cmd)** or **PowerShell**. 2. Run the following command: ```bash flutter doctor ``` 3. If you see warnings about missing dependencies (like an Android emulator), don’t worry—we’ll fix them next! --- ## **4️⃣ Install Visual Studio Code & Extensions for Flutter** ### ✅ **Step 1: Download and Install VS Code** 1. Download **Visual Studio Code** from the official website: 🔗 [https://code.visualstudio.com/](https://code.visualstudio.com/) 2. Run the installer and follow the on-screen instructions. ### ✅ **Step 2: Install Flutter and Dart Extensions in VS Code** 1. Open **VS Code**. 2. Click on the **Extensions icon** on the left sidebar. 3. Search for **Flutter** and click **Install**. 4. The **Dart extension** will be installed automatically. --- ## **5️⃣ Set Up an Android Emulator in VS Code** ### ✅ **Step 1: Install Android Studio (Required for Emulator)** Even if you are using VS Code, you need **Android Studio** to install the Android SDK and create an emulator. 1. Download **Android Studio**: 🔗 [https://developer.android.com/studio](https://developer.android.com/studio) 2. Run the installer and complete the setup. --- ### ✅ **Step 2: Set Up an Emulator in Android Studio** 1. Open **Android Studio**. 2. Go to **Tools → Device Manager**. 3. Click **Create Virtual Device**. 4. Choose a device (e.g., **Pixel 6, Pixel 4**). 5. Select a **System Image** (e.g., **Android 13 (Tiramisu)**). 6. Click **Finish** and **Start** the emulator. --- ### ✅ **Step 3: Run the Emulator from VS Code** 1. Open **VS Code**. 2. Press **Ctrl + Shift + P** to open the command palette. 3. Search for **"Flutter: Launch Emulator"** and select it. 4. Choose the emulator you created in Android Studio. 5. Wait for the emulator to start. --- ## **6️⃣ Run Your First Flutter App in VS Code** ### ✅ **Step 1: Create a New Flutter Project** 1. Open **VS Code**. 2. Press **Ctrl + Shift + P** to open the command palette. 3. Search for **"Flutter: New Project"** and select it. 4. Choose **"Flutter Application"** and select a location for your project. ### ✅ **Step 2: Run the App on an Emulator or Physical Device** 1. Open the `main.dart` file inside the `lib` folder. 2. Click on the **Run** ▶️ button at the top. 3. If everything is set up correctly, you will see a **Flutter demo app** running! 🎉 ## **📌 Useful Links:** 🔗 Flutter Official Documentation: [https://docs.flutter.dev](https://docs.flutter.dev) 🔗 VS Code Download: (https://code.visualstudio.com/) 🔗 Dart Documentation:(https://dart.dev) 🔗 Android Studio Download:(https://developer.android.com/studio) 📌 **Hashtags:** #Flutter #VisualStudioCode #FlutterSetup #Windows11 #VSCode #AndroidEmulator #FlutterDevelopment #Dart #FlutterTutorial