Flutter Windows Kurulumu

Colin's Tech
4 min readApr 18, 2023

--

Merhaba! Bu makalemizde Flutter framework’ünü Windows bilgisayarınıza nasıl kuracağınızı, yeni bir flutter projesi nasıl oluşturacağınızı ve VS Code editöründe, Android Studio emülatörleri içerisinde bu projeyi nasıl çalıştıracağınızı göstereceğiz.

Makalemizde kurulumlarına değinmeyeceğimiz fakat bilgisayarınızda kurulu olması gereken git versiyon kontrol sistemi ve VS Code editörünü (eğer zaten kurulu değil ise) aşağıdaki linklerden indirerek kurabilirsiniz.

Flutter

İlk olarak C: dizini içerisinde src adında bir klasör oluşturalım. (Gerekli Flutter dosyalarının yer alacağı dizin)

git clone https://github.com/flutter/flutter.git -b stable

Şimdi yeni bir komut istemi (command prompt) açarak, oluşturmuş olduğumuz src dizinine yönelelim (cd komutunu kullanarak yapabiliriz). Bu dizin içerisinde, yukarıdaki komutu kullanarak, gerekli Flutter dosyalarını indirelim.

İndirme tamamlandıktan sonra src klasörü içerisine indirilmiş olan flutter klasörüne girelim ve flutter_console.bat dosyasını çalıştıralım. Ekranda açılan konsola “flutter doctor” yazalım. Bu komut, Flutter’ı çalıştırabilmemiz için gerekli diğer çeşitli dosyaları bilgisayarımıza indirecektir.

Sıradaki adımımız, bilgisayarımıza ortam değişkeni eklemek olacak. Windows Başlat menüsünde environment variables (ortam değişkenleri) şeklinde aratalım ve gelen sonuçlardan Edit the system environment variables (Sistem ortam değişkenlerini düzenle) seçeneğine tıklayalım. Açılan pencerede Environment Variables… (Ortam Değişkenleri…) butonuna tıklayalım. Yeni pencerede Path değişkenine çift tıklayalım. En son açılan pencerede New (Yeni) butonuna tıklayalım ve “C:\src\flutter\bin” yazalım. OK (Tamam) diyerek pencereleri kapatabiliriz.

Flutter kurulumumuzu tamamladık😊. Şimdi de, flutter uygulamalarımızı geliştirirken kullanacağımız emülatörler için, Android Studio programının kurulumuna göz atalım…

Android Studio

Android Studio web sitesinden Windows uyumlu programı indirelim ve kurulumunu gerçekleştirelim. Daha sonra problem yaşamamak adına, kurulum adımlarında varsayılan seçeneklerle ilerlemenizi tavsiye ederiz.

Sözleşmeleri onaylayarak kurulumu tamamladıktan sonra, Android Studio’yu açalım. More Actions kısmından Virtual Device Manager’ı seçelim.

Açılan ekranda Create device butonuna tıklayalım. Kategori kısmından telefon, tablet, tv gibi kategorileri seçerek içerisinden dilediğiniz cihazı seçebilirsiniz. Biz telefon kategorisi ve boyutları ideal olduğu için Pixel 4 ile ilerleyeceğiz😊.

Daha sonraki adımda bir Android versiyonu seçmemiz ve indirmemiz gerekiyor. Bu kısımda da Tiramisu ile ilerleyeceğiz.

Android versiyonu indirme işlemi tamamlandıktan sonra Next diyerek ilerleyelim. Son olarak emülatörümüze bir isim vererek Android Studio’daki işlemlerimizi tamamlayabiliriz.

VS Code

Flutter uygulamamızı VS Code editöründe çalıştırmak ve kodda değişiklik yaptığımızda uygulamanın yeniden yüklenmesi gibi işlemler için Flutter eklentisini yüklememiz gerekiyor. Bağlılığı bulunduğu için otomatik olarak Dart eklentisini de yükleyecektir.

Gerekli araçların kurulumlarını tamamladığımıza göre yeni bir flutter projesi oluşturalım ve geliştirme ortamımızı hazırlayalım.

Flutter projesi oluşturmak için komut:

flutter create <project_name>

Yeni bir terminal açalım ve my_project isminde yeni bir flutter projesi oluşturalım.

Projemiz oluşturulduktan sonra VS Code içerisinde açalım. Daha sonra aşağıdaki görseldeki adımları takip ederek, uygulamamızın hangi cihaz üzerinde çalışacağını seçebiliriz.

Android Studio’da oluşturduğumuz Pixel 4 cihazımızı seçiyoruz. Bir süre sonra cihazımız açılacak ve hazır hale gelecek.

Son adım olarak uygulamamızı debug modda çalıştırmamız gerekiyor. main.dart dosyası içerisine gelerek, main fonksiyonu üzerinde yer alan Debug seçeneğine tıklayarak uygulamayı başlatabiliriz.

Uygulamayı web modunda çalıştırmak isterseniz, cihaz seçimi kısmından tarayıcı seçerek tekrar debug modda başlatabilirsiniz.

Flutter uygulamamız için geliştirme ortamımız hazır😊.

--

--

Colin's Tech

Colin’s Tech Medium Sayfalarımızda, Colin’s Bilgi Teknolojileri ekibimizi, çalışmalarımızı sizlerle paylaşmayı hedefliyoruz.