1. Tek Kod Tabanı

Flutter, geliştiricilere iOS, Android, Web ve Desktop için uygulamaları tek bir kod tabanıyla yazma olanağı sunar. Bu, geliştirme sürecini hızlandırır ve işleri kolaylaştırır. Maliyetden tasarruf imkanı sağlar. 4 platforma da geliştirme yapacaksanız tek bir developer ile de işlerinizi yapmanız mümkün hale gelir.

Örnek bir “Merhaba Dünya” uygulaması:

import 'package:flutter/material.dart';
 void main() {
   runApp(MyApp());
 }
 class MyApp extends StatelessWidget {
   @override
   Widget build(BuildContext context) {
     return MaterialApp(
       title: 'Merhaba Dünya',
       home: Scaffold(
         appBar: AppBar(
           title: Text('Merhaba Dünya'),
         ),
         body: Center(
           child: Text('Merhaba Dünya!'),
         ),
       ),
     );
   }
 }

2. Hot Reload

Flutter’ın “hot reload” özelliği, geliştiricilerin yapılan değişiklikleri anında görmesini sağlar. Bu, hataların hızlıca bulunmasını ve düzeltilmesini sağlar ve geliştirme sürecini önemli ölçüde hızlandırır.

class MyApp extends StatelessWidget {
   @override
   Widget build(BuildContext context) {
     return MaterialApp(
       title: 'Hot Reload Örneği',
       home: MyHomePage(),
     );
   }
 }
 class MyHomePage extends StatelessWidget {
   @override
   Widget build(BuildContext context) {
     return Scaffold(
       appBar: AppBar(
         title: Text("Hot Reload Örneği"),
       ),
       body: Center(
         child: Text("Değişiklikleri anında görün!"),
       ),
     );
   }
 }

Bu kodu çalıştırın ve "Değişiklikleri anında görün!" metnini değiştirin. Hot Reload özelliği sayesinde uygulamanın durumunu kaybetmeden değişikliği hemen görebilirsiniz.

3. Performans

Flutter, Dart dilinde yazılmıştır ve Dart, Just-In-Time ve Ahead-Of-Time derleme yeteneklerine sahiptir. Bu özellikler, uygulamanın başlangıç süresini hızlandırır ve performansını iyileştirir.

4. Zengin Widget Kütüphanesi

Flutter, kullanıcıların modern ve çekici bir arayüz oluşturmasını sağlayan bir dizi widget sunar. Bu widget’lar hızlı ve kolay bir şekilde uygulamaya entegre edilebilir.

class MyApp extends StatelessWidget {
   @override
   Widget build(BuildContext context) {
     return MaterialApp(
       title: 'Zengin Widgetler',
       home: Scaffold(
         appBar: AppBar(
           title: Text('Zengin Widgetler'),
         ),
         body: Center(
           child: RaisedButton(
             onPressed: () {},
             child: Text('Bir Buton Widgeti'),
           ),
         ),
       ),
     );
   }
 }

Bu kod parçası, basit bir buton widget’ini kullanarak kullanıcıya etkileşimli bir öğe sunar.

Flutter, bu gibi özellikleri sayesinde uygulama geliştirmede yeni bir çağ açmaktadır. Tek kod tabanı, hot reload, yüksek performans ve zengin widget kütüphanesi gibi özellikler, geliştiricilere daha hızlı ve daha etkili uygulamalar oluşturma imkanı sağlar. Üstelik bunu tüm platformlara export yapabilme özelliği ile birleştirerek bize zaman kazandırır. Sadece zaman değil ayrıca tek kod sayesinde ortak bir kalite yakalanmış olur. Tekrar eden kodlar azalır. Tabi ki tek kod ortamında kodunuz yine kaliteli olmak zorunda. Yazdığını flutter uygulamasını kötü yazarsanız sonuç tüm platformlarda kötü olacaktır. Bu yüzden işe başlamadan önce iyi araştırmak, örnekleri incelemek ve gerekirse eğitim almak önemlidir. Bir de şuna deyinmeden geçmemek lazım. Flutter bir client geliştirme aracı. Yani siz kapsamlı bir iş yapıyorsanız sağlam bir backend e de ihtiyaç duyacaksınız. Bunun için ayrı bir detaylı backend makalesi yazacağım.

Flutter’ın son gelişmelerini takip etmek ve tüm bu eşsiz özelliklerini keşfetmek için https://flutter.dev sitesini ziyaret edebilirsiniz. Nasıl kurulur, kullanılır ve son stabil sürümleri nelerdir https://docs.flutter.dev adresinde mevcut. Her stabil sürüm upgrade i ile çok daha iyi hale gelen flutter ı siz de öğrenebilir ve projelerinizde kullanabilirsiniz.

Uzun zamandır bir yazı paylaşmadığımı farkederek genel olarak bir paylaşım yapmak istedim.

Biliyorsunuz eskiden yaptığım paylaşımlarda ios da swift , android de ise java ve kotlin kullanarak native mobil uygulama geliştirme yaptığımızdan ve flutter a geçtiğimizden bahsetmiştim.

Bu serüven devam ediyor ve yeni yapılan uygulamaları flutter da yapıyoruz. Ancak eskiden gelen bazı uygulamalar hala native swift ve java,kotlin de devam ediyor. Büyük uygulamaları flutter a geçirmek kolay değil tabiki ancak sıfırdan yazılan uygulamalarda flutter ın kolaylıklarını çok aramaya başladık.

Son 3 senedir flutter ile uğraştığımızı düşünürsek oldukça deneyimimiz oldu bu konuda. İlk başlarda eski yönteme göre alışması zor olsada bir kere alıştığınızda artık herşey daha hızlı ve kolay oluyor. Hele birde hazırladığınız bir çatı var ise bu iş artık her projede daha kolay hala geliyor.

Flutter ve Getx kütühanesi de bu işi beraber daha da hızlandırıyor.

Sizler için flutter getx örneği hazırladım. Bu örnekde flutter ı çalıştırmayı ve biraz ön bilgisi olanların anlayabileceği sade bir yapı mevcut. İçerisinde bir başlangıç seti mevcut. Nasıl bir çatı kurmalıyız? Hangi kütüphaneleri kullanmalıyız hepsi mevcut.

https://github.com/balabanferhat/FlutterGetXWithNavigation

Ayrıca sayfamdaki diğer flutter örneklerini de inceleyebilirsiniz.

https://github.com/balabanferhat

Bu ortak özellikler şu şekilde sıralanabilir. Elbette daha vardır ama bunlar ilk etapta aklıma gelenler ve önemli olanlar. Bunları hem yazılımcıların hem müşterilerin düşünmesi için yazıyorum. Umarım herkese faydalı olur.

1. Her alanda çalışabilmeli (Mobil uygulama, web uygulaması, backend). Sadece hangisine yoğunlaşır ise onda daha hızlı sonuç elde eder.
2. Konsantrasyonu iyi olmalı. Odaklandığı zaman işi (yada hedeflediği kısmı) bitirebilmeli.
3. Pes etmemeli. Bazen geceler boyu sabahlamak gereksede pes etmeden devam etmeli.
4. Çok iyi araştırmalı. Çözemediği konuları yada daha iyi ne yapabilirim gibi düşünerek araştırma yapmalı. Kendi kendine araştıran ve çözüm üretebilen biri olması çok önemli çünkü her zaman size yardımcı olacak birini bulamazsınız.
5. Temel algoritmaları bilmeli. Günümüzde yazılıma yeni başlayan çoğu kişi algoritma çalışmadan yazılım öğrenmeye kalkıyor. Yazılım dilini öğrensede, zor problemeri algoritmalar kurarak çözemiyor. Önce bir programlama dili seçip (javascript, dart, php, c# gibi) burada algoritma çalışmak çok önemli.
6. Dokümantasyon yapmalı. Hem kendi için hem kendisinden sonra kodlara girecek kişi için bunu yapmalı. Kodun için gelişigüzel yorumlar yazmak yerine düzgün yorumlar yazıp, bir readme dosyası hazırlayarak içine önemli konuları not etmeli (ör: nasıl build alınır , dev ve prod ortamına nasıl deploy edilir vs…)
7. Versiyon kontrolü kullanmalı. Ekip halinde çalışmıyor bile olsa, yedek almak, ileride ben ne yapmıştım diye bakmak ve kodu düzgün teslim etmek için git sistemini biliyor olmalı.
8. Etik olmalı. İşi eksiksiz ve gereken kişiye anlatarak ve dokümantasyonlar ile teslim etmeye özen göstermeli. Açılan bazı hesapları müşteri adına açmalı ve bunlara ait dokümantasyonları işe başlarken tutmaya başlayıp anında müşterisi ile veya işi yaptığı kişi ile paylaşmalı. Kendisine birşey olsa işe ne olacak düşünmeli. Para kazandığı yere ihanet etmemeli, dürüst ve ahlaklı olmalı.
9. Devir alabilmeli. Başkasının yazdığı kodu incelemeyi çoğu yazılımcı sevmez. Kodu inceleyip sonra sorumluluğu üstlenerek yazan kişiden devir alabilmeli. Çoğu kişi maalesef anlamaya çalışmak yerine bu olmamış ben bunu baştan yazayım diyerek hem daha çok kendine iş çıkarma derdinde hem de öncesinde kodu yazan kişiye çamur atarak prim yapma derdinde oluyor. Düzgün devir almayı öğrenmek zorundayız. Bir kere karşınızdaki kişi işten anlamıyor diye bu olmamış demek bence dolandırıcılıktan başka birşey değildir.
10. İyi debug yapabilmeli. Maalesef karşılaştığım çoğu yazılımcı debug yapmayı , kodu takip etmeyi bilmiyor. Yazdığınız kodu her durumu düşünerek debug yapmanız ve nasıl davrandığını incelemeniz gerekiyor.
11. Tasarım gözü iyi olmalı. Tasarımcı olması gerekmiyor ama biraz da zevk olması lazım. Bunun içinde yapılan tasarımları incelemeli , trendleri takip etmeli. Bir iş yaparken ui (arayüz) tarafına özenmeli.

Sizde iyi bir yazılımcı olmak ve bu özelliklerin üstünde durup kendinizi geliştirmek istiyorsanız benimle irtibata geçebilirsiniz.

Bu sene mart ayının başında Flutter için major bir versiyon yayınlandı. Takip edenler hemen görmüştür ama etmeyenler için bu ne anlama geliyor biraz bahsedelim.

Google, Flutter ile hedeflediği tüm cihazlarda çalışabilme özelliğini ve arkada çalışan dart dilini sürekli geliştiriyor.  Android ve ios cihazlarda çalışan native uygulama çıktısı üreten bu altyapıyı uzun zamandır deniyoruz ve store a çıkan başarılı uygulamalar oldu. Performansından oldukça memnun kaldık. Bir native mobil uygulama geliştiricisi olarak yani uzun yıllar ios da objective-c ve swiftt dilinde , android de ise java ve kotlin de kod geliştiren biri olarak, memnun kalmamız bence çok şey ifade ediyor. Flutter ı kullandıkça pratikliğe alışıyorsunuz ve her platform için ayrı kod geliştirme işine geri dönmek istemiyorsunuz. Ortama ısındıkça çıkabilecek hataları daha kolay öngörüyor ve gideriyorsunuz. 

Flutter 2.0 da , iOS, Android, Windows, macOS, ve Linux; ve bunun yanında Chrome, Firefox, Safari, ve Edge de çalışan web deneyimi bizlere sunuluyor. Flutter ayrıca araç içi yazılımlarda, TV lerde, ve akıllı ev cihazlarında da kullanılabiliyor. 

Şimdi büyük sayılabilecek bir çalışan projeyi flutter 1.22.6 dan flutter 2.0 a geçirmeye çalışacağız.

Flutter kullananlar projenin kullandığı kütüphaneleri görünce büyüklüğünü tahmin edebilir.

dependencies:

 flutter:

   sdk: flutter

 flutter_localizations:

   sdk: flutter

 # The following adds the Cupertino Icons font to your application.

 # Use with the CupertinoIcons class for iOS style icons.

 cupertino_icons: ^1.0.0

 curved_navigation_bar: ^0.3.3

 google_fonts: ^1.1.0

 flutter_svg: ^0.19.1

 url_launcher: ^5.5.3

 get: ^3.25.4

 pull_to_refresh: ^1.6.2

 scroll_to_index: ^1.0.6

 http: ^0.12.2

 hive: ^1.4.4+1

 video_player: ^1.0.1

 get_storage: ^1.4.0

 auto_size_text:

 flutter_rating_bar:

 html_unescape: 1.0.1+3

 quiver: ^2.1.3

 image_picker: ^0.6.7+12

 dio: ^3.0.10

 progress_indicators: ^0.1.5

 random_string: ^2.1.0

 scrollable_positioned_list:

 flutter_keyboard_visibility: ^3.2.2

 credit_card: 0.1.6

 visibility_detector: ^0.1.5

 flutter_typeahead:

 flag: ^3.0.5

 syncfusion_flutter_charts: ^18.3.42

 charts_flutter: ^0.9.0

 hive_flutter: ^0.3.1

 #connectivity: ^0.4.9+3 ########### not used anymore , done in restconnecttor- Ferhat

 syncfusion_flutter_datepicker: ^18.3.51-beta

 syncfusion_localizations: ^18.3.44

 syncfusion_flutter_sliders: ^18.3.44-beta

 intl: ^0.16.1

 webview_flutter: ^1.0.5

 rflutter_alert: ^1.1.0

 flutter_datetime_picker: ^1.4.0

 image_cropper: ^1.3.1

 simple_tooltip: ^0.1.16

 dio_http_cache: ^0.2.11

 cached_network_image: ^2.3.3

 flutter_staggered_grid_view: “^0.3.2”

 readmore: ^1.0.1

 camera: ^0.5.8+17

 filesize: ^1.0.4

 video_compress: ^2.1.1

 timer_count_down: ^1.0.4+1

 syncfusion_flutter_gauges: ^18.4.31

 modal_progress_hud: ^0.1.3

 modal_bottom_sheet: ^1.0.0+1

 flutter_html: ^1.2.0

 agora_rtc_engine: ^3.1.3

 agora_rtm: ^0.9.11

 random_color: ^1.0.5

 font_awesome_flutter: 8.8.1

 #wakelock: ^0.2.0+1

 #yoyo_player: ^0.1.0 #video player içindeki eski

 video_thumbnail: ^0.2.5+1

 share: ^0.6.5+4

 permission_handler: ^5.0.1

 flutter_facebook_auth: ^2.0.1

 google_sign_in: 4.5.1

 in_app_purchase: ^0.3.5+1

 apple_sign_in: ^0.1.0

 flutter_auth_buttons: ^0.6.0

 device_info: ^0.4.1+4

 crypto: ^2.1.5

 flutter_cache_manager: ^1.4.2

 package_info: ^0.4.3+4

 swipedetector: ^1.2.0

 onesignal_flutter: ^2.0.0

 flutter_inappwebview: ^4.0.0+4

dev_dependencies:

 flutter_test:

   sdk: flutter

 flutter_launcher_icons: “^0.8.0”

flutter channel stable

ile stable channel a geçebillirsiniz değilseniz.  Flutter 2.0 dev branch den stable a aktarıldı. 

flutter upgrade

komutu ile stable channel da iken upgrade başlatarak işlemin bitmesini bekliyoruz.

Upgrade tamamlanınca bize şu şekilde rapor veriyor

Flutter 2.0.4 • channel stable • https://github.com/flutter/flutter.git

Framework • revision b1395592de (5 days ago) • 2021-04-01 14:25:01 -0700

Engine • revision 2dce47073a

Tools • Dart 2.12.2

Running flutter doctor…

Doctor summary (to see all details, run flutter doctor -v):

[✓] Flutter (Channel stable, 2.0.4, on Mac OS X 10.15.7 19H2 darwin-x64, locale en-TR)

[✓] Android toolchain – develop for Android devices (Android SDK version 30.0.2)

[✓] Xcode – develop for iOS and macOS

[✓] Chrome – develop for the web

[✓] Android Studio (version 4.1)

[✓] VS Code (version 1.55.0)

[✓] Connected device (2 available)

Şu  ana kadar herşey yolunda gibi ama ufak projelerde geçerken bazı paketlerin uyumsuz olduğunu görüp yerine başka paketler bulmak zorunda kaldığımızdan bu projede başımıza gelebilecekleri azçok tahmin edebiliyorum.

Paketleri otomatik upgrade yapabilirmiyiz deniyoruz.

flutter pub upgrade

Resolving dependencies…

Because abc_app depends on flutter_localizations any from sdk which depends on intl 0.17.0, intl 0.17.0 is required.

So, because abc_app depends on intl ^0.16.1, version solving failed.

pub finished with exit code 1

Tabiki işe yaramadı. Otomatik geçişler genelde işe yaramazlar ve uğraşmak zorunda kalırsınız.

Projede internilization kütüphanesi intl 0.16.1 i kulllanıyormuş ilk patlayan yer burası oldu.

intl: ^0.16.1

0.17.0 en azından olmalı diyor. Değiştirip kaydediyoruz. 

Sonra tekrar pub upgrade yapınca hatamız değişiyor.

Because abc_app depends on charts_flutter ^0.9.0 which depends on intl >=0.15.2 <0.17.0, intl >=0.15.2 <0.17.0 is required.

So, because abc_app depends on intl ^0.17.0, version solving failed.

Burada bize charts_flutter 0.17.0 ı beğenmedi daha düşük kullanmamız gerektiğini söylüyor. Tabiki öncekine dönmeyeceğiz burada charts_fluttter son versiyonu neymiş ona bakacağız.

Biz

charts_flutter: ^0.9.0

kullanıyorduk. 0.10.0 çıkmış ona geçirip tekrar deniyoruz.

Ve bi anda pub upgrade bize bir rapor sunuyor.

Resolving dependencies…

> _fe_analyzer_shared 14.0.0 (was 12.0.0) (19.0.0 available)

> agora_rtc_engine 3.3.2 (was 3.2.1)

  agora_rtm 0.9.14

> analyzer 0.41.2 (was 0.40.6) (1.3.0 available)

  apple_sign_in 0.1.0

  archive 2.0.13 (3.1.2 available)

  args 1.6.0 (2.0.0 available)

> async 2.5.0 (was 2.5.0-nullsafety.1)

  auto_size_text 2.1.0

> boolean_selector 2.1.0 (was 2.1.0-nullsafety.1)

> build 1.6.2 (was 1.5.1) (2.0.0 available)

> build_config 0.4.7 (was 0.4.3)

  cached_network_image 2.3.3 (3.0.0 available)

  camera 0.5.8+17 (0.8.1 available)

> characters 1.1.0 (was 1.1.0-nullsafety.3)

> charcode 1.2.0 (was 1.2.0-nullsafety.1)

> charts_common 0.10.0 (was 0.9.0)

> charts_flutter 0.10.0 (was 0.9.0)

> checked_yaml 1.0.4 (was 1.0.2) (2.0.1 available)

  chewie 0.12.2 (1.0.0 available)

  chewie_audio 1.1.2 (1.2.0 available)

> cli_util 0.3.0 (was 0.2.0)

> clock 1.1.0 (was 1.1.0-nullsafety.1)

> collection 1.15.0 (was 1.15.0-nullsafety.3)

  convert 2.1.1 (3.0.0 available)

  credit_card 0.1.6 (0.1.8 available)

  crypto 2.1.5 (3.0.1 available)

> css_colors 1.1.0 (was 1.0.2)

  csslib 0.16.2 (0.17.0 available)

> cupertino_icons 1.0.2 (was 1.0.0)

> curved_navigation_bar 0.3.7 (was 0.3.4)

> dart_style 1.3.12 (was 1.3.10) (2.0.0 available)

  device_info 0.4.2+10 (2.0.0 available)

  device_info_platform_interface 1.0.1 (2.0.1 available)

  dio 3.0.10 (4.0.0 available)

  dio_http_cache 0.2.11

> fake_async 1.2.0 (was 1.2.0-nullsafety.1)

> ffi 1.0.0 (was 0.1.3)

> file 6.1.0 (was 5.2.1)

  filesize 1.0.4

> flag 3.2.2 (was 3.1.0)

  flutter 0.0.0 from sdk flutter

  flutter_auth_buttons 0.6.0 (discontinued)

  flutter_blurhash 0.5.0 (0.6.0 available)

  flutter_cache_manager 1.4.2 (3.0.1 available)

> flutter_datetime_picker 1.5.0 (was 1.4.0)

> flutter_facebook_auth 2.0.2+1 (was 2.0.1) (3.3.2 available)

  flutter_facebook_auth_platform_interface 1.0.1 (2.4.0 available)

  flutter_facebook_auth_web 1.0.6 (2.4.1 available)

  flutter_html 1.2.0 (1.3.0 available)

  flutter_inappwebview 4.0.0+4 (5.3.1+1 available)

> flutter_keyboard_visibility 3.3.0 (was 3.2.2) (5.0.0 available)

  flutter_launcher_icons 0.8.1 (0.9.0 available)

  flutter_layout_grid 0.10.5 (1.0.1 available)

  flutter_localizations 0.0.0 from sdk flutter

  flutter_plugin_android_lifecycle 1.0.11 (2.0.1 available)

> flutter_rating_bar 4.0.0 (was 3.0.1+1)

> flutter_staggered_grid_view 0.3.4 (was 0.3.2)

> flutter_svg 0.19.3 (was 0.19.1)

  flutter_test 0.0.0 from sdk flutter

  flutter_typeahead 1.8.8 (3.1.1 available)

  flutter_web_plugins 0.0.0 from sdk flutter

  font_awesome_flutter 8.8.1 (9.0.0 available)

> get 3.26.0 (was 3.25.4) (4.1.3 available)

  get_storage 1.4.0 (2.0.2 available)

> glob 2.0.1 (was 1.2.0)

> google_fonts 1.1.2 (was 1.1.0) (2.0.0 available)

  google_sign_in 4.5.1 (5.0.1 available)

  google_sign_in_platform_interface 1.1.2 (2.0.1 available)

  google_sign_in_web 0.9.2 (0.10.0 available)

  hive 1.4.4+1 (2.0.2 available)

  hive_flutter 0.3.1 (1.0.0 available)

> html 0.14.0+4 (was 0.14.0+3) (0.15.0 available)

  html_unescape 1.0.1+3 (2.0.0 available)

  http 0.12.2 (0.13.1 available)

  http_parser 3.1.4 (4.0.0 available)

  image 2.1.19 (3.0.2 available)

> image_cropper 1.4.0 (was 1.3.1)

> image_picker 0.6.7+22 (was 0.6.7+12) (0.7.4 available)

> image_picker_platform_interface 1.1.6 (was 1.1.1) (2.0.1 available)

  import_js_library 1.0.2

  in_app_purchase 0.3.5+1 (0.5.1+2 available)

> intl 0.17.0 (was 0.16.1)

> js 0.6.3 (was 0.6.2)

  json_annotation 3.1.1 (4.0.1 available)

> json_serializable 3.5.1 (was 3.5.0) (4.1.0 available)

> logging 1.0.1 (was 0.11.4)

> matcher 0.12.10 (was 0.12.10-nullsafety.1)

> meta 1.3.0 (was 1.3.0-nullsafety.3)

  mime 0.9.7 (1.0.0 available)

  modal_bottom_sheet 1.0.0+1 (2.0.0 available)

  modal_progress_hud 0.1.3

  octo_image 0.3.0 (1.0.0+1 available)

  onesignal_flutter 2.6.3

  package_config 1.9.3 (2.0.0 available)

  package_info 0.4.3+4 (2.0.0 available)

> path 1.8.0 (was 1.8.0-nullsafety.1)

  path_drawing 0.4.1+1

  path_parsing 0.1.4

> path_provider 1.6.28 (was 1.6.27) (2.0.1 available)

  path_provider_linux 0.0.1+2 (2.0.0 available)

> path_provider_macos 0.0.4+8 (was 0.0.4+4) (2.0.0 available)

> path_provider_platform_interface 1.0.4 (was 1.0.3) (2.0.1 available)

> path_provider_windows 0.0.5 (was 0.0.4+3) (2.0.0 available)

> pedantic 1.11.0 (was 1.9.0)

  permission_handler 5.1.0+2 (6.1.1 available)

  permission_handler_platform_interface 2.0.2 (3.1.1 available)

> petitparser 3.1.0 (was 3.0.4) (4.1.0 available)

> platform 3.0.0 (was 2.2.1)

> plugin_platform_interface 1.0.3 (was 1.0.2) (2.0.0 available)

> process 4.2.1 (was 3.0.13)

  progress_indicators 0.1.5

> pub_semver 2.0.0 (was 1.4.4)

> pubspec_parse 0.1.8 (was 0.1.5) (1.0.0 available)

> pull_to_refresh 1.6.4 (was 1.6.2)

> quiver 2.1.5 (was 2.1.3) (3.0.1 available)

  random_color 1.0.5

  random_string 2.1.0

  readmore 1.0.1 (2.0.0 available)

  rflutter_alert 1.1.0 (2.0.2 available)

  rxdart 0.24.1 (0.26.0 available)

  scroll_to_index 1.0.6 (2.0.0 available)

> scrollable_positioned_list 0.1.10 (was 0.1.8)

  share 0.6.5+4 (2.0.1 available)

  simple_tooltip 0.1.16

  sky_engine 0.0.99 from sdk flutter

> source_gen 0.9.10+3 (was 0.9.8) (1.0.0 available)

> source_span 1.8.0 (was 1.8.0-nullsafety.2) (1.8.1 available)

> sqflite 1.3.2+4 (was 1.3.2+1) (2.0.0+3 available)

> sqflite_common 1.0.3+3 (was 1.0.2+1) (2.0.0+2 available)

> stack_trace 1.10.0 (was 1.10.0-nullsafety.1)

> stream_channel 2.1.0 (was 2.1.0-nullsafety.1)

> string_scanner 1.1.0 (was 1.1.0-nullsafety.1)

  swipedetector 1.2.0

> syncfusion_flutter_charts 18.4.49 (was 18.3.42) (19.1.55+1 available)

> syncfusion_flutter_core 18.4.49 (was 18.4.31) (19.1.55 available)

> syncfusion_flutter_datepicker 18.4.49-beta (was 18.3.51-beta) (19.1.55-beta available)

> syncfusion_flutter_gauges 18.4.49 (was 18.4.31) (19.1.55 available)

> syncfusion_flutter_sliders 18.4.49-beta (was 18.3.44-beta) (19.1.55-beta available)

> syncfusion_localizations 18.4.49 (was 18.3.44) (19.1.55 available)

  synchronized 2.2.0+2 (3.0.0 available)

> term_glyph 1.2.0 (was 1.2.0-nullsafety.1)

> test_api 0.2.19 (was 0.2.19-nullsafety.2) (0.3.0 available)

  timer_count_down 1.0.4+1 (2.0.0 available)

> typed_data 1.3.0 (was 1.3.0-nullsafety.3)

> url_launcher 5.7.10 (was 5.6.0) (6.0.3 available)

> url_launcher_linux 0.0.1+4 (was 0.0.1+1) (2.0.0 available)

> url_launcher_macos 0.0.1+9 (was 0.0.1+8) (2.0.0 available)

> url_launcher_platform_interface 1.0.9 (was 1.0.8) (2.0.2 available)

> url_launcher_web 0.1.5+3 (was 0.1.3+2) (2.0.0 available)

> url_launcher_windows 0.0.1+3 (was 0.0.1+1) (2.0.0 available)

  uuid 2.2.2 (3.0.3 available)

> vector_math 2.1.0 (was 2.1.0-nullsafety.3)

  video_compress 2.1.1 (3.0.0 available)

  video_player 1.0.1 (2.1.1 available)

  video_player_platform_interface 2.2.0 (4.1.0 available)

> video_player_web 0.1.4+1 (was 0.1.4) (2.0.0 available)

  video_thumbnail 0.2.5+1 (0.3.3 available)

  visibility_detector 0.1.5 (0.2.0 available)

  wakelock 0.2.1+1 (0.5.0+2 available)

  wakelock_platform_interface 0.1.0+1 (0.2.0 available)

  wakelock_web 0.1.0+3 (0.2.0 available)

> watcher 1.0.0 (was 0.9.7+15)

> webview_flutter 1.0.7 (was 1.0.5) (2.0.3 available)

> win32 2.0.5 (was 1.7.3)

> xdg_directories 0.1.2 (was 0.1.0) (0.2.0 available)

  xml 4.5.1 (5.1.0 available)

  yaml 2.2.1 (3.1.0 available)

These packages are no longer being depended on:

– node_interop 1.2.1

– node_io 1.2.0

– platform_detect 1.4.0

Downloading image_cropper 1.4.0…

Downloading flutter_facebook_auth 2.0.2+1…

Downloading get 3.26.0…

Downloading path_provider 1.6.28…

Downloading path_provider_windows 0.0.5…

Downloading win32 2.0.5…

Downloading scrollable_positioned_list 0.1.10…

Downloading logging 1.0.1…

Downloading glob 2.0.1…

Downloading agora_rtc_engine 3.3.2…

Downloading flutter_rating_bar 4.0.0…

Changed 88 dependencies!

104 packages have newer versions incompatible with dependency constraints.

Try `flutter pub outdated` for more information.

Bi an bunları görünce otomatik download etti ve son güncel paketlere geçecek sanıyorsunuz ama pubspec.yaml da herhangi bir değişiklik yapmadı. 

Bu durumda önerdiği üzere flutter pub outdated ile bakıyoruz paketlerin son versiyonları nelermiş nelere geçebiliirz bize rapor çıkarttıyor olacak. Yani kısacası sen uğraş diyor

Showing outdated packages.

[*] indicates versions that are not the latest available.

Package Name                                    Current        Upgradable     Resolvable    Latest        

direct dependencies:                           

cached_network_image                            *2.3.3         *2.3.3         *2.5.1        3.0.0         

camera                                          *0.5.8+17      *0.5.8+17      *0.7.0+2      0.8.1         

credit_card                                     *0.1.6         *0.1.6         0.1.8         0.1.8         

crypto                                          *2.1.5         *2.1.5         *2.1.5        3.0.1         

device_info                                     *0.4.2+10      *0.4.2+10      2.0.0         2.0.0         

dio                                             *3.0.10        *3.0.10        *3.0.10       4.0.0         

flutter_auth_buttons                            *0.6.0         *0.6.0         0.10.0        0.10.0        

flutter_cache_manager                           *1.4.2         *1.4.2         *2.1.2        3.0.1         

flutter_facebook_auth                           *2.0.2+1       *2.0.2+1       *2.0.2+1      3.3.2         

flutter_html                                    *1.2.0         *1.2.0         *1.2.0        1.3.0         

flutter_inappwebview                            *4.0.0+4       *4.0.0+4       5.3.1+1       5.3.1+1       

flutter_keyboard_visibility                     *3.3.0         *3.3.0         *4.0.6        5.0.0         

flutter_typeahead                               *1.8.8         *1.8.8         *2.0.0        3.1.1         

font_awesome_flutter                            *8.8.1         *8.8.1         9.0.0         9.0.0         

get                                             *3.26.0        *3.26.0        *3.26.0       4.1.3         

get_storage                                     *1.4.0         *1.4.0         *1.4.0        2.0.2         

google_fonts                                    *1.1.2         *1.1.2         *1.1.2        2.0.0         

google_sign_in                                  *4.5.1         *4.5.1         *4.5.9        5.0.1         

hive                                            *1.4.4+1       *1.4.4+1       *1.4.4+1      2.0.2         

hive_flutter                                    *0.3.1         *0.3.1         *0.3.1        1.0.0         

html_unescape                                   *1.0.1+3       *1.0.1+3       2.0.0         2.0.0         

http                                            *0.12.2        *0.12.2        *0.12.2       0.13.1        

image_picker                                    *0.6.7+22      *0.6.7+22      *0.6.7+22     0.7.4         

in_app_purchase                                 *0.3.5+1       *0.3.5+1       *0.3.5+1      0.5.1+2       

modal_bottom_sheet                              *1.0.0+1       *1.0.0+1       2.0.0         2.0.0         

package_info                                    *0.4.3+4       *0.4.3+4       2.0.0         2.0.0         

permission_handler                              *5.1.0+2       *5.1.0+2       *5.1.0+2      6.1.1         

quiver                                          *2.1.5         *2.1.5         *2.1.5        3.0.1         

readmore                                        *1.0.1         *1.0.1         2.0.0         2.0.0         

rflutter_alert                                  *1.1.0         *1.1.0         2.0.2         2.0.2         

scroll_to_index                                 *1.0.6         *1.0.6         2.0.0         2.0.0         

share                                           *0.6.5+4       *0.6.5+4       2.0.1         2.0.1         

syncfusion_flutter_charts                       *18.4.49       *18.4.49       19.1.55+1     19.1.55+1     

syncfusion_flutter_datepicker                   *18.4.49-beta  *18.4.49-beta  19.1.55-beta  19.1.55-beta  

syncfusion_flutter_gauges                       *18.4.49       *18.4.49       19.1.55       19.1.55       

syncfusion_flutter_sliders                      *18.4.49-beta  *18.4.49-beta  19.1.55-beta  19.1.55-beta  

syncfusion_localizations                        *18.4.49       *18.4.49       19.1.55       19.1.55       

timer_count_down                                *1.0.4+1       *1.0.4+1       2.0.0         2.0.0         

url_launcher                                    *5.7.10        *5.7.10        6.0.3         6.0.3         

video_compress                                  *2.1.1         *2.1.1         3.0.0         3.0.0         

video_player                                    *1.0.1         *1.0.1         *1.0.1        2.1.1         

video_thumbnail                                 *0.2.5+1       *0.2.5+1       0.3.3         0.3.3         

visibility_detector                             *0.1.5         *0.1.5         0.2.0         0.2.0         

webview_flutter                                 *1.0.7         *1.0.7         *1.0.7        2.0.3  

37  dependencies are constrained to versions that are older than a resolvable version.

To update these dependencies, edit pubspec.yaml, or run `flutter pub upgrade –major-versions`.

Hala bir umut önerilere devam ediyor bizde zorluyoruz.

flutter pub upgrade –major-versions

Ile geçiş denemesi yapıyoruz. 

Changed 26 constraints in pubspec.yaml:

  url_launcher: ^5.5.3 -> ^6.0.3

  scroll_to_index: ^1.0.6 -> ^2.0.0

  html_unescape: 1.0.1+3 -> ^2.0.0

  flutter_keyboard_visibility: ^3.2.2 -> ^4.0.6

  credit_card: 0.1.6 -> ^0.1.8

  visibility_detector: ^0.1.5 -> ^0.2.0

  syncfusion_flutter_charts: ^18.3.42 -> ^19.1.55+1

  syncfusion_flutter_datepicker: ^18.3.51-beta -> ^19.1.55-beta

  syncfusion_localizations: ^18.3.44 -> ^19.1.55

  syncfusion_flutter_sliders: ^18.3.44-beta -> ^19.1.55-beta

  rflutter_alert: ^1.1.0 -> ^2.0.2

  readmore: ^1.0.1 -> ^2.0.0

  camera: ^0.5.8+17 -> ^0.7.0+2

  video_compress: ^2.1.1 -> ^3.0.0

  timer_count_down: ^1.0.4+1 -> ^2.0.0

  syncfusion_flutter_gauges: ^18.4.31 -> ^19.1.55

  modal_bottom_sheet: ^1.0.0+1 -> ^2.0.0

  font_awesome_flutter: 8.8.1 -> ^9.0.0

  video_thumbnail: ^0.2.5+1 -> ^0.3.3

  share: ^0.6.5+4 -> ^2.0.1

  google_sign_in: 4.5.1 -> ^4.5.9

  flutter_auth_buttons: ^0.6.0 -> ^0.10.0

  device_info: ^0.4.1+4 -> ^2.0.0

  flutter_cache_manager: ^1.4.2 -> ^2.1.2

  package_info: ^0.4.3+4 -> ^2.0.0

  flutter_inappwebview: ^4.0.0+4 -> ^5.3.1+1

Evet şimdi bazı güncellemeler yaptı pubspec de

Şimdi kodlara baktığımızda bazı yerlerde hatalar olduğunu görüyoruz. Sıra ile düzeltmeler yapmak gerekiyor kodda. Bu hataların bir kısmı Flutter 2.0 ile dart dili versiyonu da 2.12.2 ye geçmiş oldu. Bir kısmı ise yeni kütüphanelerde olan değişiklikler.

Başlamadan önce dart dili güncellendiği için VsCode kulllanıyorsanız ki öyle tahmin ediyorum. Bi kapatıp açmanızda fayda var.  Hem proje baştan yüklensin hem bi kendine gelsin   Açıkcası kapatıp açınca farklı hatalar çıktığını veya hataların düzeldiğini gördüm çoğu kez.

Örneğin inappwebview ile ilgili çizilli olan yerler hatalı diyor.

child: InAppWebView(

         initialUrlRequest: URLRequest(url: Uri.parse(webViewController.url)),

         onWebViewCreated: (InAppWebViewController controller) {

           _webViewController = controller;

         },

         onProgressChanged: (InAppWebViewController controller, int progress) {

           //log(“progress : ” + progress.toString());

           webViewController.progress.value = progress / 100;

         },

         onReceivedServerTrustAuthRequest: (InAppWebViewController controller,

             URLAuthenticationChallenge challenge) async {

           return ServerTrustAuthResponse(

               action: ServerTrustAuthResponseAction.PROCEED);

         },

       ),

Bizde bu noktada araştırma ve düzeltmelere başlıyoruz.

Burada yeni kütüphanede kulllanılan özellikleri bulmak için widget ismine tıklayıp içine girip bakmak gerekiyor.

Mesela initialUrl artık initialUrlRequest olmuş. Bunun gibi tek tek bakıp düzeltmeniz gerekiyor.

Üstelik tipi String den URLRequest e dönmüş.

initialUrlRequest: URLRequest(url:  webViewController.url)),

Şeklinde güncelliyoruz.

Kütüphanenin son halinin pub.dev deki example larına tekrar bakmanız gerekebilir bu değişiklikleri yaparken.

Düzeltme snrrası kod bu hale geliyor.

InAppWebView(

         initialUrlRequest: URLRequest(url: webViewController.url),

         onWebViewCreated: (InAppWebViewController controller) {

           _webViewController = controller;

         },

         onProgressChanged: (InAppWebViewController controller, int progress) {

           //log(“progress : ” + progress.toString());

           webViewController.progress.value = progress / 100;

         },

         onReceivedServerTrustAuthRequest: (InAppWebViewController controller,

             URLAuthenticationChallenge challenge) async {

           return ServerTrustAuthResponse(

               action: ServerTrustAuthResponseAction.PROCEED);

         },

Burada bütün değişikleri anlatmayacağım her kırmızı noktada araştırma yapıp değişiklik ne olacak bulabiliyorsunuz biraz uğraşmak gerekiyor. Bazı upgrade olan kütüphaneleri geri çekmek zorunda kaldık flutter 2.0 da sorun yaratmıyorsa ve kodda çok değişiklik gerekiyorsa bu durumda geri çekip daha sonra o kısmı baştan ele almanız gerekebilir. 

Son olarak Android build fail oldu. 

BUILD FAILED in 1m 29s

The build failed likely due to AndroidX incompatibilities in a plugin. The tool is about to try using Jetifier to solve the incompatibility.

[!] Flutter tried to create the file `android/settings_aar.gradle`, but failed.

To manually update `settings.gradle`, follow these steps:

   1. Copy `settings.gradle` as `settings_aar.gradle`

   2. Remove the following code from `settings_aar.gradle`:

       def localPropertiesFile = new File(rootProject.projectDir, “local.properties”)

       def properties = new Properties()

       assert localPropertiesFile.exists()

       localPropertiesFile.withReader(“UTF-8”) { reader -> properties.load(reader) }

       def flutterSdkPath = properties.getProperty(“flutter.sdk”)

       assert flutterSdkPath != null, “flutter.sdk not set in local.properties”

       apply from: “$flutterSdkPath/packages/flutter_tools/gradle/app_plugin_loader.gradle”

Önerilen düzeltmeyi yapınca bu sefer başka bir hata

BUILD FAILED in 803ms

ProcessException: Process exited abnormally:

FAILURE: Build failed with an exception.

* What went wrong:

Project ‘app’ not found in root project ‘android’.

Android studio ile android projesini açıp bir bakalım ne oluyor ne bitiyor. Bu son yaptığımız setttings.gradle işlemini geri alıyoruz. Android studio içinden run yapıyoruz vee build oluyor. Sanırım vscode-dart refresh sorunu yaşadık yine.

Bu aradada projede variant ımız release kalmış buda soruna yol açmış olabilir onuda debug yapıp deniyoruz. 

Bazı paketlerde sıkıntı çıktı biz bir flutter clean sonra tekrar pub get yapalım vscode dan.

Sonra tekrar android studio yu açtık ve paketlerden biri gradle dosyasında hata verdiğini gördük. Baktığımızda gradle 3.6.3 kulllanıyordu. Bizde 3.6.3 e geçirdik ana gradle dosyamızı

        classpath ‘com.android.tools.build:gradle:3.5.0’

        classpath ‘com.android.tools.build:gradle:3.6.3’

Yani Fllutter 2.0 a geçtiğinizde build.gradle dosyalarınızda kendiliğinden güncellenmiyor malesef. Kendiniz sorun var ise tespit edip çözmeniz gerekiyor.

Flutter yazarken Android dünyasını da iOS dünyasını da bilmek gerekiyor. Biraz Android Studio ve XCode a hakim olmak lazım. Çünkü arka tarafta flutter yine onlar üzerinden derleme yapıyor.

2.0 ın bize çok güzellikler ve kolaylııklar getirmesini umuyorrum. Umarım herkes kolay geçiş yapar. Bizim yaklaşık bir 3 saatimizi aldı ama projeyi baştan sona test etmek lazım. Umarım sorun çıkmaz başka.

—

Test sonucu: 

Tabiki sorunlar çıktı sadece 1 kütüphaneyi daha üst bir versiyonu geçirelim dedik bir ufak sorundan dolayı, bir sürü başka kütüphane etkilendi. Daha sonra bi 3 saat daha uğraştık ve tüm kütüphaneler neredeyse  son versiyonlarına gelmiş oldu. Hatta bazı kütüphaneleri silmek zorunda bile kaldık çünkü 2.0 update ini yapmamışlar. 

Kütüphane seçerken beğeni, pub puanı ve popülerlik oranına bakmanın ne kadar önemli olduğu bir kez daha ortaya çıktı. Sıradan ve az kullanılan bir kütüphane risk teşkil eder çünkü yapan kişi bırakabilir , güncellemeyebilir. 

Sonuçta  6 saatten fazla sürdü ama geçişi başarılı yapabildik. 

Bu sayede bizde sorulan sorular üzerinden kimin hangi konu ile daha çok ilgilendiğini görebilliyoruz.

Özellikle React-Native ile rekabet eden (kullanıcı sayısı olarak) Flutter, bu yarışta 2019 ortalarında öne geçmiş görünyor.

2020 yılında grafik bu şekilde.

2021 de ise fark oldukça açılmış. Buda flutter ın farkı daha da açacağını ve react in düşüşe geçeceğinin bir göstergesi bana göre.

Özellikle web tarafı Flutter da geliştikçe React tercih etmelerine gerek kalmayacak kimsenin. Daha önceki yazılarımda Flutter’ın dart dilinde tek bir kod yazarak hem android hem ios gerçek Native Mobil Uygulama yapabildiğinden bahsetmiştim. React malesef tam native değil arada bir javascript katmanı var ve buda biraz performans sorunu yada hatalara yol açabiliyor. Flutter ile hazırlanan küttüphanelerin modülleri tam native çevirisi yapıyor ve sonuç-çıktı gerçek bir native uygulama.

Ancak dikkat! Flutter’ı yanlış kullanırsanız sonuç React’dan kötü oluyor. State management çok önemli bir kavram Flutter da ve yanlış yapılırsa ciddi performans sorunları oluşuyor.

Ancak konumuz şimdi bu değil. Bu yazıda Fllutter’ın giderek yaygınlaştığını ve React’in giderek düşeceğini vurgulamak istedim.

Şimdi çok ilginç bir grafik daha paylaşacağım. Biliyorsunuz mobil uygulama geliştirken uzun yıllar android de java ve son olarak kotlin , ios da ise objective-c ile başlayan maceramız swift dili ile devam etti.

Java çok eski ve birçok yerde kulllanılan bir dil olduğundan onla kıyaslamak doğru olmaz flutter ı. Ancak son yıllarda android uygulama geliştirme dili olarak popüler olan Kotlin dilini karşılaştırma için kulllanabileceğimizi düşünüyorum.

Grafikte gördüğünüz gibi swift ve kotlin i sollamış durumda Flutter. Önümüzdeki zamanda Flutter ın 2017 de çıktığını düşünürsek bu yıllarda düşüşe geçen Swift de, 2021 den sonra düşecek olan Kotlin’de Flutter bu hızda giderse düşüş göstermeye devam edecek gibi görünüyor.

Yeni mobil uygulama geliştirecek arkadaşlara tavsiyem şu olacak. Trendi takip edin. Bu sayede güncel kalabilirsiniz. Bu tavsiyem hem yazılımcı arkadaşlara hem de mobil uygulama yaptırmak isteyenlere.

Sağlıkla ve sevgiyle kalın!

Bugün sizlere bu 1.5, 2 ay gibi başlangıçta bizi uğraştıran süreci kısaltmak için ne yapabileceğimizden bahsedeceğim.

Flutter, Android Studio veya Ios-Xcode için hazırlanmış UI Setler içerisinde yüzlerce ekran tasarımı barındırıyor. Hatta birkaç UI Set birden kullanıp her ekran tipi için 10 larca seçeneğe ulaşmak mümkün. Bu ekran örneklerinin rengi, içindeki yerleşimi de kolaylıkla değiştirilebilir durumda. Bu sayede UI yani frontend tasarımını direk uygulama yapar gibi yapmak mümkün. Yani işe hemen girişmek. Eğer müşteri ile beraber çalışma ve seçtirme şansınız var ise örnek ekranlardan bu sayede demo data ile çalışan prototip uygulama hızlı bir şekilde yapabiliyorsunuz. Revizeler uygulama üzerinde canlı canlı yapılıyor ve UX deneyimi rahatlıkla gözlemlenebiliyor. Bu arada bahsetmeyi unuttum UI – User Interface yani Arayüz , UX ise User-Experience yani kullanıcı deneyimi. Photoshop gibi araçlar ile çizim yaptığınızda UX i deneyimlemek oldukça zorken, direk uygulama prototipi yaptığınızda çıkan sonuç gerçek bir uygulama gibi oluyor ve ekranlarda dolaşabiliyor ve uygulamayı deneyimleyebiliyorsunuz.

Şimdi daha çok uzatmadan bazı ekran örneklerini sizler ile paylaşacağım.

UI Set Örneklerini İndirmek İçin Tıklayın

Son olarak bu yukarıda verilen örnek ekranlar daha çoğaltılabilir ama sizlere fikir vermesi açısından yeterli olduklarını düşünüyorum. Bu ekranlar uygulama sahibinin yönlendirmesi ile yazılımcıya değişikliklerde söylenerek yaptırılabilir bu sayede çok ciddi bir zaman ve maliyet tasarrufu yapılmış olur.

Örneğin. Login ekranı 1.4 de gibi olsun renkler logomuza uyumlu olsun.

Sonuçta bu biraz agile çalışma yöntemine benziyor ve işi yapan ile iş sahibi başlangıçtaki bu sıkı çalışmaya gönüllü olmalı. Aksi halde bu süreç tıkanır. Böyle bir durum var ise ve ekran ekran istenen tarif edilemeyecek ise bir ui designer ile uygulama ekranlarını komple tasarlatıp sonra yazılım sürecine geçmek daha sağlıklı olacaktır.

Hepinize sağlıklı ve mutlu günler dilerim.

Önceki yazılarımda mobil uygulama geliştirirken flutter’ın avantajlarından bahsetmiştim. Bu yazıda biraz daha teknik bilgilere yer vereceğim.

Flutter’ı mobil uygulama platformu olarak seçtiğimizi düşünerek aşağıdaki sorulara cevap arayacağız.

1. Flutter da nasıl bir mobil uygulama çatısı kullanmalıyız?
2. Kullandığımız kütüphaneleri nasıl seçmeliyiz?
3. Flutter ile Geliştirme yaparken nelere dikkat etmeliyiz?

1.Flutter da nasıl bir mobil uygulama çatısı kullanmalıyız?

Flutter da en önemli konularda biri state management konusu. Öncelikle state management derken yönettiğimiz değikkenlerden ve ekranı güncellerken kullandığımız yazı, sayı , liste gibi değişkenlerin yönetiminden bahsediyoruz. Bu konuda izleyeceğiniz birçok yöntem var. Ben son zamanlarda Getx ile bu yönetimi yapıyorum ve oldukça başarılı buluyorum.

https://pub.dev/packages/get

SetState, provider, reddux, mobx, bloc gibi yönetemler diğer yöntemler ama Getx seçmemizin sebebi hem performans hem de Getx in sadece state management işini kolay yönetmesi değil aynı zamanda bir mikro framework(çatı) olması. Bu sayede güzel bir yapı kurabiliyorsunuz uygulamanıza. Getx i daha detaylı anlatmak için sayfalarca yazmam lazım ama burada sadece tavsiye veriyorum o yüzden çok uzatmayacağım. Getx i daha detaylı inclemek isteyenler zaten araştırabilir ancak Getx ile nvaigation bar ve drawer içeren güzel bir çatı örneği hazırladım sizler için. Aşağıdaki sayfadan bunu inceleyebilirsiniz.

https://github.com/balabanferhat/FlutterGetXWithNavigation

2.Kullandığımız kütüphaneleri nasıl seçmeliyiz?

Flutter da birçok kullanabileceğiniz hazır kütüphane ve widget mevcut. Flutter UI tamamen iç içe oluşan widget lardan oluşuyor ve seçeceğiniz kütüphaneler ile bu widget ları zenginleştirebiliyorsunuz. Bu seçimleri yaparken ne kadar like almış, puan almış buna göre sıralayıp inceleyebilirsiniz.

https://pub.dev/packages?sort=top

Herhangi bir kütüphane içine girince örnekleri nasıl kullanacağınızı anlatıyor ama şu bilgiler kütüphane ne kadar güvenilir onu söylüyor bize. Pub points gerekli açıklama dokümantasyon puanı anlamına geliyor.

3.Flutter ile Geliştirme yaparken nelere dikkat etmeliyiz?

Performansa dikkat etmek çok önemli. Hangi framework ü yada küttüphaneyi kullanırsanız kullanın bazı şeyler arka planda sürekli açıldıkça memory de yer kaplıyor ve uygulamanız kullanıldıkça yavaşlamaya başlıyor olabilir. Örneğin Getx bunları iyi yönetsede üst üste sayfa açtığınızda ve arkada bu sayfalar açık kaldığında GetxControlller larıda açık kalıyor olabilir. İşiniz biten sayfaların kapanması için sonraki ekrana giderken önceki ekranın kapanmasını sağlayabilirsiniz bu şekilde.

Get.off(NextScreen());

Bir diğer konuda yazılan kodun belli aşamalarında android de çalışıyorsanız ios a ve ios da çalışıyorsanız android e mutlaka bakılması gerekiyor. Bu yüzden ben Flutter developer için mac bilgisayarda çalışılmasını gerekli görüyorum. Bu iş sonraya bırakılırsa bu duruma iş işten geçtikten sonra tüm kodu diğer platformda çalışması için elden geçirrmeniz gerekebilir. Ayrıca ios android arasında UI farklılıkları da çok oluşuyor. Ufak kaymalar bozulmalar oluyor bunları da anında düzelterek gitmek çok daha sağlıklı olacaktır.

Hepinize iyi kodlamalar.

Şimdi ise flutter ile yeni bir dönem başlamış görünüyor. Aslında google tarafından 2017 de kullanıma sunulmuş olsada google daha uzun süredir kendi uygulamalarında bu yapıyı kullanıyor ve android ve ios geliştirmelerini tek bir platformada yapıyordu. Tabi tüm dünyanın kabulu o kadar kolay olmadı. Fakat mobil uygulama geliştirmeye kazandırdığı hız , pratiklik, performans gibi faydalar anlaşıldıkça firmalar ve yeni girişimler flutter’ı kullanarak mobil uygulama geliştirmeye başladı.

Dünyada bilinen ve flutter kullanan bazı markalar:

1. Google: Google Assistant apps, Google Ads, Google’s Stadia
2. eBay: eBay Motors app
3. BMW
4. Alibaba Group: Xianyu app
5. The New York Times: Ken Ken puzzle
6. Square: Flutter plugin for In-App Payments SDK
7. Tencent: AITeacher, DingDang, QiDian, Mr. Translator, K12, Now Live
8. Groupon: Groupon Merchants
9. MGM Resorts apps
10. Philips Hue
11. Reflectly
12. Baidu Tieba

Eminiz daha çok var ama bunlar bilinen bazıları.

Flutter ile geliştirilen uygulama çıktısı, eskiden android ve ios ayrı ve native yazılan ile aynı çıktıyı üretiyor. Yani sonuç native uygulama.

Şahsi görüşümü soracak olursanız ben çok sevdim. En çok sevdiğim hızlı geliştirme ve bir önceki projede yaptığınız birçok şeyi bir sonraki projede çok rahat kullanabiliyor olmanız. Flutter UI, widget dediğimiz küçük ve ortak kulllanılabilen bileşenlerden oluşuyor. Zaman içinde widget kütüphaneniz oturuyor veya bu hazır kütüphaneleri çok rahat bulabiliyorsunuz arayarak. Bu açıdan widget larınız elinizdeki silahlarınız diyebilirim.

Ayrıca hazırlanmış Getx ve Dio gibi flutter kütüphaneleri işinizi oldukça hızlandırıyor.

Bir diğer artı ise bence ui setler. Bilmiyenler için bahsedeyim, bir app e başlamadan önce tasarım yapılması gerekiyor. Ancak bu çok sancılı bir süreç. Bir tasarımcı ui tasarımı için 1 ay kadar vakit harcayabiliyor. Bu iş bittikkten ve tasarım onaylandıktan sonra tasarımcı bu hazırladıklarını yazılımcılar ile paylaşıyor ve yazılımcılar bu tasarımı 1-1 yapmaya çalışırken de nerden baksanız 1 ay kaybediyor. Bence flutter ui setleri alınarak ve app i yapmak isteyen kişi ile el sıkışarak (yani bu ui sete uygun app yapılacak noktasında) bu tasarım bu ui setin örnekleri ile bir prototip olarak flutter da yapılabilir. Bu sayede daha agile bir yöntem ile iş hemen yapılmaya başlanmış olur ve bu sayede aylar kazanılabilir.

Flutter ile bir app yapısı nasıl olmalı konusunda bana danışabilirsiniz. Sorularınız olursa en kısa zamanda cevaplamaya çalışırım.

Daha önceki bir yazımda (buradan ulaşabilirsiniz) bu işin mantığından bashetmiştim. Bu yazıyı da okumanızı tavsiye ederim.

Bu yazıdan sonra tabi uzun zaman geçmiş. Malum döviz kurundaki artış ve TL deki değer kaybı ile mobil uygulama geliştirme adam/gün ücretlerinde de ciddi artışlar oldu.

Bir mobil uygulama yaptırmak için neye ihtiyacınız var , ne kadar maliyet olur fiyatları nelerdir bu yazımda bunlara tekrar değineceğim.

Öncelikle tek platform için yazdığımız bu yazıyı hem ios hem android için düşünebilirsiniz. Sebebi de her iki platformda iş yükünün hemen hemen yakın olmasındandır. Eğer flutter/react native gibi tek bir platformada mobil uygulama geliştiriyorsanız o zaman tek maliyet düşünebilirsiniz.

Özetle, android/ios ayrı ise x2, flutter/react native ise x1 olarak düşünebilirsiniz.

Mobil uygulama fiyatını hesaplamak için öncelikle işi parçalara ayırmak gerekir.

Aşağıdaki örnek maliyetler tahminen 1 ay sürecek normal ölçüde bir mobil uygulama geliştirme için hesaplanmıştır.

Başlamadan önce şunu belirteyim. Sizin 5000 TL bütçeniz olabilir. Bu bütçe ile işi yapacak bir ekip yada kişi bulabilirsiniz. Ancak her kalitenin her çalışan kişinin bir adam/gün maliyeti vardır ve plansız ve hakkını ve karşılığını tam vermediğiniz ürünün sonucu da kötü olacak veya ardından çıkan hatalarda destek alamayacaksınız , veya kod kötü ve baştan savma olabilir. Ben bu konuda uyarmayı bir borç biliyorum kendime. Bu tip durumlar çok gördüm. Biz birine bir iş yaptırdık ama bıraktı gitti bize yardımcı olurmusunuz. Kodu inceleyince ne kadar çok hatalı olduğunu görünce şaşırıyorsunuz. Sanki yapan kişi yapmak istememiş ve istemeyerek paraya da ihtiyacı olduğu için işi de kabul etmiş. Bu yüzden şunu unutmayın ne kadar ekmek o kadar köfte gibi özetleyebiliriz konuyu.

Aşağıdaki adam/gün fiyatları işin hakkını vererek 2020 yılında 1 ay sürecek bir mobil uygulama geliştirme fiyatlarıdır.

1 -Mobil Uygulama Tasarım Fiyatları

Tasarım aşamasında yapılacak işin büyüklüğüne kaç ekran olacağına , ne kadar profesyonel olması gerektiğine göre değişkenlik gösterir.

Bir yazılımcıya sadece mockup yani ekran taslak çizimleri vererek bu taslakdan yola çıkaran ui bileşenlerini kullanarak yol almasını isteyebilirsiniz. Bu durumda tasarım maliyetiniz olmayacak ama karşınıza çıkan ekranlarda görsel olarak sizi tatmin etmeyebilir. Burada iş yazılımcının kabiliyetine kalıyor aslında. Çok güzel birşey de ortaya çıkarabilir eğer çok görsel içeren bir uygulama olmayacak ise yeterli birşey yapabilir.

Ancak splash ekranından başlayarak her ekranın nasıl olması gerektiğini çalıştıracak ve ui (kullanıcı arayüzü) ve ux (kullanıcı deneyimi) düşünerek ekranların çalışılmasını ve nihai ürünün ne olacağını bilmek istiyor ve süpriz ile karşılaşmak istemiyorsanız bu durumda tasarım süresi ve adam/gün maliyeti üzerinden giderek bir hesaplama yapabilirsiniz.

Diyelim 10 gün sürecek bir tasarım çalışması var. Maliyet hesaplamasını adam/gün üzerinden yaparsak:

Adam gün ücreti 400 – 800 civarında ve değişkenlik gösterebilir. Biz burada 600 alalım. 600 x 10= 6000 TL bir tasarım maliyeti çıkacaktır.

2 – Mobil Uygulama Yazılım Fiyatları

Yazılım fiyatları da aynı tasarımda olduğu gibi iş yükü ekranlara göre çıkartılarak yapılır.  Burada her ekran düşünülerek kaç gün süreceği çıkartılır. Yazılımcı maliyetleri düşünüldüğünde ve işi hakkını vererek yaptırmak istediğiniz iyi bir yazılımcı için adam/gün ücretleri 600-1000 TL arasında değişkenlik gösterebilir.

Biz burada 800 TL den hesap yapalım.

800 x 20 iş günü = 16.000 TL çıkacaktır. (Android/iOS ayrı yazılıyorsa x2 düşünelim)

Not: Android/ios ayrı olunca maliyet çok çıkıyor. O zaman neden hep Flutter gibi tek platformda mobil uygulama geliştirmiyoruz ? Bu soruyu duyar gibi oldum bir anda. Bu durumda son yazılarımdan Flutter tecrübelerimi lütfen okuyun. Özetle evet Flutter gayet başarılı buldum ama bazı riskleri de yok değil.

3 – Mobil Uygulama Backend/Admin Paneli Yazılım Fiyatları

Şunu unutmamak lazım. Bazı durumlarda işe ait backend olmak zorundadır. Aslında tamamen cihazda çalışacak local bir uygulama yapmıyorsanız bu durumda backend servisleri ve admin paneli ihtiyacınız da olacaktır.

Tüm bunlar içinde 20 gün dersek, adam/gün ücreti de backend yazılımcısı için hemen hemen aynıdır.

Maliyet 800 x 20 iş günü = 16.000 TL çıkacaktır.

4 – Mobil Uygulama Devreye alım ve destek

Mobil uygulama yaptırma işi tamamlandıktan sonra uygulama test edilip yayına alınır. Bu aşamada işimiz bitmiyor. Genelde sizlere tavsiyem anlaşacağınız yazılımcı yada firma ile sözleşme yaparak ilerlemeniz. Çünkü yayına aldıktan sonrada bazı hatalar ve eksikler olduğu ortaya çıkabilir. Ne kadar iyi test yapılıp işi teslim alsanızda store a çıktıktan sonra tüm kullanıcıların farklı cihazlar ile yapacağı kulllanım gibi test yapamazsınız. Sadece en iyi testler buna yaklaşabilir ama aynı olmaz. Bu nedenle sözleşmenizde mutaka en az 6 aylık ücretsiz bakım ve destek isteyebilirsiniz. Yapılacak çalışmaya göre tabi bu 6 ay , 3 ayda olabilir ama 3 ayda az olmamasında fayda vardır. Tavsiyem minumum 6 aydır. Çünkü uygulama 3 ayda belli bir kullanıcı sayısına ulaşamayabilir. Bu tabi yapacağınız tanıtım/reklam ile orantılıdır.

Peki bu süre geçtikten sonra ne olacak? Bu durumda da toplam proje bütçesinin %10 – %20 si arasında değişen yıllık bakım ücretleri devreye girecektir.

Örneğimizde;

Android/iOs ayrı ve backend olmayan proje için maliyet

Tasarım – 6.000 TL
Android. – 16.000 TL
iOS – 16.000 TL
TOPLAM MALİYET: 38.000 TL
YILLIK BAKIM DESTEK(%15) : 5.700 TL.

Android/iOs aynı (Flutter/React Native) ve backend olmayan proje için maliyet

Tasarım – 6.000 TL
Android/iOS. – 16.000 TL
TOPLAM MALİYET: 22.000 TL
YILLIK BAKIM DESTEK(%15) : 3.300 TL.

Bu bakım destek kapsamında sözleşmenizde sonradan çıkabilecek hataların giderilmesi, yeni çıkan kütüphane ve sdk ların projede güncellenmesi, yeni cihaz ve sürümlerin yaratacağı sıkıntıların giderilmesi ve hata raporlarının belli aralıklar ile takibi ve raporlanması olmalıdır. Unutmamalıdır ki bir uygulama yaşayan bir canlı gibidir. Sürekli bakıma ve desteğe ihtiyaç duyar. Bunun sebeplerinden biri de teknolojinin sürekli değişmesi ve eskiden kullanılan bazı kütüphanelerin atıl kalmasıdır. Uygulama geliştirildiği platformda tekrar açılmalı , gerekli güncelleme ve testler tekrar yapılarak store a güncelleme olarak gönderilmelidir. Bu tip güncellemeler ortalama 4-5-6 ayda bir veya uygulamada bazı buglar tespit edilmiş ise onlar ile beraber store a çıkarken yapılabilir.

Özet;

Aşağıdaki fiyatlar işi yapacak ekip/kişi ile anlaşmanıza göre 6 veya 12 taksit şeklinde olabilir. Bu fiyatlar peşin ödenecek gibi sakın düşünmeyin. Hatta peşin ödememek sonuç aldıkça ödeme yapmak kesinlikle daha iyi olacaktır. 12 taksit yapılınca işe başlarken sadece maliyetin 1/12 sini verip işe başlatmanız mümkündür. Tabi şahıs/ekip bu şartları kabul ederse. Etmiyorsa zaten sizde onlar ile çalışmak zorunda değilsiniz. Önemli olan makul bir ödeme planı yapmak ve aşama aşama ilerlemektir.

BACKEND olan durumda:
Android/iOS ayrı olursa toplam ilk sene masrafımız:

38.000(android/iOS/Tasarım) + 16.000 (Backend) + sonraki 6 aylık bakım (8100/2) 4050 TL = 58.050 TL

Sonraki seneler uygulamada ek özellik yada değişiklik istemezseniz 8100 TL destek ve bakım masrafı olacaktır.

Android/iOS aynı (Flutter/React Native) olursa toplam ilk sene masrafımız:

22.000(android&iOS/Tasarım) + 16.000 (Backend). + sonraki 6 aylık bakım (5700/2) 2850 TL = 40.850 TL

Sonraki seneler uygulamada ek özellik yada değişiklik istemezseniz 5700 TL destek ve bakım masrafı olacaktır.

BACKEND olmayan durumda:
Android/iOS ayrı olursa toplam ilk sene masrafımız:

38.000 + sonraki 6 aylık bakım (5700/2) 2850 TL = 40.850 TL

Sonraki seneler uygulamada ek özellik yada değişiklik istemezseniz 5700 TL destek ve bakım masrafı olacaktır.

Android/iOS aynı (Flutter/React Native) olursa toplam ilk sene masrafımız:

22.000 + sonraki 6 aylık bakım (3300/2) 1650 TL = 23.650 TL

Sonraki seneler uygulamada ek özellik yada değişiklik istemezseniz 3300 TL destek ve bakım masrafı olacaktır.

Gördüğünüz gibi iş biraz karışık. Uygulamanızın backend ihtiyacı var mı? Profesyonel tasarım ihtiyacı var mı? Flutter/React Native gibi tek platform da yazılır mı gibi birçok seçeneğe göre fiyat hesaplanıyor. Bu durumda bir uzmana danışmanız ve onunla ilerlemeniz çok önemli.

Son olarak: Teknik Danışman ?

Aynı zamanda sadece seçim yeterli değil. Yazılımı yapan ekip/şahıs denetlenmeli ve kalite kontrol yapılmalı. Paranızı sokağa atmak istemiyorsanız bir danışmandan proje devam ettiği sürece şu konularda destek alabilirsiniz. Bu kalite ve paranızın boşa gitmemesi için çok önemli.

Danışmanlık kapsamı projenin büyüklüğüne göre değişmekle birlikte kapsam genelde şu şekilde oluyor.

1 – Projeye ait kurgunun kontrolü/şekillendirilmesi ve apple/google politikalarına uygunluğu,
2 – Tasarımınız yok ise projeye uygun tasarımın yapılması,
3 – Tasarım sonrası iş planının belirlenmesi,
4 – İşi yapacak ekibin belirlenmesi,
5 – İşin (yazılan kodun) düzgün olmasının sağlanması,
6 – Kodun ve tüm dökümanların yedeğinin alınması,
7 – Kalite kontrol için iyi bir test sürecinin yürütülmesi,
8 – Yazılım yapan ekibe aşama aşama ödemelerin yapılması,
9 – Kısacası kalite güvencesi ve devam eden süreçte yani teslimat sonrası bu kalitenin korunması.

Bu hizmetler için proje büyüklüğüne göre değişen aylık bir danışmanlık ücreti ile anlaşıp yazılımın kaliteli çıktı üretmesi ve sürekli hatalara karşı denetlenip yazılım ekibi ile koordineli çalışma sağlanması danışmanın temel görevi olacaktır.

Hangi ekip ya da şahış ile çalışıyorsanız çalışın bir proje yönetimi ve proje liderine ihtiyacınız bulunuyor. Hiçbir ekip ya da şahıs bilen biri tarafından denetlenmiyorsa düzgün ve kaliteli bir iş çıkaramayabilir. Bunu garanti etmek için bu danışmanlık şart görünüyor. Yoksa projeniz için üretilen çıktılar ve harcanan para boşa gidebiliyor.

Umarım bu konuda detaylı ve faydalı bir yazı olmuştur. Bir sorunuz olursa buradan yorum bırakabilir veya iletişim bölümünden benimle irtibata geçebilirsiniz.

Flutter önceki yazılarımda da bahsetmiştim Google’ın mobil uygulama geliştirmek için tek bir platforma mobil uygulamayı geliştirmeye imkan sağlayan platformunun adı diyebiliriz. Flutter aslında google ın çok eskiden beri kullandığı Dart programlama dilini kullanıyor. Flutter hakkında geniş bilgiyi https://flutter.dev/ den edinebilirsiniz.

Şimdi gelelim çok samimi eleştirilerime;

Öncelikle flutter ile mobil uygulama geliştirmek zevkli ve heyecan verici. Özellikle başlarda. Hem android hem ios için aynı anda kod yazmak çok güzel. Bir taşla 2 kuş vurmak tam buna denir. Google’ın yani flutter ın sunduğu şey standart android ve ios da yapılan herşeyi burada da yapabiliyor olmanız.

Sistem aslında dart dosyalarından oluşuyor. İlk olarak çalışan bir main.dart dosyanız var ve bu dosya içinde geliştirmeye başlıyorsunuz. Temel olarak her screen için bir dart dosyası oluşturarak ilerleyebilirsiniz. Tasarımınızı ve business logic dediğimiz iş yapan kodlarınız herşey bu kod içinde bulunabiliyor. Zaman içinde sisteme aşina oldukça tekrarlayan kodlarınızı class mantığında ayrı dart dosyalarınıza koyup oradan çağırıyorsunuz.

Bu yazımda aslında flutter ile nasıl mobil uygulama geliştirilir den daha çok ne gibi sıkıntılar yaşadım ondan bahsetmek istiyorum daha çok. Çünkü flutter development zaten her yerde anlatılıyor. Ancak bu flutter ı kullanmalımıyım o konuda net çok fazla şey yok.

Öncelikle çok dikkatli olmalı ve yazdığınız her kodu hem android hem ios da her aşamada test etmelisiniz. Bazı kütüphaneler birbiri ile çakışabiliyor ve siz android de işin sonuna kadar geldiğinizde ve ios a baktığınızda bir türlü ios derleyemediğiniz bir konumda kendinizi bulabilirsiniz. Bu çok üzücü ki herşeyi baştan neden ios da çalışmıyor diye ele alamanız anlamına geliyor. Yani aslında tek yerde yaz ikisinde de sıkıntısız çalışsın diye bir durum yok malesef. Özellikle pubspec.yaml yani projenin kullandığı kütütphanelerin dosyasına dokunuyorsanız her seferinde fluttter clean yapıp sonra xcode build yapılması için flutter run ı ios sumulator için çalıştırmanızda fayda var. Nedense flutter geliştirenler önce android de yapıp en son ios build almaya çalışıyor ama bence beraber olmalı. İşte bu yüzden de sürekli bir mac de çalışmanız ihtiyacı ortaya çıkıyor.

Tabiki tek developer avantajı bulunsada bence flutter developer ios uygulama geliştirmedende android uygulama geliştirmeden de biraz anlıyor olması lazım. Ios – Xcode da çıkan problemleri çözmesi gerektiği kadar android de çıkabilecek sorunları da çözebiliyor olması lazım. Google, Android Stuidio ile de Flutter kod yazımını destekliyor olması ve Android konusunda öncü olmasından mıdır bilmem ama Android derlemelerinde pek sorun yaşamadım. Ancak Ios konusunda ios kod geliştirme konusunda sıkıntım olmamasına rağmen burada Xcode build lerde çok uzun süre beklemeler, tıkanmalar, donmalar ve hatalar ile karşılaştım. Özellikle pod install süreçlerinde çakışmalar ve kütüphanelerrin uyumsuzlukları gibi sorunlar insanı çileden çıkarıyor.

Son olarak şu görüşe vardım. Basit ve çok kütüphane kullanmadan yapabileceğiniz uygulamalar flutter için biçilmiş kaftan gibi ama gelişmiş ve kritik uygulamalar yapıyorsanız flutter da aldığınız bir hatadan dolayı takılıp kalma riskini göze alırmısınız? Ben açıkcası alamam. Ama yinede şans vermenizi tavsiye ederim. Tam olarak gerçek bir uygulama yapmadan da bunu göremezsiniz. Basit bir projenizde şans verin. Farklı görüşleriniz var ise lütfen yorumlarınızı bekliyorum.

Bu yazımı yazarken hala ios un Launching… ini bekliyorum. Nerde tıkandı yine neden tıkandı belli değil. Yeni sıfır bir proje açıp run dediğinizde ne güzel çalışıyor oysa ki…