React mı Angular mı Daha Avantajlı?

Event Hero Image

React mı Angular mı daha avantajlı? Hangisini tercih etmeliyim?


Frontend yazılım dünyasında trend konuların başında gelen bu karşılaştırma için konuşmaya başlamadan önce sanırım ikisi hakkında da biraz bilgi vermek iyi olacaktır. JavaScript kütüphaneleri içerisinde en popüler olan iki yapıdan bahsediyoruz. React en popüler kütüphanelerden biridir, Angular ise en popüler framework lerinden biridir. Şimdi biraz daha derinine inelim. Günümüz yazılım dünyasında gelişmişlik düzeyi artan yeni kütüphane ve frameworklerde yazılım mimarisi avantajlarından oldukça faydalanılmakta. Bunlardan örnek vermek gerekirse ölçeklendirilebilirlik, esneklik ve kolay kullanım bağlamında tercih edeceğimiz teknolojinin yürüteceğimiz yazılım operasyonuna doğrudan etkisi olacağını söylemek makul olacaktır.

Bu etkiyi doğru planlayabilmek adına da tercihimizi bilinçli yapmakta fayda var. Mesela büyük şirketler tercihlerini yönetirken bu konuda oldukça bilinçli davranıyorlar, onlar için arkasında büyük bir dağıtıcının/sağlayıcının isminin varlığı büyük bir güven oluşturuyor ayrıca kullanıcı ve ekosistem karşılaştırmasına göre hareket ederek tercihlerini yapıyorlar. İlgili konu başlıklarında da değineceğimiz üzere büyük dağıtıcı firmalar teknolojilerinin artan kullanımları için önemli bir güvence oluşturuyorlar. Konuyu ikisi hakkında da başlıklar halinde konuşup yazı sonuna doğru daha öznel şekilde tercih yorumları yapmayı planlıyorum, şimdiden duyurulur 📢


React Nedir ve Ne durumda? React Bizlere Neler Sağlıyor?



React kütüphanesinin popülerliği çıkışından itibaren hiç azalmadı. Bunun başlıca sebeplerinden biri de Facebook mühendisleri tarafından geliştirilmiş olmasıdır. Açık veriyi destekleyen yapısıyla açık kodlu bir biçimde 2013 senesinde piyasaya sürülmüştür. An itibariyle de Angular JS framework ünün üstünde bir popülariteye sahip olduğu söylenebilir. Angulardan nispeten daha dar bir source code yani kaynak koduna sahip olmasına rağmen daha popüler yapıda olduğundan daha çok geliştiriciye sahiptir. Bu veri de geliştirilme durumunun daha iyi olduğunu bize göstermektedir. Geliştirme durumu kıyaslaması için çözüme kavuşmamış sorun/vaka sayısılarını karşılaştırabiliriz. Detaylı inceleme için react open issues internet araması yapılabilir. Yazı yazıldığında güncel 550 ye yakın açık vaka bulunmakta.


React zamanında Facebook uygulaması üzerindeki hızlı geri reaksiyon alamama geç cevap dönmesi dolayısıyla anlık veri değişiminin yavaş olmasından muzdarip olunan bir noktada geliştirildi. Eski sistemde farklı web programlama ve farklı JQuery sistemiyle web sitemiz anlık mesajlaşma gibi değişimlere gerektiği kadar hızlı ayak uyduramıyordu. Yani yeteri kadar hızlı anlık mesajlaşamıyor veya anlık bildirimler alamıyorduk. React JS ile bileşenleri daha verimli ve daha özgür şekilde modellemek mümkün hale geldi bununla birlikte web programlamada devrim niteliğinde bir değişim oldu denilebilir. Öyle ki Angular JS 2 ‘nin Google tarafından geliştirilmeden önce React JS incelenerek işe başlandığı bilinen bir gerçek. Dinamik değerler üzerindeki değişimler ile web programlamaya bambaşka bir pencere açıldı ve değişkenler mantığı da tamamıyla değişti denilebilir. Global değişkenleri düşünün React bu değişkenleri anlık olarak değiştirip birbirleri yerine yazarak daha hızlı reaksiyon alabiliyor.



Angular Nedir ve Ne durumda? Angular Bizlere Neler Sağlıyor?


Facebook tarafından geliştirilen hayli güçlü pazar rakibi React tan bahsettik, ancak Angular JS de Google şirketi tarafından geliştirilmiş bir framework tur. Yani dağıtıcıları konusunda birbirine pek de üstünlükleri olmadığını söylersek yanlış bir yorum yapmış sayılmayız. 2013 te duyurulan rakibine karşın Angular JS 2016 da duyurulmuştur. Kendi gelişimini farklı sürümler üzerinden tamamlayan Angular önceki versiyonunun daha gelişkin halidir. Bahsi geçen Angular JS in ikinci varyantı Angular yüzlerce geliştiricisi ile varlığını hayli iddialı şekilde sürdürmekte. Bu framework ana tabanında TypeScript dili kullanılmış bir JavaScript framework üdür. Geliştirme durumlarının kıyaslanması için kullandığımız veri open issue sayılarıdır. React için 550 ye yakın olan bu veri, Angular JS için güncel olarak 2.400 civarlarında seyretmekte. Buradan da daha detaylı kaynak koduna rağmen daha az geliştiricisinin olmasının ilerlemenin nispeten daha yavaş olması sonucuna götürdüğünü görebiliriz. Angular TypeScript bazlı kodlama temelinden dolayı bunu öğrenmeyi gerekli kılıyor ve bu durum da yeni geliştiricilerin öğrenme hızını oldukça düşürüyor. Bunun yanısıra Angular framework ü bize modüler, servis ve component yapıları bakımından farklı bir yaklaşım getiriyor. Bu yaklaşım da öğrenme hızını temelde oldukça düşürüyor.


React JS in Angular JS e takip ve geliştirici sayısında üstünlüğü yukarıdaki ilgili tablodan kolaylıkla seçilebiliyor.


Birbirlerinden Farkları Nelerdir?


Angular JS ve React JS i bir de birbirlerinden farkları yönünde inceleyelim. Söze birinin framework birinin ise bir kütüphane olduğundan bahsederek başlayalım. Angular framework u Model View Controller mimarisine dayanan bir JavaScript framework udur. Buna karşın React JS JavaScript temelli bir User Interface kütüphanesidir. Angular'ın modüler bir yapısı vardır, cross-platform bir yapısı vardır böylece mobil, web veya desktop uygulaması geliştirilmeye müsaittir. Ancak React JS in yapısı daha başkadır yukarıda da sözünü ettiğimiz üzere farklı destekler için farklı geliştirmelere ihtiyaç duymaktadır, örneğin geliştirilen React Native ile ancak mobil geliştiricilik yapılabilir, React JS in standart yapısı buna uygun değildir. Ayrıca two-binding yapısı sayesinde aynı değişkene bağlı farklı yapılar da tetiklenir. React in ise component bazlı çözümleri daha farklıdır. Ayrıca Angular mevcut paketleriyle birlikte gelir ve uygulama geliştirmek için tüm gereksinimleri içerisinde barındırır oldukça kapsamlı olduğundan söz edilebilir. Ancak React in farklı destekler için yeni geliştirici çözümlerine ihtiyaç olduğundan bahsetmiştik. Örneğin, kapsamlı bir web uygulaması geliştirmek adına redux, react router, axios gibi ek kütüphaneleri de deneyimlemek gerekecektir React JS ile geliştiricilik yaparken. Bunun yanısıra, React JS i öğrenmek nispeten daha kolay sayılabilir şahsına münhasır yapısını çözümlemek dışında JavaScript yapısına hakim olmak yeterli olacaktır. Ancak Angular için gereksinim TypeScript yapısı olacağından bu hususta ise React JS e artı bir puan diyebiliriz.


Avantajları bakımından kıyaslayalım;


Öncelikle Angular JS in de React JS in de şüphesiz iyi bir dokümantasyona sahip olduğunu söyleyebiliriz. Bu iyi dökümantasyon varlığı tabiki bize avantaj sağlayacaktır ancak birbirlerine üstünlük kurabilecekleri kadar bariz farkları olmadığı ortada. Yazılım mimarileri ve teknik özellikleri bazında incelemekte fayda var. Anguların temellerinin TypeScript dili ile kök salmaya başladığını söylemiştik. Peki nedir bu TypeScript? 📖

TypeScript Microsoft tarafından geliştirilmiş bir JavaScript varyantıdır. JavaScript e birtakım eklemelerin varlığıyla geliştirilmiş, bu sayede Nesne Tabanlı Programlama mimarisini sağlar hale gelmiş, kalıtım ve kapsama nesne tabanlı problemlerini çözmüş ve mimariyi karmaşıklığı yüksek projeler için elverişli hale getirmiştir. JavaScript in eksiklerini gidermiş daha güncel hale getirilmiş/update edilmiş JavaScript gibi düşünülebilir. React bir framework olmadığı için birtakım özellikleri kendi içerisinde otomatik olarak mevcut halde bulunduramıyor, yani örneğin mobil uygulama desteği için React- Native e ihtiyaç duyacaksınız. Bu React-Native de yüksek katılımda bulunulan proje geliştiricileri tarafından ek destek halinde geliştirilmiştir. Angular JS framework olduğundan bu tarz bir noktada daha kapsayıcıdır diyebiliriz. Performansları arasında kayda değer bir fark olmadığını söylemekte ise fayda var, böylece ikisinin de rakiplerine oranla performans kıyaslamalarında daha avantajlı olduğu söylenebilir. İkisi de güncel olarak yenilikler getirilmeye açık ve devamlı bir katılım var projelerine böylece güncelleme konusunda ikisi de hayli avantajlı ancak React daha yüksek katılımcı sayısı ve kullanım ağının anlık değişim talepleri üzerine bu konuda daha ileride. Angular Nedir başlığı altında kısmen bahsettiğim öğrenme hızı düşüklüğüne sebebiyet vermesi dolayısıyla React JS'i öğrenmenin Angular JS den daha kolay olduğunu söylersek sanırım sürçü lisan etmiş olmayız. Çünkü yeni bir dil yapısı öğrenmene gerek kalmıyor. Ancak Angular da framework olmasının verdiği ek desteklerle birlikte React JS e karşı mobil destek, http protokol desteği gibi ek araçlar kurulumu ve öğrenimini gerektirmediği için bu bağlamda artı puan alıyor diyebiliriz.


Seçim Nasıl Yapılabilir? Hangisinde karar kılmalıyım?


Frontend yazılım dünyasının bu iki JS değeri birbirine çok bariz üstünlük kuramamakta öncelikle bunu kabul etmek gerekiyor. Ancak devrimsel etkisiyle React gönüllerde taht kurmaya aday. Yine de component ve variable bazlı getirdiği tamamen farklı anlayışıyla React in Angular a oranla daha esnek olduğunu söyleyebiliriz, ihtiyacınız bu yöndeyse tercih bellidir. TypeScript bazlı kodlamalar yapmayı tercih ediyorsanız Angular seçiminiz size fayda sağlayacaktır ama JavaScript JavaScript olarak kodlansın yahu TypeScript de neymiş diyenlerdenseniz React açmış kollarını sizi bekliyor. Çünkü React JS de her şey JavaScript ken Angular JS de olaylar daha farklı ilerlemekte. Yine de birinin size Nesne Yönelimli Programlama ve benzeri özellikler getirdiğini de unutmamakta fayda var. Tercihiniz size fayda getirmeleri oranında olursa daha mantıklı olacaktır, yani ihtiyacınızı yorumlamanız size kazanç sağlayacaktır. Benim tercihim API bazlı kullanımlar gibi hızlı bir geliştirme süreci gerekiyorsa, React JS, ancak web projesi bazlı kullanımlarda Docker Container/Composer benzeri yapılar kullanacaksam ve yüksek karmaşıklıkta bir proje üzerinde çalışıyorsam Angular JS kullanımından yana.



Giray Baha Kezer 6 Şubat 2021

Seni En İyi Şirketlerle Eşleştirelim 🚀

Yazılımcıların Kariyer Platformu Coderspace'de kaydını oluştur, yazılım dili, maaş beklentisi gibi bilgilerini tamamla, Türkiye ve Avrupa'dan en uygun şirketlerle eşleş!

En Son Yazılar

Coderspace'den ilginizi çekebilecek son yazılar

Image placeholder
Image placeholder
Image placeholder