v2.5.2
Giriş yap

Flutter ve React Navite üzerine

Anonim
107 defa görüntülendi

Arkadaşlar merhaba,

Yaklaşık 2 senedir flutter ile mobil geliştirme yapıyorum, web de ise genellikle django tercih ediyorum.

Ancak mobil de react native kafamı oldukça kurculayor ve bana şöyle düşündürüyor, hmm rn yazarsam hali hazırda js ve ts den de çok uzaklaşmam ve flutterdan biraz sıkıldım açıkcası hali hazırda react bildiğim için rn de bir yönden ağır basmıyor değil ve popularitesi malum.
İş imkanlarına baktığım zaman ise flutter tr de bir tık daha önde, sizin bu konudaki fikirleriniz nedir, paylaşır ve aklımdaki soru işaretlerini gidermeme yardımcı olursanız çok sevinirim, herkese kolay gelsin, iyi kodlamalar...

ebykdrms
82 gün önce

Üst Edit: Çok uzun bir yazı oldu. Nihai düşüncem son paragrafta. Aradakiler tamamen iç dökme :)

Flutter'da durum nedir bilmiyorum ama React Native'de zırt pırt güncelleme geliyor. Kullandığınız paketler yeni sürüme destek getirinceye kadar siz uygulamanızı -azmetmezseniz- yeni sürüme geçiremiyorsunuz. Üstelik bazı sürüm yükseltmeleri öyle temelden yapılıyor ki, native kodları da düzenleyerek eklediğiniz paketlerin yeni sürümde nasıl yer edinmesi gerektiğini çözmekle uğraşıyorsunuz. Sırf bu yüzden mümkün olduğunca -hazır paket bulunmasına rağmen- ihtiyacımı kendi bileşenimi oluşturarak gideriyorum. Bu iyi de oluyor tabi. Benim kontrolümde, sadece benim ihtiyacım olan kod kalabalığına sahip bileşenlerim oluyor. Ama işin Swift veya Kotlin/Java tarafına çok hakim olmadığım için burada da kısıtlanıyorum tabi.
Yani React Native tarafında sürekli versiyon yükseltmeleri oluyor ama 3. taraf paketler buna uyum sağlayamadığından sorunlar yaşıyorsunuz.
Bunun haricinde React Native ile kod yazmak -özellikle Typescript desteğiyle- çok keyifli.
Mobil yazmaya karar verirken hem Flutter'ı hem React Native'i başlangıç düzeyinde denemiştim. Flutter'a bir türlü ısınamamıştım. En azından o dönemde, çokça çözümleri olsa bile beni aslında bu çözümler içinde bir konfor alanı yaratıp aslında kısıtlıyor gibi hissetmiştim. Aslında felsefesi hoşuma gitmişti. Aslında çok da native bileşenlere bağımlı olmayan, oluşturulan bileşenleri ekranda kendisi resim çizer gibi çizen, aslında bütün işleri web'deki bir <canvas> üzerine çizim yapar gibi halleden bir yapı kurmuşlardı. Bence bu harika bir çözümdü ve ekrana mükemmel bir hakimiyet kurmamı sağlayacağını, gerekirse kendi yamuk yumuk görünen bileşenlerimi bile oluşturabileceğimi düşünmüştüm. Yani aslında geçmişten özlediğim Flash ve ActionScript ile uygulama geliştirir gibi uygulama geliştirebileceğim bir yapı ile karşılaşacağımı ummuştum. Ama bunun yerine, hazır bileşenleri prop'lar vasıtasıyla özelleştirebileceğim bir yapı ile karşılaştım. Başlangıçta header'ı, footer'ı, yan menüsü falan olan gelişmiş bir bileşen ile başlıyordum ve bunun üzerinde geliştirmeler yapıp özelleştiriyordum. Ama bu bana bootstrap geliştirilmiş web sitesinde css ile overload yaparak geliştirme yapar gibi hissettirdi. İşin kötüsü, okuduğum dokümanlar ve izlediğim eğitim videoları bunun harika bir özellik olduğundan, işleri çok hızlandıracağından bahsediyorlardı. Evet, başlangıç düzeyinde insanı cezbediyor hızlıca gelişmiş bir görünüm elde edebilmek. Ama beni cezbetmedi çünkü beklentilerim bambaşkaydı. Ben de bu işler böyle yürüyorsa -muhtemelen yanıldım ama- Flutter'ın bana göre olmadığına karar verdim. Bu sırada React Native ise başlangıçta bana bomboş bir ekran sunuyordu. "Zaten React biliyorsundur, al web sitesi tasarlar gibi tasarla" diyordu. Ben o sırada pek React da bilmiyordum aslında ama bu boş ekranda geliştirme yapmak bana daha çekici geldi. Bu sıralarda React Native de eski class yapısından kurtulup fonksiyonel bir yapıya dönüyordu ve yeni yapısında bileşen oluşturmak sıradan bir javascript fonksiyonu oluşturmak gibi kolaydı. Bir bileşenin stateful/stateless olup olmadığını belirtmek falan da gerekmiyordu. Bir state kullanıyorsan otomatikman stateful oluyordu. Kullanmazsan stateless devam ediyordu. Çok basit, anlaşılır ve sıfırdan özelleştirilebilir bir yapı. Evet, hayal ettiğim gibi Flash rahatlığında tasarım oluşturamam belki ama neredeyse Web rahatlığındayım. Bir index.html dosyası oluşturmuşum ve imleç ilk satırda yanıp sönüyor. Buradan nereye gidebileceğim benim hayal gücüme kalmış. Flutter'da ise gelişmiş bir html istekeleti ile başlıyorum ve bunu özelleştirip nereye gideceğim yine bana kalmış. Yani birinde bana özel bir yapı kuruyorken diğerinde ihtiyacım olabilecek her şeyi barındıran bir yapıyı bana özgü hale getirmek için çalışıyorum. Kişiden kişiye değişir tabi ama ben React Native'in sunduğu yapıyı daha esnek bulduğum için o yolu tercih ettim. Dediğim gibi muhtemelen yanılmışımdır. Sadece başlangıç düzeyinde Flutter inceledim sonuçta.

ChatGPT'ye şu prompt'u verdim: "ekrana merhaba dünya yazan bir bileşenin react native ve flutter örneklerini ver."

Flutter için şu örneği oluşturdu:

import 'package:flutter/material.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: const Text('Merhaba Dünya App'),
        ),
        body: const Center(
          child: Text(
            'Merhaba Dünya',
            style: TextStyle(fontSize: 20, fontWeight: FontWeight.bold),
          ),
        ),
      ),
    );
  }
}

React Native için ise şu:

import React from 'react';
import { Text, View, StyleSheet } from 'react-native';

const App = () => (
    <View style={styles.container}>
         <Text style={styles.text}>Merhaba Dünya</Text>
    </View>
);

const styles = StyleSheet.create({
  container: {flex: 1, justifyContent: 'center', alignItems: 'center', backgroundColor: '#fff'},
  text: {fontSize: 20, fontWeight: 'bold'},
});

export default App;

Bu iki örneğe bakınca React Native için web'e yakın düzeyde bir tasarım esnekliğim var. Flutter'da ise elementi ortalamak için Center gibi başka bileşenler kullanmam gerekiyor. Yani ben yazının ortada değil de sağa yaslı olmasını istesem stil değiştirmek yerine bileşen değiştirmem gerekecek. Ya da adı Center olan bir bileşene, içerikleri sağa yaslı olsun diye style vermem gerekecek.
Bir de aynı iş için React Native'de kullandığım 2 bileşene karşılık Flutter'da Widget > Material App > Scaffhold > Center'ın da child prop'unu kullanarak 4 widget kullandı. Muhtemelen 1-2 widget'la da çözebilirdi aslında işi. Ama işte ChatGPT de o konfor alanında kalmayı seçti. Kodda yaratılan arrow anti-pattern durumu da -aslında böyle olmak zorunda değildi biliyorum- ama ister istemez oluşuveriyor.
Aslında bakınca Flutter'ın Center gibi bileşenler kullanması native koda yakınlık açısından çok daha doğru ve kodun native koda çevrilmesi açısından daha verimli gibi görünüyor. Ama Flutter'ın asıl felsefesi "ekrana piksel piksel çiziyorum" olduğu için bu durum bana itici geliyor. Aslında native'e uyumluluk açısından aynı şeyi React Native de yapabilirdi ama yapmamayı tercih etmişler. Böylece React Native "bırak böyle native uyumluluk gibi şeylerin hesabını ben yapayım, sen kodununun en sade haliyle işlevine odaklan" diyerek gönülümü almış oldu. Tabi dediğim gibi, belki 2 hafta daha Flutter'ın üzerine gitsem bu düşüncelerimin tamamen yanlış olduğu kanısına varırdım. Ama işte iletişimde ilk temasın önemi. :) Ben kendi adıma C# dilinin keskinliği ve Visual Studio'nun yüzlerce imkânı ile web sitesi geliştirmek yerine PHP'nin veya Node.js'in esnekliği ve Visual Studio Code'un rahatlığında web sitesi geliştirmeyi tercih ediyorum. Evet, güvenlik için belki daha çok çaba gerektiriyor. Belki performans için kodu daha dikkatli yazmam gerekiyor. Ama beni kalıplardan uzak tutuyor. PHP'de bile bir framework kullanırken Laravel yerine Codeigniter kullanmayı tercih ederdim. Çünkü Laravel'in aksine Codeigniter'da PHP özgürlüğünü hissedebiliyorsunuz. Bu tamamen yazılımcının tercih meselesi. Zaten Codeigniter da gitgide Laravel'e benzemeye başlayınca PHP'den de uzaklaşmaya başladım. Şu sıralar Node.js'çiyim diyebilirim. :) Bir de sırf makine öğrenmesi veya derin öğrenme üzerine merakım olduğundan ufak ufak Python çalışmalarım oluyor ama profesyonel anlamda web tarafında React, mobil tarafta React Native ile para kazanıyorum.
Bana sorarsan web tarafında da React yerine Svelte kullanmak çok daha heyecan verici. Ama işte Svelte'in de geliştiricisi az olduğundan pek hızlı gelişemiyor. Hatta x = x; gibi garip kodlar yazmak gerekebiliyor ki bu benim için göz kanatan bir kod. :D Ve Svelte de bu gibi durumların önüne geçmek için günden güne React'a benzemeye başlıyor gibi bir izlenim uyandı bende.
Eskiden harika bir Flash'ımız ve ActionScript'imiz vardı. Google'ın başını çektiği bir çok firma el birliğiyle Adobe'nin bu projesini güvenlik açıkları nedeniyle durdurdular. Tarayıcılarda Flash uygulamalarını engellediler. Zamanla Flash geliştiricileri web'den el çekmek zorunda kaldı. Mobil'de Flash'la halen -özellikle oyun alanında- harika işler ortaya çıkarılabiliyordu. Şu an orada son durumu bilmiyorum ama orada da sanırım Microsoft'un Unity projesi -ki çok beğenirim kendisini- baskın geldi. Ben Google'dan Adobe'ye karşı bu tutumunun üzerine ondan daha iyisini Flutter ile başaracağını ummuştum ama umduğumu bulamadım. Flutter ile yazmak -temelde- React Native ile yazmaktan çok da farklı değildi. Birinin Component dediğine biri Widget diyordu. Flutter'da hayal ettiğim tasarım ortamını bulamadım. Hal böyleyken, yukarıda da bahsettiğim nedenlerle Flutter yerine React Native'i tercih ettim.
Aslında aklımın bir köşesinde Flutter için hep bir "acaba" var ama az önce ChatGPT'nin örneğinde gördüğüm extends StatelessWidget ifadesi halen orada olduğu için bu acaba'yı yine ertelemek istedim mesela. React Native bu ifadeden (extends React.Component) kurtulalı yıllar oldu. Ayrıca nesne tabanlı kod geliştirmek iyidir hoştur ama gerekli gereksiz her yerde nesne tabanlı kod yazmayı da doğru bulmuyorum. React Native de böyle düşünmüş olacak ki -zaten Javascript'e pek uygun da olmadığından- başlangıçta nesne tabanlı gitmesine rağmen sonradan fonksiyonel tabanlı bir yapıya döndüler. Ben de tam bu dönüş sırasında mobile geçiş yaptığımdan React Native beni yakalamış oldu.

Özetle, Flutter'ı pek bilmediğim için karşılaştırma yapamayacağım. Ama React Native'den, yükseltme problemleri hariç, memnunum. Kod yazarken keyif alıyorum.