I tried learning Flutter multiple times and failed—until I used ChatGPT as my guide.
Instead of jumping between tutorials, I followed a simple setup process and built my first working Flutter app in one day. This article shares the exact steps, from installing Flutter and adding it to PATH to creating a real app that actually runs.
If you’re new to Flutter, the hardest part is often getting started—installing Flutter, adding it to PATH, and creating your very first app. This guide walks you through everything, step by step, with a working Flutter app example at the end.
No assumptions. No skipped steps.
Step 1: Download the Flutter SDK
- Visit the official Flutter website
👉 https://flutter.dev/docs/get-started/install - Download Flutter for your operating system:
- Windows → ZIP file
- macOS → ZIP file
- Linux → TAR.XZ file
- Extract the file.
📁 Recommended locations:
- Windows:
C:\flutter - macOS:
/Users/yourname/flutter - Linux:
/home/yourname/flutter
⚠️ Avoid installing Flutter inside Program Files (Windows).
Step 2: Add Flutter to PATH
Adding Flutter to PATH allows you to run Flutter commands from anywhere.
✅ Windows: Add Flutter to PATH
- Right-click This PC → Properties
- Click Advanced system settings
- Click Environment Variables
- Under System variables, select
Path - Click Edit → New
- Add:
C:\flutter\bin - Click OK and restart Command Prompt
Verify:
flutter --version
✅ macOS: Add Flutter to PATH
- Open Terminal
- Edit your shell config:
nano ~/.zshrc - Add:
export PATH="$PATH:$HOME/flutter/bin" - Save and reload:
source ~/.zshrc
Verify:
flutter --version
✅ Linux: Add Flutter to PATH
- Open Terminal
- Edit
.bashrc:nano ~/.bashrc - Add:
export PATH="$PATH:$HOME/flutter/bin" - Reload:
source ~/.bashrc
Verify:
flutter --version
Step 3: Run Flutter Doctor
Flutter includes a diagnostic tool:
flutter doctor
This checks:
- Flutter SDK
- Dart
- Android toolchain
- Connected devices
Fix any issues marked in red by following Flutter’s suggestions.
Step 4: Install Android Studio
- Download Android Studio
👉 https://developer.android.com/studio - During installation, make sure these are selected:
- Android SDK
- Android SDK Platform Tools
- Android Emulator
- Open Android Studio → Plugins
- Install Flutter plugin (Dart installs automatically)
Step 5: Set Up an Emulator or Device
Option 1: Android Emulator
- Open Android Studio
- Device Manager → Create Virtual Device
- Start emulator
Option 2: Physical Device
- Enable Developer Options
- Enable USB Debugging
- Connect phone via USB
Check devices:
flutter devices
Step 6: Create Your First Flutter Application (Example Included)
Now comes the exciting part—creating your first Flutter app.
Create a New Flutter Project
Run:
flutter create first_flutter_app
cd first_flutter_app
flutter run
You should see a default Flutter app running 🎉
Step 7: Build a Simple Example App (Counter App)
Let’s modify the app into a simple counter application.
What this app does:
- Displays a counter value
- Increases the value when a button is pressed
Replace lib/main.dart with This Code
import 'package:flutter/material.dart';
void main() {
runApp(const MyApp());
}
class MyApp extends StatelessWidget {
const MyApp({super.key});
@override
Widget build(BuildContext context) {
return const MaterialApp(
debugShowCheckedModeBanner: false,
home: CounterScreen(),
);
}
}
class CounterScreen extends StatefulWidget {
const CounterScreen({super.key});
@override
State<CounterScreen> createState() => _CounterScreenState();
}
class _CounterScreenState extends State<CounterScreen> {
int counter = 0;
void incrementCounter() {
setState(() {
counter++;
});
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: const Text('My First Flutter App'),
),
body: Center(
child: Text(
'Counter Value: $counter',
style: const TextStyle(fontSize: 24),
),
),
floatingActionButton: FloatingActionButton(
onPressed: incrementCounter,
child: const Icon(Icons.add),
),
);
}
}
Step 8: Run and Test the App
Save the file and run:
flutter run
Press the + button—the counter increases 🎯
You’ve successfully built your first Flutter app!
Understanding What You Just Built
Key concepts you learned:
MaterialApp→ App wrapperScaffold→ Screen structureStatefulWidget→ Handles changing UIsetState()→ Updates the UIFloatingActionButton→ User interaction
How ChatGPT Helps During This Process
You can ask ChatGPT:
- “Why is my Flutter command not working?”
- “Explain StatefulWidget simply”
- “Fix my flutter doctor error”
- “Add dark mode to this app”
ChatGPT acts like a real-time Flutter mentor.
Final Thoughts
By correctly:
- Installing Flutter
- Adding it to PATH
- Running Flutter Doctor
- Creating your first app
—you’ve completed the hardest part of Flutter.
From here, everything gets easier 🚀