Sıfırdan mobil uygulama geliştirmek

Muhammet İkbal Yaşar
GISEra
Published in
7 min readDec 4, 2018

--

Mobil uygulama yazmak eminim bir çok kişinin aklına gelmiştir. Metrobüste, otobüste, arabada, spor yaparken, yemek yerken vs vs vs diye uzayıp giden zamanlarda aklında fikir uçuşmaları yaşayıp, -ya şu projeyi yapsam aslında köşeyi 40 defa dönerim, ya da şu uygulamayı yapsam çok ciddi bir ihtiyacı gidermiş olurum dediği zamanlar?. Benim oldu, oluyor, olacak :)

Bir gün yine böyle bir gün :), ben uzanmışım… Dedim ki bir ekşiye gireyim bakayım gündemde neler var. Ben entrylerin arasında kaybolurken birden o garip duygu hasıl oldu bana. Tamam dedim, sonra sahibinden de biraz yalı falan baktım, gelecek milyonların yatırım planını tamamladım ve geri işime döndüm :D… Tabi bunların hepsi şaka :)

Şaka ama bağlantısı var. Nedir o bağlantı birazdan açıklayacağım.

Mobil uygulama yazmak tek yönlü bir iş değil, tabi yapacağınız uygulama ile alakalı bir durum ama bizim burada örnek alacağımız uygulama web servisler ile haberleşen, kullanıcı girişli olan, yorumlar yapılıp okunan, 2 platformda da yayında olan (iOS-Android) bir uygulama olacak.

Gelelim ekşisözlük ile bağlantısına… Bir uygulama yapma fikri geldi. Bu uygulama ile üniversite öğrencileri tüm üniversiteleri, bunların bölümlerini görüp yorum yapabileceği, uzmanların veya sınava girip başarı elde etmiş kişilerin tavsiyelerini okuyacağı, meslekleri görüp onlara yorumlar yapıp paylaşımları okuyacağı, aklına gelebilecek tüm soruları sorup cevaplar arayacağı bir platform hayal ettim. Nasıl olur bunun tasarımı, uygulaması derken (evet ekşisözlük uygulamasında gezinirken düşünüyorum bu detayları ve ampül yandı) tamam esinleneyim bu uygulamadan dedim. Ve esinlendim :). O sebeple uygulama üzerinde anlatacağım kısımlar bu esinlenme ile bağlantılı olacak.

Detaylarda boğulmayalım… Ve başlayalım.

Uygulamanın Android versiyonunu yazan, veritabanı hazırlamasını ve yönetimini üşenmeden yapan, kod yazım hızına hayran olduğumuz arkadaşımız Teoman Yaman’a teşekkür ediyorum :). Reyiz eline sağlık ::)

Uygulama fikriniz varsa ilk olarak bunu kağıda dökün, üstün körü öyle detaylı değil (üstte fikrimi üstünkörü anlatmıştım). Sonra sakin kafa ile madde madde yazın, uygulamada neler olmalı ve uygulama nasıl çalışmalı, bu uygulama ne yapmalı gibi. Gelelim benim fikrimin maddeler halindeki detayına;

  • Tüm üniversiteler olmalı
  • Üniversiteye ait lisans- önlisans tüm bölümler olmalı
  • Her bölüme insanlar yorum yapabiliyor olmalı
  • Kullanıcıları bilinçlendirmek için tüm meslekler eklenmeli
  • Her mesleğe insanlar yorum yapabiliyor olmalı
  • Uzmanların tavsiyeleri ve motivasyon arttırıcı makaleler olmalı
  • Kullanıcı özgürce soru sorabilmeli ve diğer kullanıcılar cevap verebilmeli
  • Kullanıcı girişi & kullanıcı sözleşmesi & gece-gündüz tema kullanma seçenekleri gibi özelliklerin olacağı ayarlar sayfası olmalı

Evet özellikleri çıkarttık. Sıra nasıl bir uygulama olmasında. Yani tasarım, daha doğrusu karakalem(wireframe) çalışmasında. Bu konu bence en önemli kısımlardan biri. Yapacağınız uygulamanın tasarımını burada belirliyorsunuz. Ben malum esinlendiğim için bu aşamada çok zorluk yaşamadım ama aşağıdaki gibi bir tasarım hazırladım. Tasarımda Tabbar menü kullandım, artık trend bu yönde. Bir çok uygulama menü tasarımından Tabbar menüye geçiş sağladı. Bence gayet başarılı bir yaklaşım. Tavsiye ederim.

Tasarım sayfasından örnek

Evet wireframe de hazır. Bundan sonra uygulamanın gerçek tasarımlarının yani giydirilmiş tasarımlarının hazırlanmasında. Bunun için macOS işletim sisteminde çalışan efsanevi tasarım programı sketch’i kullanacağız. Web ve mobil uygulama tasarımları hazırlarken sağladığı avantajlar işimizi ciddi anlamda kolaylaştırıyor. Bu tasarım uygulama kodlama aşamasında bize hem altlık görevi görüyor, hemde uygulamamıza ekleyeceğimiz ikon&görsel tasarımları uygulamadan export alarak kullanmamıza olanak sağlıyor. Aşağıda uygulamamız için hazırladığımız tasarımdan örnek bir ekran paylaşıyorum.

Evet bir sonraki aşamaya geçelim. Şayet kendiniz için geliştirdiğiniz bir uygulama değilse, kodlamaya başlamadan bu uygulamanın prototipini oluşturmanızı tavsiye ederim. Siz daha bir satır kod yazmadan prototipler yardımıyla uygulamayı bitmiş gibi kullandırıp istek&talep&değişiklikleri alıp tasarımı revize etmenize olanak sağlayacak. Yarin kodlarken sürpriz bir taleple karşılaşma ihtimalinizi oldukça azaltacak, aynı zamanda da müşteri gün sonunda elinde nasıl bir uygulama olacağını görmüş olacağı için mutsuz olma ihtimali çok azalacak ve beklentiyi karşılamış olacaksınız. Bunun için marvel adlı prototip hazırlama uygulamasını öneriyorum. Hazırladığım örnek prototip aşağıdadır.

Örnek olarak gif ekledim. Marvelden hazırlayabilirsiniz.

Evet bir sonraki aşamaya artık rahatlıkla geçebiliriz. Veritabanı hazırlama. Elimizde mobil uygulamaya ait tasarımlar var. Sıra bu uygulamada kullanacağımız verileri üretmede. Veri üretmek burada ikiye ayrılıyor. Birincisi kendin uygulama hazırlama esnasında oluşturduğun veri, ikincisi ise uygulama yaşadıkça oluşacak veri (kullanıcıların girdiği paylaşımlar vs). Bizim uygulamamızda her iki veri şeklide var. Misal meslekler tablomu ben oluşturup verilerini ilk başta ekledim ama mesleklere yapılacak yorumlar kullanıcılardan geldiği için şimdilik boş tablo olarak oluşturdum. Burada ilişkisel veritabanından bahsetmiyorum, bu zaten böyle bir uygulamada olmazsa olmazımız. Burada şu ayrıma girelim:

Yaptığınız bir uygulama canlı veri barındırmıyorsa offline veritabanları kullanılabilir. Mobil dünyada realm & SqLite gibi offline veritabanları var. Realm performans olarak çok daha hızlı. Kullanabilirsiniz. Eğer canlı veri ve anlık olarak güncellenmesi gereken, online diye tabir ettiğimiz etkileşimin aktif olduğu bir uygulama ise online veritabanı kullanmanız gerekiyor. Burası tabi lebiderya. Oracle & MSSQL gibi baba DB ler var, haricen firebase & realm cloud gibi online platformlarda bulunmakta. Firebase ücretsiz olarak kullanılabilir. Tabi veri tutma(ilişkisel tablo olayları) biraz farklı olsada ücretsiz olması baya iş görüyor. Gelelim bizim uygulamamıza; ben uygulamamızda MSSQL kullandım. Neden diyecek olursanız: Hali hazırda MSSQL kurulu sunucumuz var, bir çok ilişkisel tablomuz olduğundan esnek davranabileceğim için bu veritabanını seçtim. Aslında ilk olarak Amazon Web Service (AWS) üzerinden ücretsiz servis hizmetini kullanarak servisimi host etmiştim lakin daha yayına çıkmadan ücretsiz kısmı yeterli olmadı ve 65 dolarlık(2 ay süre zarfında) masraf çıkarttığı için üyeliği iptal ettirdim. Dip not olarak paylaşayım.

Verileri attık, ilişkisel tabloları oluşturduk, sequensler&triggerler derken tüm yapıyı modelledik. SQL üzerinden CRUD işlemlerini test ettik. Sorunsuz tertemiz veritabanımızda hazır :)

Evet bir sonraki adıma geçebiliriz. Mobil uygulama tasarımlar veritabanı vs hazır. Kodlamaya geçebilir miyiz?

Hayır

Uygulamayı kodlamaya geçtiğimiz anda en basit ekranda bile eksikliğini göreceğimiz şey nedir? O kadar veritabanı hazırladık ama nasıl erişeceğiz, bu verileri nasıl kullanacağız?

Web servis yazarak verilerimizi uygulamamızda kullanılabilir hale getirmeliyiz

Simdi bu kısım önemli, neden? Veritabanındaki veriler modelleyip istenilen formatta sunduğun yer. İlişkileri yönettiğin, mobil uygulama üzerindeki işlemleri hafiflettiğin, istediğin modeli sunucu tarafında hazırlatıp aldığın kısım. Kısacası uygulamanın arkaplanı. Ben burada ne kullandım? MVC Web Api. Neden? Web Api .Net Framework üzerinde RESTful servisler yazmamızı sağlayacak ideal bir platform. Geliştirme yapması oldukça basit ve Exception & Cache mimarileri oldukça performanslı ve yönetilebilirdir.

Uygulamada kullandığım servisleri hazırladım. Yaklaşık 20 metod barındıran servisi sunucumuzda IIS altından yayınladım. Linkleri uygulama yazmadan önce test ettim. Bunun için Postman isimli ide’yi kullandım. Yazmış olduğunuz apileri test edip dokümante edebileceğiniz, topluca paylaşabileceğiniz hayat kurtaran yararlı bir uygulama. Tavsiye ederim kullanabilirsiniz.

Durun sıkılmayın az kaldı :)

Evettt artık son adıma geçmemize hiç bir engel kalmadı. Nedir son adım? Mobil uygulama hazırlamak&kodlamak. Bunun için iOS platformu ve swift yazılım dilini kullandım. Yazılım mimarisi olarak MVC kullandım. Aranızda MVVM olsaydı diyenler olabilir. Mantıklı evet ama belli sebeplerden dolayı MVC’yi tercih ettim. Bu kısım ayrı bir makale konusu olur :). Anlatırız inşAllah.

Ve son adım… Uygulamamızın kodlaması bitti, ilgili cihazlarda test ettik, sonuç başarılı. Artık Apple store üzerinden yayınlaması kaldı. Bunun için geliştirici (developer) hesabınızın olması gerekli. Hesabınızda bu uygulamayı oluşturup, uygulama özelliklerini girip, uygulama kurulum dosyasını yükleyerek onaya gönderiyorsunuz. Apple 1–2 günde, Google 1–2 saate uygulamanızı inceleyip onaylayınca artık sizinde bir mobil uygulamanız olmuş oluyor. Geriye yaslanıp keyfini çıkartabilirsiniz :)

Ben de yukarıdaki adımları yaptım. Uygulamamın mağaza görüntülerini hazırladım, bilgilerini girdim. Kullanıcılara bildirim yollayabilmek için bildirim servisi ekledim(push notification). Eklediğim bildirim servis hizmeti OneSignal diye bir servis. Çok başarılı. Ücretsiz kullanım mümkün, tavsiye ederim. İndirimleri takip etmek içinde Fabric ekledim, aynı zamanda event ve kırılmalarıda kontrol ediyor.Uygulama onaya göndermeden kullanıcı sözleşmesi, gizlilik sözleşmesi gibi kullanıcıyı bilgilendirme amaçlı hazırlanan sözleşmeleride ekledim. Uygulama 2. gün sonunda onaylandı ve mağazada yerini aldı.

Uygulama store görüntüsü

Ve hedefime ulaşmış bununmaktaydım. İş yoğunluğum sebebiyle evde arada sırada baktığım bir projeydi. Merak edenler olabilir; tüm süreçleri hesaba katarsam 3 ay gibi bir sürede bitirmişimdir diye düşünüyorum.

Uygulamanın aynı anda Android versiyonuda yazıldı. Uygulama yapma planınız varsa, birde kullanıcı etkileşimli bir uygulamaysa her iki platformdada hazırlamanızı tavsiye ederim.

Toparlayacak olursak

Yapılması gereken adımları maddeler halinde yazalım. İlla süreç bu şekilde ilerleyecek diye bir durum söz konusu değil. Bu benim yoğurt yiyişim.

  • Bulduğumuz fikri gelişi güzel yazıyoruz.
  • Bu fikri düşünerek güzelleştiriyor ve uygulamada olmasını istediğimiz özellikleri maddeler halinde yazıyoruz.
  • Bu maddeleri düşünerek karakelem tasarımlarını hazırlıyoruz.
  • Bu tasarımlara bakarak canlı tasarım giydirmelerini tasarım programları yardımıyla(sketch) hazırlıyoruz.
  • Bu tasarımları prototip(marvel) haline getiriyoruz.
  • Uygulama yapısına göre veritabanı (online&offline) modelini belirliyoruz. Ona göre bir platform seçip verileri ve ilişkisel yapıları(tabloları) hazırlıyoruz.
  • Hazırlanan verileri uygulamada kullanabilmek için seçilecek servis platformu yardımı ile yayınlıyoruz. Yani web servisleri yazıyoruz.
  • Mobil platformda bu servisleri tüketecek uygulamamızı kodluyoruz.(iOS veya Android)
  • Yüklenecek mağazaya (Apple & Google) göre derleme yapıp, store hazırlıklarını tamamlayarak yayınlıyoruz.

Bu yazım umarım yeni başlayan veya süreçlerde aklı karışan herkese tüm resmi görmesinde yardımcı olur. Tabi ben bana göre doğru olan yaklaşımı paylaşıyorum. Eğer öneriniz&tavsiyeniz olursa çekinmeden fikrinizi söyleyebilirsiniz.

ikbalyasar@gmail.com adresinden bana ulaşmanız mümkün :).

Son olarak uygulamamızın ismini üni sözlük yaptık. Aslında biraz da olaya eğlence katarak ekşi sözlüğün hala çocuğunu yaptık diyelim :) Tabi üvey halasının oğlu, çok yakın sayılmaz ama kan çektiği bir nokta var tabiki :)))

Uygulamanın linkini paylaşıyorum. Merak edenler bakabilir.

Edit: 30 Ağustos 2019

Linkler silinmiştir.

EkşiSözlük yönetimi uygulama tasarım ve yapı benzerliğinden dolayı avukatları aracılığıyla ihtar çektiği için uygulamamızı yayından kaldırdık. Kaldırılmadan önceki görüntüsünü paylaşayım.

Uygulama yayınlandıktan 1–2 gün sonra trendlere girmiş olması ayrıca sevindirdi bizi :)

Buraya kadar geldiysen aşağıdaki yazı işine yarayabilir :)

“Sıfırdan Girişim Kurmak ve Mobil Uygulama Üzerine”

Sağlıcakla kalın.

Takipte kalın :)

--

--