Flutter auf Windows, Mac oder Linux installieren

Flutter auf Windows, Mac oder Linux installieren

Du möchtest schnell Flutter installiert bekommen und mit der App Entwicklung starten? Ich zeige dir, wie man Flutter und seine Entwicklungsumgebung auf Windows, MacOS oder Linux ohne viel Aufwand sehr schnell und vor allem sehr einfach installieren kann.

Diese Anleitung besteht aus mehreren Teilen:

1. Installation von Flutter über Community Packages

2. Installation der IDE (VS Code, Android Studio und evtl. Xcode)

3. Überprüfung, ob alle Installationen vollständig sind und funktionieren

4. Erstes Flutter Hello World Projekt

5. Nächste Schritte

Flutter über das Community Package installieren

Wer sich schon einmal durch das Getting Started auf flutter.dev gekämpft hat, weiß, dass das Installieren von Flutter und seinen Abhängigkeiten alles andere als einfach ist. Zum Glück war die Flutter Community fleißig und hat sich für die komplexe Installation etwas ausgedacht. Drei Packages - für jedes Betriebssystem eines - die das Installieren von Flutter zu einem Kinderspiel machen.

Installation von Flutter für Windows

Für Windows brauchen wir den Packagemanager von Chocolately. Für die Installation von Chocolately einfach durch die Installationsanleitung hangeln. Wenn das erledigt ist, gibst du in der Konsole folgenden Befehl ein:

choco install flutter

Nach wenigen Minuten ist Flutter vollständig installiert. Es kann jedoch sein, dass nicht die aktuellste Version installiert wurde. Um dies zu beheben, gib einfach folgenden Befehl ein:

flutter upgrade

Installation von Flutter für Mac

Der erste Schritt ist hier den Packagemanager Homebrew zu installieren. Gib hierfür einfach folgenden Befehl in deine Konsole ein:

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

Wenn das erledigt ist, kannst du ganz einfach mit folgendem Befehl Flutter installieren:

brew install --cask flutter

Und schon ist Flutter installiert und kann verwendet werden. Falls du direkt prüfen möchtest, ob die Version aktuell ist, einfach noch folgenden Befehl absetzen:

flutter upgrade

Installation von Flutter für Linux

Für Linux brauchen wir den Packagemanager von Snapcraft. Dieser kann hier heruntergeladen werden: Snapcraft herunterladen. Sobald dies erledigt ist, gib einfach in der Konsole Folgendes ein:

sudo snap install flutter --classic 
Und ta-da! Flutter ist installiert. Auch hier kannst du den Befehl flutter doctor eingeben, um zu überprüfen, ob alles geklappt hat und um zu checken, was dir für die Entwicklung noch fehlt.

Installation der IDE (VS Code, Android Studio und evtl. Xcode)

Wenn Flutter installiert ist, brauchen wir noch eine Entwicklungsumgebung, mit der wir bei der Entwicklung mit Dart und Flutter Widgets bestmöglich unterstützt werden. Wenn du es dir sehr einfach machen willst, kannst du nur Chrome installieren und mit der Web Version von Flutter starten. Da siehst du deine App zwar nur im Web, aber es geht am schnellsten. Wenn du die Entwicklung auf einer richtigen App-Simulation sehen willst, brauchst du Folgendes:

  • Visual Studio Code
  • Android Studio
  • Xcode und Cocoapods

Visual Studio Code

Mit Visual Studio Code bekommst du einen sehr leistungsstarken und absolut leichtgewichtigen Code Editor der von Flutter selbst unterstützt wird. Visual Studio Code ist auch für alle Plattformen verfügbar. Dafür musst du einfach nur über die Webseite herunterladen und installieren.

Um mit VS Code einfach und schnell entwickeln zu können, solltest du dir direkt noch die Flutter Extension und Dart Extension hinzufügen. Dazu einfach links im VS Code Menü auf “Extensions” oder “Erweiterungen” klicken und nach “Flutter” und “Dart” suchen. Alternativ einfach ein Flutter Projekt im VS Code öffnen und dann schlägt dir der Editor selbst diese Packages für die Installation vor.

Android Studio herunterladen

Du benötigst das Android Studio in jedem Fall, um dir bequem über den AVD Manager die verschiedenen Android SDKs für den Android Emulator zu installieren. Das Android Studio funktioniert auf einem Mac, auf Windows und auch unter Linux und hier kannst du es downloaden: Android Studio. Nach der Installation musst du in Android Studio über ‘More Actions’ in den ‘SDK Manager’. Dieser fügt die eigentlichen Geräte hinzu, die du für die Entwicklung brauchst. Hier eine kleine visuelle Ansicht für die notwendigen Schritte:

Unter dem Reiter ‘SDK Platforms’ kannst du verschiedene Android Versionen installieren.

Unter dem Reiter ‘SDK Tools’ musst du zusätzlich ‘Android SDK Command-line Tools’ installieren.

Die Installation von Android Studio ist hiermit abgeschlossen.

Xcode und Cocoapods

Für die Entwicklung von iOS Apps benötigst du ebenfalls noch Xcode, welches du einfach aus dem App Store herunterladen kannst. Dieser Vorgang wird einige Zeit in Anspruch nehmen, meistens mehrere Stunden.
Wenn du die Installation abgeschlossen hast, musst du noch CocoaPods installieren. CocoaPods ist ein Dependency Manager für iOS, der die Entwicklung erleichtert. Um diese herunterzuladen, gib hierfür einfach folgenden Befehl in die Konsole ein (auch hier solltest du vorher Homebrew installiert haben):

brew install cocoapods

Nach der installation nur noch diese beiden Befehle eingeben und Xcode ist damit startklar:

sudo xcode-select --switch /Applications/Xcode.app/Contents/
sudo xcodebuild -runFirstLaunch

Installation von Flutter und der Entwicklungsumgebung prüfen

Der schnellste Weg zu prüfen, ob Flutter korrekt installiert und alle Pfad-Variablen korrekt gesetzt wurden, ist der Befehl:

flutter --version
Wenn dieser Befehl aufgerufen werden kann, ist der erste Erfolg zu sehen:

Falls du eine ältere Version von Flutter installiert hast, wirst du Folgendes in der Console sehen:

Wenn er den Befehl flutter nicht erkennt, ist wohl etwas schief gelaufen. Zumindest wird die Flutter Runtime nicht gefunden. Falls die Meldung “A new version of Flutter is available!” zu sehen ist, dann direkt den Befehl für das Update hinterherschieben:

flutter upgrade

Flutter Doctor

Um zu überprüfen, ob die Installation wirklich vollständig funktioniert hat, bringt Flutter seinen eigenen Doctor mit. Dazu folgenden Befehl ausführen:

flutter doctor

Wenn Flutter und die IDE erfolgreich installiert wurde, sollte überall ein grünes Häkchen sein. Wenn dies nicht der Fall ist, schaue ob du die richtige Version hast oder wiederhole bei Bedarf die Installation.

Und schon bist du startklar.

Erstes Flutter Hello World Projekt

Nun hält dich auch nichts mehr davon ab das erste Flutter Projekt zu erstellen und anzusehen. Dazu das mitgelieferte erste Hello World Projekt erstellen mit dem folgenden Befehl:

flutter create hello_world_flutter

In der Console solltest du dann folgende Ausgabe sehen:

Nach dem Generieren des Codes mit den folgenden Befehlen das Projekt starten:

cd hello_world_flutter
flutter run

Wenn der iOS Simulator oder der Android Emulator nicht verfügbar sind, sollten mindestens die macOS/Windows oder Chrome zur Auswahl als Device zur Verfügung stehen:

Ich habe jetzt den Chrome gewählt und das Flutter Counter Projekt ist in meinem Browser zu sehen:

So, nun steht dem Coden nichts mehr im Weg.

Nächste Schritte

Nun ist Flutter installiert und es juckt in den Händen die erste App zu schreiben. Neben den unzähligen Tutorials kann ich dir folgende beide Schritte empfehlen:

Flutter Codelab

Im Flutter Codelab wirst du an die ersten Widgets herangeführt und hast nach dem Tutorial deine erste kleine App am Laufen.

Flutter Schulung

Wenn du einen schnellen und intensiven Start in die App-Entwicklung von Flutter haben möchtest, kann ich dir auch unsere Flutter Grundlagen Schulung empfehlen. Ich selbst bin einer der Trainer in der Schulung und wir bieten diese über flutter.de an: https://flutter.de/schulung/flutter-schulung.html

Ich wünsche viel Spaß bei der App-Entwicklung 🥳

Werde zum Flutter-Experten

Lerne Flutter von den Profis – persönlich und vor Ort. Mit unseren Flutter-Schulungen kommst du auf nächste Entwickler-Level.

Flutter Schulung entdecken