Yapay zekadan makale özeti
- Kısa
- Ayrıntılı
- Bu video, Flutter ile sıfırdan mobil uygulama geliştirme eğitim serisinin üçüncü bölümüdür. Eğitmen, Flutter'ın temel komutlarını, widget yapısını ve uygulama geliştirme sürecini anlatmaktadır.
- Video, Flutter'ın temel komutları (flutter create, flutter clean, flutter build vb.) ile başlayıp, ilk Flutter projesinin nasıl oluşturulacağını adım adım göstermektedir. Ardından widget yapısı, stateless ve stateful widget'lar, MaterialApp, Scaffold, AppBar, Center, FloatingActionButton gibi temel widget'lar detaylı olarak anlatılmaktadır. Son bölümde ise hot reload özelliği ve Flutter dökümantasyonlarının kullanımı gösterilmektedir.
- Eğitim serisi, Flutter'ın Dart kodlarını farklı platformlara derleme özelliğini, widget ağacı yapısını, emülatörde uygulama çalıştırma adımlarını ve debug modu kullanımını da içermektedir. Video, Flutter uygulamalarında widget yapısını anlamak ve ilk Flutter projesini geliştirmek isteyenler için kapsamlı bir kaynak niteliğindedir.
- 00:00Flutter Eğitim Serisi Tanıtımı
- Flutter ile sıfırdan mobil uygulama geliştirme eğitim serisinin üçüncü videosu, Flutter'ın komutlarını inceleyerek ilk proje oluşturma ve çalışma mantığına odaklanıyor.
- Video, Flutter projesinin klasör yapısına aşina olmayı, iOS, Android ve macOS buildlerinin hangi klasörlerden alınacağını anlatıyor.
- Örnek proje üzerinden Flutter'ın mimarisine alışma, widget'ları inceleme, emülatörde çalıştırma ve hot reload özelliği gösterilecek.
- 00:50Flutter Komutları
- Flutter komutları için terminal açılıp, "flutter" yazarak kullanılacak temel komutlar görüntülenebilir.
- Flutter create komutu ile yeni bir proje oluşturulurken, proje ismi büyük harf içermemeli, Türkçe karakter kullanılmamalı ve boşluk yerine alt tire kullanılmalıdır.
- Flutter ve Dart'ın kendi paketlerinin isimlerini kullanmamak gerekir, aksi halde karmaşa yaşanabilir.
- 03:57Proje Oluşturma ve Klasör Yapısı
- Flutter create komutu ile proje oluşturulduktan sonra, VS Code ile açmak için sağ tıklayıp "Kod ile aç" seçeneği kullanılabilir.
- Flutter, yazılan Dart kodunu farklı platformlara (Android, Linux, macOS, Web, Windows) derleme özelliğine sahiptir.
- Test klasörü, unit testlerin yazılacağı alandır ve Android klasöründe Gradle projesi bilgileri bulunur.
- 06:16Platform Spesifik Klasörler
- iOS build alabilmek için bir Mac sahibi olmak gerekir çünkü Windows'ta Xcode programı bulunmaz.
- Linux ve macOS klasörleri, yazılan kodun bu platformlara uygun hale getirilmesi için kullanılır.
- Windows için de Flutter ile desktop uygulamalar geliştirilebilir.
- 07:10Proje Dosyaları ve Kod Yapısı
- Pubspec.yaml dosyası, paketlerin yüklenmesi, resimlerin ve fontların projeye dahil edilmesi için kullanılır.
- lib klasöründe bulunan main.dart dosyası, Flutter kodlarının başladığı yerdir.
- Void main() metodu uygulamanın giriş noktasıdır ve runApp(MyApp()) ile uygulama başlatılır.
- 09:28Flutter'da Widget Yapısı
- Stateless ve stateful widget'ların farkı, projede yüzeysel bilgi olarak bilinmesi yeterlidir.
- Build metodu, widget'ın oluşturulduğu temel metottur ve override edilmiştir.
- Flutter ile kodlama yaparken override gibi keywordlerin çok az kullanılacağı, yüklenen snitler ve extensionların bunları halledeceği belirtilmiştir.
- 10:43Build Metodu ve Return Type
- Build metodu widget tipinde bir değer döndürür ve bu widget, uygulamanın giriş noktasıdır.
- Metodun parametre olarak context alması, ileride öğrenilecek bir konudur.
- Build metodu sadece tek bir Material App widget'ı döndürür.
- 12:34Material App ve Özellikleri
- Widget'lar vücut ismi, özellikler (properties) ve değerlerden oluşur.
- Material App'in içerisinde title, theme ve home gibi farklı özellikler bulunur.
- Bazı özellikler zorunlu olabilirken, bazıları zorunlu değildir.
- 13:47Widget Yapısının İçiçe Yapısı
- Widget yapısı iç içe ağaç yapısı olarak düşünülebilir.
- Bir widget'ın içerisinde özellikler bulunabilir ve bu özelliklerin içinde de başka widget'lar olabilir.
- MyApp widget'ının içerisinde home özelliği, MyHomePage widget'ını işaret eder.
- 15:23Stateful Widget Yapısı
- MyHomePage widget'ı stateful widget'tır ve state'lerin tutulduğu yerdir.
- Stateful widget'larda state değişkenleri ve arka plan işlemleri yapılır.
- Private değişkenler sınıf dışından erişilemezken, public değişkenler erişilebilirdir.
- 17:26SetState ve Build Metodu
- SetState metodu, widget içerisindeki state'leri değiştirmek için kullanılır.
- SetState parametre olarak bir fonksiyon alır ve fonksiyon içerisinde işlemler gerçekleştirilir.
- Build metodu içerisinde Scaffold widget'ı döndürülür ve Scaffold widget'ı appbar, body ve floating action button gibi farklı özellikler içerir.
- 19:24AppBar ve Özellikleri
- AppBar, uygulamanın üst ortasında bulunan ve yatay olarak ekranı kapsayan bir bardır; genellikle geri gitme tuşu, profil resmi, menü simgesi ve uygulama başlığı içerir.
- AppBar widget'ı background color ve title olmak üzere iki property alır; background color için Theme.of(context).colorScheme kullanılır.
- Title property'si Text widget'ı içerir ve MyHomePage widget'ının title propertisini kullanır.
- 21:31Body ve Floating Action Button
- Body içinde Center widget bulunur ve ekranı ortalamak için kullanılır.
- Center widget'ın child property'si vardır ve bu widget'ın içinde gösterilecek widget'ı belirtir.
- Floating Action Button widget'ı on press, tool tip ve child olmak üzere üç farklı property içerir.
- 23:05Flutter Uygulamasını Emülatörde Çalıştırma
- Flutter uygulamasını emülatörde çalıştırmak için Android Studio'dan Virtual Device Manager'a gidip emülatörü başlatılır.
- VS Code'da sağ alt köşedeki emülatör seçeneğinden uygulamayı debug veya debug olmayan şekilde başlatabilirsiniz.
- F5 tuşu start debugging seçeneği ile aynı işlevi görür ve uygulamayı çalıştırır.
- 26:50Emülatörde Uygulama Görüntüsü
- Emülatörde uygulama çalıştığında, title, floating action button ve center widget'ın ekranı ortalaması görülebilir.
- Widget Inspector tool ile uygulamanın widget yapısını inceleyebilirsiniz.
- Ekranın sol tarafında counter değeri görüntülenir ve her widget yeşil renkte bir kare ile belirtilir.
- 28:36Flutter'da Ağaç Yapısı ve Widget Kavramı
- Flutter'da widget'lar bir ağaç yapısı oluşturur; scaffold, app bar, text gibi widget'lar iç içe girmektedir.
- Ağaç yapısında root (kök) widget olarak scaffold bulunur ve içinde app bar, text gibi alt widget'lar yer alır.
- Center widget'ın içinde column widget bulunur ve column widget'ın içinde iki adet text widget yer alır.
- 29:53Hot Reload Özellikleri
- Flutter'da projeyi F5 ile başlatıp, kod üzerinde değişiklik yaparak Ctrl+S ile kaydettikten sonra değişiklikler anında emülatöre yansır.
- Hot reload özelliği kod üzerinde yapılan değişiklikleri saniyelerde görmek ve geliştirme sürecini hızlandırmak için kullanılır.
- Floating action button'a tıklandığında counter değeri artar, bu set state ile gerçekleşir ve on press özelliği ile tetiklenir.
- 31:19Widget Özellikleri ve Performans İpuçları
- Widget title özelliği app bar içerisinde kullanılır ve değiştirilebilir.
- Sabit değerler için widget kullanmak yerine direkt değer yazmak performans açısından daha iyidir.
- Sabit değerler için widget kullanıldığında altta mavi çizgi görünür ve "use const constructor for better performance" uyarısı verilir.
- 32:33Flutter Dokümantasyonu
- Flutter'da her widget için detaylı dokümantasyon bulunmaktadır ve kolayca erişilebilir.
- Dokümantasyonlarda widget'ların özelliklerinin listesi, örnekler ve uygulamalar bulunmaktadır.
- Flutter dokümantasyonu (api.flutter.dev) adresini kaydetmek ve merak edilen widget'ları incelemek önemlidir.
- 34:04Dersin Özeti
- Bu derste Flutter ile ilk proje oluşturuldu ve Flutter komutları gözden geçirildi.
- Klasör yapısı, geliştirme yapılıp uygulama kodlarının yazıldığı yerler anlatıldı.
- Hot reload özelliği ve Flutter dokümantasyonları incelendi.