Bạn đã sẵn sàng để viết những dòng code đầu tiên? Việc cài đặt môi trường Flutter có thể hơi “khoai” với người mới vì nó liên quan đến cả Android SDK và iOS XCode.
Nhưng đừng lo, bài viết này sẽ hướng dẫn bạn từng bước một (Step-by-step) để cài đặt thành công Flutter trên Windows và MacOS mà không gặp lỗi.
1. Yêu cầu hệ thống
- Hệ điều hành: Windows 10/11 hoặc MacOS (Khuyên dùng M1/M2 để build cho nhanh).
- RAM: Tối thiểu 8GB (Tốt nhất là 16GB nếu chạy máy ảo Android).
- Ổ cứng: Trống ít nhất 10GB.
2. Các bước cài đặt trên Windows
Bước 1: Tải Flutter SDK
- Truy cập trang chủ:
flutter.dev -> Docs -> Get Started -> Windows.
- Tải file zip
flutter_windows_x.x.x-stable.zip.
- Giải nén vào ổ C (Ví dụ:
C:\src\flutter). Lưu ý: Không giải nén vào Program Files vì có thể bị lỗi quyền admin.
Bước 2: Cập nhật biến môi trường (PATH)
- Gõ “env” vào thanh tìm kiếm Windows -> Chọn “Edit the system environment variables”.
- Chọn “Environment Variables” -> Tìm dòng
Path trong mục “User variables” -> Edit.
- Thêm đường dẫn:
C:\src\flutter\bin.
Bước 3: Kiểm tra cài đặt
Mở CMD hoặc PowerShell và gõ:
Lệnh này sẽ kiểm tra xem máy bạn còn thiếu gì (Ví dụ: Android Studio, Chrome…) và báo đỏ. Cứ bình tĩnh, thiếu gì cài nấy.
3. Cài đặt các công cụ hỗ trợ (IDE)
- Visual Studio Code (VS Code): Nhẹ, mượt, nhiều Extension hay. Cài thêm Extension “Flutter” và “Dart”.
- Android Studio: Nặng hơn nhưng đầy đủ công cụ máy ảo (Emulator). Bắt buộc phải cài để lấy Android SDK.
4. Chạy ứng dụng “Hello World” đầu tiên
- Mở VS Code -> Nhấn
Ctrl + Shift + P -> Gõ Flutter: New Project -> Application.
- Chọn thư mục lưu code và đặt tên project (Ví dụ:
my_first_app).
- Chờ Flutter tạo file xong, nhấn F5 để chạy.
Nếu bạn thấy màn hình điện thoại hiện lên với số đếm tăng dần khi bấm nút (+), chúc mừng bạn! Bạn đã chính thức trở thành một Flutter Developer.
Ứng dụng mẫu nhìn khá đơn giản đúng không? Để làm nó đẹp hơn, bạn cần hiểu về Widget – khái niệm cốt lõi của Flutter. Mọi thứ trong Flutter đều là Widget.
Bài tiếp theo sẽ giải thích Widget là gì và cách sử dụng các Widget cơ bản như Container, Row, Column, Image…
👉 Widget trong Flutter – Hướng dẫn đầy đủ cho người mới
Đón xem bài tiếp theo: Widget trong Flutter – Hướng dẫn đầy đủ cho người mới!**