iOS Uygulamalarınızda VIPER Mimarisinin Kullanılması

Ferhan Akkan
Appcent
Published in
4 min readFeb 7, 2021

Merhabalar, bu yazımda sizlerle birlikte iOS uygulama geliştirme sürecinde VIPER patern’inin kullanımına bakacağız. Bildiğiniz üzere tasarım patern’lerini uygulamamızın temel nedeni; daha test edilebilir kod yazmak. Her ne kadar ülkemizde test yazılmasa da, test edilebilir bir proje aslında düzenlemesi ve yeni özellikler eklenmesi daha kolay olan bi proje anlamınada geliyor.

En popüler olan MVC tasarım patern’in kullandığımızda bildiğiniz üzere ViewController belli bir noktadan sonra çok şişiyor. Bunun sonucunda hem yeni feature eklemek hem de test yazmak daha karmaşık hale geliyor. Bundan dolayı MVC artık ihtiyaçlarımızı karşılamamaya başlıyor. Bu noktada projenizin büyüklüğü ve uygulamanın yaşam süresine göre daha uygun bir tasarım patern’i seçmeniz gerekli.

Peki ne zaman VIPER’ı seçmemiz lazım sorusu akıllara geliyor. VIPER’ı kullanmanız gereken uygulamalar genellikle büyük ve uzun süreli projeler olarak tanımlanabilir. Bunlara en güzel örneklerden biri bankaların mobil uygulamaları diyebiliriz. Çünkü aynı proje üzerinde yıllarca yeni feature’lar ekleniyor ve test edilebilirlik oldukça önemli bir noktada.

Projenize VIPER kullanımına uygun olduğunu düşünüyorsunuz ve takım olarak VIPER tasarım paterni üzerinde yapınızı ilerletmeye karar verdiniz. Bu noktada sizler için en önemli konu bütün ekibin VIPER tasarım patern’ine hakim olması gerektiği hususu. Çünkü bu patern’i tamamen kavramamış bir ekip için karmaşadan başka bir şey getirmeyecektir.

Teknik kısma geçmeden önce VIPER’ın sizlere getirdiği artı ve eksi yönlerine bi göz atalım.

VIPER’ın Artıları

  • Uygulamanızın test edilebilirliğini artırır.
  • Yeni özelliklerin temiz ve sorunsuz bir şekilde eklenebilmesi sağlar.
  • Uygulamanın yapısı daha düzenli olması.
  • ViewController’ın yükünü 5 ana parçaya böldüğünden ötürü görevlerin ayrıştırılısını sağlar.

VIPER’ın Eksileri

  • Uygulamada çalışacak olan ekip tasarım pattern’ine hakim olması gerekmektedir.
  • Projeye dahil olan kişi daha önceden VIPER kullanmadıysa projeye dahil olmasını zorlaştırır.
  • Küçük projelerde karmaşıklığı artırır.

Temel artı ve eksilerine baktıktan sonra teknik açıdan VIPER’ı incelemeye başlayabiliriz.

VIPER Nasıl Çalışır ?

VIPER MVC de ViewController’ın yüklenmiş olduğu iş yükünü 5 katman olarak böler. Bunlar view, presenter, router, interactor ve entity’dir. Bu iş yükünü tek bir yerde çözmek yerine 5'e böldüğünden dolayı ek geliştirmeler yapılmasını oldukça kolaylaştırır. Bu 5 katman görevlerini inceleyelim.

V → View: UIViewController’ın view kısmı olarak değerlendirebilirsiniz.

I → Interactor: Servis işlemlerinin yapıldığı katmandır. (Konum servisi, network servisi)

P → Presenter: Presenter logic işlemlerin yapıldığı katmandır. Ayrıca router , interactor ve view arasında bağlantıyı sağlamaktadır.

E → Entity: Modellerimizi temsil etmektedir.

R → Router: Ekran geçişlerinin sağlandığı katmandır.

Kurallar

VIPER Katmanlar Arası Bağlantı Şeması

1- View ile Presenter kendi aralarında konuşabilir.

2- Presenter Router ile konuşabilir ancak Router Presenter ile konuşamaz.

3- Presenter Interactor ile kendi aralarında konuşabilir.

4- Interactor servis katmanlarıyla konuşabilir. Servis katmanları olmadan kod yazılmış ise servis işlemlerini kendi bünyesinde işler ve Entity ile konuşarak modelleri oluşturabilir.

5- Ekran geçişleri ve aksyonları router tarafından yapılır.

Gördüğünüz üzere bu 5 katmanın omurgası olarak Presenter görev almaktadır. Şu ana kadar teorik kısımdan bahsettik şimdi basit bir uygulama ile pratikte ne şekilde ilerliyor görelim.

Örnek uygulamamız 2 ekrandan oluşacak. Birinci ekranda konum bilgimizi alındıktan sonra ekranda bir buton belirecek ve olduğumuz konumun hava durumunu 2ci ekranda bize göstermesini sağlayacağız.

Örnek projeyi önceden yazdığımdan ötürü örnek kodları buraya ekleyerek sizlere genel akış mantığını anlatacağım. Yazı sonunda bulabileceğiniz proje link’i üzerinden projenin tamamına erişebilirsiniz.

Location Ekranı İçin Katmanların Oluşturulması.

Kullanıcımızın lokasyonunu alacağımız ekranımız için entity hariç her katman için bir swift dosyası oluşturuyoruz. Ayrıca bu katmanların birbiri ile konuşabilmesini sağlamak adına protokollerimizi yazacağımız bir LocationProtocol dosyasıda oluşturuyoruz.

Öncelikle Location ekranımızı kapsayan katmanların arasında iletişimi sağlamamızı sağlayacak olan protokolleri yazıyoruz.

Buradaki akış şu şekilde olacak. Uygulama açıldıktan sonra Location’ın View’u görüntülendiğinde View pesenter’a haber verir. Presenter kullanıcıdan lokasyon bilgisi için erişim izni almak için Interactor’a haber verir. Interactor daha önceden yazmış olduğum LocationService üzerinden kullanıcının lokasyon bilgisini alma iznini sorgular ve sonucu Presenter’a haber verir. Eğer ki kullanıcı konum bilgisi kullanım izni var ise Presenter kullanıcının konumunu talep ettiğini Interactor’a bildirir. Interactor kullanıcının konum bilgisini LocationService üzerinden temin eder ve Presenter’a geri gönderir. Lokasyon bilgisi elinde olan Presenter artık View’a Hava Durumunu Göster butonun gösterilmesi için haber gönderir. View üzerinde gösterilmiş olan Hava Durumunu Göster’e kullanıcı tıkladığında bir sonraki ekrana geçmek için View tarafından Presenter’a haber verilir. Presenter ekran geçiş işleminin gerçekleşmesi için router’a parametreler ile birlikte haber gönderir. Router aldığı haber doğrultusunda bir sonraki ekrana geçişi sağlar.

Weather Ekranı İçin Katmanların Oluşturulması

Location ekranında olduğu gibi gene entity hariç her bir katmanımız ve protokollerimiz için dosyalarımızı oluşturuyoruz.

Ikinci ekrana geçiş sağlandığında akış şu şekilde olacaktır. View ekranda görüntülendiğinde View tarafından Presenter’a haber gönderilir. Bunun doğrultusunda Presenter Interactor’dan hava durumu bilgilerin ister. Bunun için önceki ekrandan kendisine init üzeirnden sağladığımız konum bilgilerini kullanmaktadır. Interactor QuickApi servisi ile belirlenen endpoint’e istek atar ve hava durumu bilgilerine ulaşır. Interactor bilgiler ulaştıktan sonra gelen response model’i Presenter’a iletir. Presenter gelen response modelin içerisinden gerekli veriyi label’ı update etmek için View’a gönderir.

Uygulamamızı çalışır hale getirebilmeniz için son yapmamız gereken ise AppDelegate dosyamızda UIWindow’un rootunu değiştirmek. Bu sayede uygulama ilk açıldığında gösterilecek olan lokasyon bilgisini temin ettiğimiz ekranımızın görüntülenmesini sağlamış olduk. Sonrarsında apiden hava durumunu alacağımız QuickApi kütüphanesinin request süresini belirlememiz ve api’nin URL’ini eklemek. Artık örnek projemiz kullanıma hazır.

Bu yazımızda VIPER’ın bir projede ne şekilde kullanabileceğinizi inceledik. Muhtemelen ilk defa okuduğunuzda mantığını kavrayamayabilirsiniz. Bundan dolayı bu örnek projeyi alıp kendi projenizi yazmanızı tavsiye ederim. Uyguladıkça aslında ne kadar basit olduğunu ve faydalarını göreceksiniz.

Hava durumunu almış olduğumuz api => https://openweathermap.org/api

Uygulama içerisinde kullanmış olduğum LocationService’e ulaşmak için örnek projenin bütününe link’ten ulaşabilirsiniz => https://github.com/ferhanakkan/ViperMediumExample

--

--