DEV Community

Cover image for Zero to Hero: Setup Flutter on Windows & macOS (The Quick Guide)
Codexlancers
Codexlancers

Posted on

Zero to Hero: Setup Flutter on Windows & macOS (The Quick Guide)

#flutter

Are you ready to build beautiful, cross-platform apps from a single codebase? Before you write your first line of Dart, you need to set up your environment.

Don't let installation guides overwhelm you. Here is the absolute quickest, no-nonsense way to get Flutter up and running on both Windows and macOS.

The Prerequisites (Both OS)

Before touching Flutter, install Visual Studio Code (VS Code). It is light, fast, and the absolute best editor for beginners.

Once installed:

  1. Open VS Code.
  2. Go to the Extensions tab (Ctrl+Shift+X or Cmd+Shift+X).
  3. Search for Flutter and click Install (this automatically installs the Dart extension too).

Setting Up on Windows

Step 1: Install Git

Download and install Git for Windows. Just use the default settings during installation.

Step 2: Download & Extract Flutter

  1. Download the latest stable Flutter SDK zip file from the Official Flutter Docs.
  2. Create a folder named C:\src.
  3. Extract the downloaded zip file directly inside C:\src, so your path looks like C:\src\flutter.

⚠️ Important: Do NOT extract it into C:\Program Files as it requires admin permissions and will break things.

Step 3: Update Your Environment Path

To run Flutter commands anywhere, Windows needs to know where it lives:

  1. Press the Windows key and type "env", then select Edit the system environment variables.
  2. Click Environment Variables… at the bottom.
  3. Under User Variables, look for Path and double-click it.
  4. Click New and paste: C:\src\flutter\bin
  5. Click OK on all windows to save.

Setting Up on macOS

Step 1: Install Homebrew (If Not Installed)

Open Terminal and run the command package manager script:

/bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"
Enter fullscreen mode Exit fullscreen mode

Verify the installation is live:

brew --version
Enter fullscreen mode Exit fullscreen mode

Step 2: Install Flutter

You can download the Flutter SDK manually from the Flutter Official Website, or install it instantly via Homebrew:

brew install --cask flutter
Enter fullscreen mode Exit fullscreen mode

Step 3: Add Flutter to PATH

Locate your installation destination:

which flutter
Enter fullscreen mode Exit fullscreen mode

Open your configuration script (nano ~/.zshrc). If you used Homebrew on an Apple Silicon Mac (M series), paste this line at the bottom:

export PATH = "$PATH:/opt/homebrew/Caskroom/flutter/latest/flutter/bin"
Enter fullscreen mode Exit fullscreen mode

(For manual zip installation, paste: export PATH="$PATH:/path/to/flutter/bin" instead).

Apply the terminal changes and verify:

source ~/.zshrc
flutter --version
Enter fullscreen mode Exit fullscreen mode

Step 4: Install Xcode (For iOS Target Development)

  • Download Xcode from the Mac App Store.
  • Configure the developer tools command paths: 
sudo xcode-select --switch /Applications/Xcode.app/Contents/Developer
sudo xcodebuild -runFirstLaunch
Enter fullscreen mode Exit fullscreen mode
  • Accept the Apple licensing agreement: 
sudo xcodebuild -license accept
Enter fullscreen mode Exit fullscreen mode

Step 5: Install CocoaPods

Manage your native iOS dependencies cleanly. Install via Ruby gems or Homebrew:

brew install cocoapods
Enter fullscreen mode Exit fullscreen mode

Verify it runs:

pod --version
Enter fullscreen mode Exit fullscreen mode

Step 6: Install Android Studio (For Android Target Development)

Download and run Android Studio. During the initial setup wizard, ensure you check the boxes to download:

  • Android SDK & Android SDK Platform Tools
  • Android Emulator & Android SDK Command-line Tools

Step 7: Configure Android SDK

  • Open Android Studio, navigate to Settings → Android SDK.
  • Under SDK Tools, explicitly verify Android SDK Command-line Tools is checked and installed.
  • Open your terminal and accept the developer licenses: 
flutter doctor --android-licenses
Enter fullscreen mode Exit fullscreen mode

Press y to accept all incoming prompt licenses.

The Magic Check (Flutter Doctor)

Now for the ultimate tool in the Flutter ecosystem. Close and reopen your terminal or command prompt, and run:

flutter doctor
Enter fullscreen mode Exit fullscreen mode

This command analyzes your system and prints a report. Don't panic if you see red [X] marks!

  • If it asks for Android Studio/SDK: Download Android Studio, run it once, and let it install the default SDK components.
  • If you are on Mac and want iOS support: Download Xcode from the Mac App Store.

Once you get green checkmarks next to Flutter and VS Code, you are officially ready to build!

Create Your First Project

Want to test it instantly? Open VS Code, press Ctrl+Shift+P (or Cmd+Shift+P), type "Flutter: New Project", select Application, and watch the magic happen.

Happy Coding!

Top comments (0)