Milliyet Emlak Uygulamaları React Native İle Yenilendi

Türkiye’nin en büyük emlak sitelerinden biri olan Milliyet Emlak ile yaptığımız çalışma sonucunda, mobil uygulamalarını React Native ile 1 ayda yeniden yazdık.

Peki neden React Native tercih ettik ? React Native tercih etmek bize neler kazandırdı ? Hepsine tek tek değineceğiz.

House Of Apps olarak Türkiye’de React Native teknolojisini en hızlı benimsemiş şirketlerden biriyiz. Güçlü bir React Native ekibimiz var. Bu bilgi birikimimizi de elimizden geldiğince sizlere aktarmak istiyoruz.


Hız

React Native’in bizlere sağladığı en büyük yararlardan bir tanesi şüphesiz hızdır. Özellikle UI katmanını inşa etmek React Native ile native mobil uygulamalara göre oldukça hızlı. Hot Reloading ve Live Reloading gibi UI katmanında yaptığımız değişiklikleri kaydeder kaydetmez ekranda görmek ve buna göre aksiyon almak inanılmaz bir hız kazandırıyor. Native platformlarda ise yaptığımız UI geliştirmelerini görmek ve test etmek için her seferinde yeniden projeyi derlemek gibi kısa gözüken ama proje büyüdükçe oldukça zaman alan bir işlemden kurtulmuş oluyoruz.

Örneğin bir butonun boyunu ve pozisyonunu ayarlamak için React Native’de harcayacağımız süre 1 birim ise, bu native platformlarda 2–3 birimlere kadar çıkabiliyor. Bunu birde her iki platform (iOS, Android) için yaptığımızı düşünürsek harcadığımız süre neredeyse 5–6 kat daha fazla oluyor.


Cross Platform

Bu konu oldukça uzun ve ayrı bir yazının konusu olmaya oldukça müsait ancak bu proje özelinde biraz değinmek istiyorum. React Native bize bu konuda daoldukça fayda sağlıyor. Platformlar arası neredeyse %80 code sharing yapabilmemize olanak sağlıyor. Örneğin bir harita modülünü her iki platformda native yazmak yerine, tek bir modül halinde her iki platformda da kullanabilmek inanılmaz bir esneklik ve zaman kazandırıyor.

Milliyet Emlak uygulamasında yapmış olduğumuz haritada ilan listeleme sayfası buna en güzel örneklerden biri. Bu sayfada, ilanları harita üzerinde gruplayıp zoom yaptıkça parçalanan noktalar halinde göstermemiz gerekiyordu.

Burada ilanları kümeleyen bir algoritma yazdık. Bu algoritma ilanları lokasyonlarına göre kümeliyor ve zoom seviyesine göre tekrar parçalara ayırıp birbirine yakın olan ilanları yeniden kümeliyor.

Bu algoritma uzaya roket fırlatmıyor ancak, bunu her iki platform için native yazsaydık, hem maintenance hemde zaman olarak iki ayrı iş yükü gerektirecekti.

React Native bize tek bir kod ile her iki platforma da bu harita özelliğini entegre edebilmemizi sağladı.


Kararlılık

Sadece ülkemizde değil, dünya genelinde de React Native yeterince kararlı mı, büyük projelerde kullanılır mı gibi konularda soru işaretleri var. Ülkemizde ise durum biraz daha farklı, React Native şuanda yeni yeni popüler olmaya başlıyor. Dolayısıyla akla ilk gelen sorular, büyük projeleri kaldırır mı? ya da yeterince performanslı mı? oluyor.

Milliyet Emlak uygulaması son derece büyük ve kompleks bir uygulama olmasına rağmen, React Native ile ilgili herhangi bir sorun yaşamadık. Büyük projelerde state yönetimi için Redux ya da Mobx gibi state container çözümleri işleri baya kolaylaştırıyor, aynı zamanda kompleks yapıları optimize etmemizi sağlıyor.

Burada dikkat edilecek bir diğer konu ise, çok fazla 3. parti kütüphane kullanmamaya özen göstermek. Projeye eklediğimiz her 3.parti kütüphane ekstra bir bağımlılık getiriyor. React Native oldukça hızlı güncelleniyor. Bazı kütüphaneler ise bu hızlı güncellemelere yetişemiyor.


Toparlarsak, 1 ay gibi bir sürede Milliyet Emlak gibi bir uygulamayı genel hatlarıyla (store submit aşaması ve diğer makyajlamalar hariç) tamamlamak oldukça başarılı sayılabilecek bir durum. Kendi ekibime bu yazı ile tekrar teşekkür etmek istiyorum, bizleri yeni teknolojiler kullanmamız konusunda özgür bırakan House Of Apps’e ayrıca teşekkür ederim.

Yakında React Native Meetup düzenleyeceğiz, meetup grubumuza katılıp etkinliklerden haberdar olabilirsiniz.