Bu yazıda hangi teknolojiyi neden seçiyoruz , nasıl seçiyoruz, seçerken ne çileler çekiyoruz ve seçim sonuçlarına nasıl katlanıyoruz gibi bir paylaşımda bulunacağım.

Muhtemelen sen de yazılımcıysan, hayatının bir döneminde “Şimdi ben hangi teknoloji yığınını seçsem?” diye kara kara düşünmüşsündür. Hatta bazen kulaklarını ‘React mi, Flutter mı? Django mu FastAPI mi?’ gibi benzer sorularla doldurup, beklenmedik anlarda “Merhaba diyafram nefesi!” diye stres atmaya çalışıyorsundur. Hiç merak etme; bugün sana kendi maceramdan bahsedeceğim ve bu acı tatlı seçme sürecini biraz olsun şenlendireceğim. Sonuçta bir seçim yapmamız gerekiyor nedenleri ile de seçip arkasında duracağız.

Öncelikle projemiz ağırlıklı planladığım üzere web tabanlı çalışacak bir saas projesi ve belli parçaları python ile prototip olarak yapılmış durumda. Bu neden önemli? Prototip yaparken genelde python veya nodejs kullanıyorum, bunun da sebebi prototip geliştirmede çok hızlı olmaları ayrıca birçok kütüphane ile hızlıca testlerimi yapabiliyorum.

Bu durumda server tarafında çalışacak kodun bir kısmı elimde var ama ortada ne ui – arayüz var ne de veritabanı sistemi ,ui ile çalışacak api mevcut.

Önce biraz teknik bilgiler verelim:

1. Front-end Teknolojisi Seçimi
   • React: Web tarafında en popüler ve büyük topluluğa sahip kütüphanelerden biri. React ile birlikte React Router, Redux gibi ek kütüphanelerle ölçeklenebilir bir yapı kurabilirsin. Arayüzü daha hızlı geliştirmek için de Tailwind CSS, Material UI veya Chakra UI gibi bileşen kütüphanelerini kullanabiliriz.
   • Next.js (React tabanlı): React üzerine inşa edilen Next.js, sunucu taraflı render (SSR) ve sayfa bazlı yönlendirme gibi özelliklerle SEO ve performans açısından avantaj sağlayabilir. SaaS projelerinde statik + dinamik sayfaları kolayca yönetmek için de faydalı oluyor.
   • Flutter Web: Flutter esasen mobil uygulamalar geliştirmek için çok popüler. Web desteği de var ancak performans ve kullanıcı deneyimi açısından henüz React/Next.js kadar yaygın kullanıldığını söyleyemeyiz. Tamamen tek bir codebase ile hem mobil hem web isteyenlerin tercih ettiği bir yol. Projenin odak noktasında web varsa React/Next.js, eğer mobil uygulamaya da hızlıca geçmek istiyorsan Flutter değerlendirilebilir.
2. Arayüzün Modern ve İyi Görünmesi İçin
   • Tasarım Kütüphaneleri:
     • React ekosisteminde Material UI, Chakra UI, Ant Design, Tailwind CSS gibi seçenekler var. Bunlar hazır bileşen setleri, responsive tasarım, tema ve tipografi gibi konularda büyük kolaylık sağlar.
     • Kullanıcıya olabildiğince basit, temiz ve hızlı bir deneyim sunmayı hedeflemek lazım???
   • UX/UI Trendleri: Modern ve sade UI trendlerini takip edebilirsin bu aşamada. Özellikle minimal, boşlukları iyi kullananmak lazım. Büyük ve okunabilir tipografi, sezgisel navigasyonlu tasarımlar revaçta.
3. Back-end ve Veri Tabanı Seçimi
   • Eğer Python ile devam edeceksek:
     • Django: Kullanıcı yönetimi, admin panel, ORM (Object Relational Mapping) gibi pek çok özelliği hazır sunuyor. Hızlı prototipleme sağlıyor.
     • FastAPI: Daha hafif, asenkron yapısıyla yüksek performanslı bir REST API sunmak için iyi bir seçenek. Özellikle microservices mimarisine uygun.
   • Veritabanı olarak PostgreSQL, MySQL veya MongoDB tercih edebiliriz. JSON verileriyle yoğun çalışıyorsak, PostgreSQL’in JSON desteği de oldukça başarılı.
4. SaaS Mimarisindeki Önemli Noktalar
   • Kullanıcı Yönetimi & Yetkilendirme: Birçok SaaS projesinde kullanıcıların rollerini veya abonelik planlarını yönetmek için entegre bir sistem gerekiyor. Django veya FastAPI’de JWT tabanlı token yapıları ya da OAuth2 gibi standartları kullanarak güvenlik sağlayabiliriz.
   • Ödeme Altyapısı: Global bir proje olacağından Stripe, PayPal vb. ödeme altyapılarına entegre olup abonelik modelini yönetebiliriz.
   • İş Akışı (Workflow) Yönetimi: Projelerde aşama aşama ilerleme, onay mekanizmaları, durum güncellemeleri ve geçmiş kaydı tutmak için tasarlanmış bir yapı. Kullanıcıların hangi adımda olduğunu, hangi onayların beklediğini ve işin ne zaman tamamlandığını net takip edebilmelisin.
   • Arka Planda Çalışan İşlemler: Uzun süren işlemleri senkron veya asenkron şekilde yönetmek için Celery (Django/Flask/FastAPI ile uyumlu) ya da RQ (Redis Queue) gibi job queue çözümlerine bakabiliriz. Bu sayede ağır işlemleri asenkron şekilde yürütüp kullanıcıya daha hızlı tepki verebiliriz.
5. DevOps, Dağıtım ve Ölçeklenebilirlik
   • Docker: Projeyi Docker konteynerleri halinde paketlemek, hem yerel geliştirme ortamında tutarlılık hem de üretim ortamında kolay taşıma sağlar.
   • CI/CD: GitHub Actions, GitLab CI/CD veya Jenkins gibi araçlarla testleri, otomatik build ve deploy süreçlerini yönetmek büyük avantaj sağlar.
   • Bulut Altyapısı: AWS, Google Cloud veya Azure’da container orchestration (Kubernetes, ECS vs.) kullanarak projenin ölçeklenebilirliğini artırabiliriz.
6. Flutter vs React Karşılaştırması
   • Eğer ağırlıklı web üzerinde koşacak bir SaaS uygulaması yapıyorsan, React/Next.js ekosistemi bize daha hızlı ve yaygın bir çözüm sunar.
   • “Aynı uygulamayı mobilde de kullanmak istiyorum, tek kod tabanıyla ilerlemek istiyorum” dersen Flutter (ya da React Native) düşünürsün. Yine de Flutter Web henüz React/Next.js kadar olgun değil; bazı karmaşık web projelerinde daha fazla ince ayar yapmak gerekebilir.

Özetle

• Front-end: React + (Material UI / Tailwind / Chakra UI) veya Next.js üzerine modern bir tasarım kurmak, web uygulaması için daha “endüstri standardı” bir yaklaşım olur.
• Back-end: Python ile Django veya FastAPI, veritabanında PostgreSQL (JSON desteği) ya da MongoDB (döküman bazlı) kullanabiliriz.
• İş Akışı & Asenkron Görevler: Celery ya da RQ gibi araçlarla uzun süren işlemleri yönet.
• Abonelik/Üyelik & Ödeme: SaaS modelinde kullanıcı rol yönetimi, abonelik planları ve ödeme entegrasyonunu sağlam bir şekilde tasarla.
• DevOps: Docker + CI/CD + bulut sağlayıcı üzerinde ölçeklenebilir bir mimari kurmaya gayret et.

Bu şekilde hem teknolojik olarak güçlü hem de kullanıcı deneyimi açısından modern bir SaaS platformu geliştirebiliriz.

Ne seçiyorum?

Next.js + FastAPI + PostgreSQL, modern ve yüksek performanslı bir web uygulaması geliştirmek için oldukça popüler bir kombinasyon. Bu yüzden mobil uygulamarda daha iyi olan Flutter ı seçmiyoruz çünkü projemiz web tabanlı ve ileride gerekirse Yine FastAPI arkada olacak şekilde bazı react kodlarını ortak kullanıp React Native ile mobil uygulama yapabiliriz çok tercih etmesemde. Ama zaten bu işte mobil uygulama düşünmüyoruz çünkü arayüz çok mobil cihazlara sığacak gibi değil. Arayüzün mobil ağırlıklı olduğu bir proje olsaydı Flutter>FastApi>PostgreSql yapardık. Web de ise UI i Next.js yapmak daha mantıklı görünüyor.

1. Next.js (Front-end)
   • React tabanlıdır ve Sunucu Taraflı Render (SSR), statik site oluşturma (SSG), API Routes gibi özellikler sunar.
   • SEO dostudur, kullanıcıya hızlı bir deneyim sağlar.
   • Arayüz (UI) tarafını yönetmek ve dinamik sayfalar oluşturmak için oldukça esnek bir yapıdadır.
2. FastAPI (Back-end API)
   • Python ile yazılmış, asenkron (async/await) desteğiyle öne çıkan, hızlı ve hafif bir web framework’tür.
   • Temel hedefi: RESTful API’lar veya GraphQL endpoint’ler gibi servis tabanlı uygulamalar geliştirmek.
   • Performansı sayesinde gerçek zamanlı veya yüksek trafikli ortamlarda rahatlıkla kullanılabilir.
3. PostgreSQL (Veritabanı)
   • Güçlü, açık kaynaklı ve ilişkisel bir veritabanı yönetim sistemi.
   • JSON desteği, güçlü sorgulama mekanizmaları, yüksek güvenilirlik ve ölçeklenebilirlik sunar.
   • FastAPI ile birlikte SQLAlchemy, Tortoise ORM gibi kütüphaneler kullanılarak kolayca entegre edilebilir.

Basit mimari şöyle olacak yani

[Next.js (Front-end)] — (fetch/axios) –> [FastAPI (REST API)] — (ORM) –> [PostgreSQL]

1. Next.js uygulaması, kullanıcıya HTML/JS/CSS çıktısını sunar. Kullanıcı etkileşimleri (butona tıklama, form gönderme vb.) sonucunda FastAPI’ye istek gönderir.
2. FastAPI, gelen isteği işleyip gerekli veritabanı işlemlerini (ekleme, silme, güncelleme, sorgulama) yapar.
3. PostgreSQL, kalıcı veri depolama işlevini üstlenir. ORM (ör. SQLAlchemy) veya direkt PostgreSQL sorguları kullanarak kayıt oluşturulabilir, güncellenebilir, silinebilir.
4. Sonuçlar JSON (ya da ihtiyacına göre farklı format) olarak geri döndürülür; Next.js bu veriyi alarak ekranda günceller.

Off Zor İş:

Sonuçta seçtik, seçerken düşündük, araştırdık ve bir yol belirledik. Yarın biri neden bunu seçtin dediğinde işte kafama göre takıldım diyemezsin, her bilirkişi gibi sağlam temellere oturtman lazım , mantıklı bir cevap verebiliyor olman lazım

Mesela “Şundan dolayı seçtim” diyebilmen lazım?

1. Performans ve Esneklik: FastAPI asenkron yapısıyla hız, Next.js ise SEO dostu SSR ile kullanıcı deneyimini destekler.
2. Modüler Geliştirme: Front-end (Next.js) ve back-end (FastAPI) ayrı proje klasörlerinde veya depo (repository) olarak tutulabilir; birindeki değişiklik diğerini doğrudan etkilemez.
3. Ölçeklenebilirlik: Uygulama büyüdükçe mikroservis mimarisine kaymak, ek hizmetler eklemek veya ayrı ayrı container/hosting yapmak kolaylaşır.
4. Python Ekosistemi: Makine öğrenmesi, veri analizi veya background task gibi konularda Python kütüphanelerinden faydalanmak istediğinde, FastAPI sana kolay bir yol sunar.
5. Topluluk ve Dökümantasyon: Next.js ve FastAPI her ikisi de popüler, iyi dokümantasyona sahip ve aktif topluluk destekli araçlardır.

Sonuç:

Zaten her projede illaki bir “Acaba şunu mu kullansaydım?” diyen çıkar. Önemli olan, senin ihtiyaçlarını hangi kombinasyonun daha iyi çözdüğüdür. Ben de projenin ihtiyaçlarını göz önünde bulundurarak NextJs-FastApi-PostgreSQL üçlüsünü tercih ettim.

Hani Slogan Vardı ya, ‘Seç beğen, al!’
Tam da öyle yaptım: Seçtim, beğendim, aldım. Bakalım başımıza neler gelecek, çok yakında sonuçları da paylaşacağım, umuyorum güzel sonuçlanır 🙂

Merhaba,

Bu yazımda olmazsa olmaz bir konudan bahsedeceğim. Yönetim paneli nedir ? Nasıl olmalıdır? Neler içermelidir?

Önce nedir bundan başlayalım. Yönetim paneli genelde atlanan bir konu oluyor bu yüzden bu konuya değinmek istedim. Bir mobil uygulama yada web sitesi yani online olarak çalışan bir uygulama yapmak istediniz diyelim. Bu uygulama yaptığı işe göre değişir ama her online çalışan uygulamanın bir yönetim sistemine mutlaka ihtiyacı vardır. Tamamen client tarafında çalışsa bile mutlaka bazı ayarlar dinamik, bazı içeriklerde dinamik yönetilmelidir. Bu şekilde olması pratik ve avantajlı olandır.

Örnek vermek gerekirse yaptığını uygulama açılırken cihaz bilgilerini bildirim gönderebilmek için api aracılığı ile backend e göndermelidir. Yada uygulama içindeki bazı bilgileri yada sayfaları api aracılığı ile çekmelidir. Yoksa uygulama statik çalışan ve yönetilemeyen bir uygulama olarak kalır. En basitinden uygulamanızı kullanan kullanıcılara bildirimler göndermek için bile bir yönetim paneline ihtiyacınız olacaktır.

En basit olan bu ihtiyaçları karşılayacak ve işinizi kolaylaştıracak bazı hazır çözümler geliştirilmiştir. Mesela firebase , onesignal gibi platformlar bu işlemleri kolay şekilde halletmenize olanak sağlar. Toplu bildirimler göndermek için bu gibi platformları kullanabilirsiniz. Ancak bazı ayarları dinamik olarak çekmek , bazı içerikleri dinamik olarak uygulamaya getirmek yada kafanızda yer alan özellikleri yönetmek için daha kapsamlı bir yönetim paneline ihtiyacınız olacaktır.

Mesela bu bahsettiğimiz platformlardan firebase de çoğu içeriği yönetebileceğiniz ve uygulama ile konuşan bir api ve arka planda çalışan bir veritabanına sahip olabilirsiniz. Bu durumda uygulamanızı da firebase e göre yazmanız gerekir.

Bazı basit işlemlerde bu tercih edilebilir. Yada sadece push bildirimleri göndermek için onesignal seçebilirsiniz. Ancak şöyle bir düşündüğümüzde biz ne isteriz?

Biz aslında bir uygulamaya sahip olacaksak tüm kontrol bizde olsun isteriz. Bir platforma bağımlı olmasın, bir sistem kapanırsa biz ondan etkilenmeyelim.

Buna geçmişten güzel bir örnek vermek gerekirse, belki duymuşsunuzdur yada duymadıysanız anlatayım bundan birkaç sene önce herkes parse platformu üzerine uygulama geliştiriyordu. Evet çok kolaylıklar sağlıyordu hatta talep üzerinde bizde bazı işler yaptık. Ancak hep içimde bir şüphe vardı bu tip altyapılar kullanırken pratik ama uzun vadede bize ait değil ve bağımlı hale geliyoruz diye. Nitekim bunları düşünürken platform sahipleri sistemi kapatacaklarını açıkladı. İnsanları mağdur etmemek için ise kodları aık kaynak olarak paylaştılar. Yani platform kodlarını. Bu tip altyapılar karmaşık sistemler ve herkese hitap eden sistemler olduğundan kodları anlamak yada sistemi kendi sunucularınızda çalıştırmak o kadar kolay bir iş değil. Bir sorun çıktığında müdahale etmeniz o kadar kolay değil. Birçok insan ise bu platformu ya kurmaya çalıştı kendi sunucularında yada yapılarında değişikliklere gitti. Bildiğim çoğu değiştirdi çünkü en güzel olan sistem yönetebildiğiniz ve hakim olduğunuz sistemdir.

Şimdi bu örneklerden sonra ihtiyacımız olan yönetilebilir sistemin nasıl olması gerektiğinden bahsedelim.

Mobil yada web uygulamaları için ihtiyacımız olan 2 bileşen var. Hatta veritabanını da düşünürsek 3 diyebiliriz.

1 –  Veritabanı : Tüm uygulama ile ilgili verilerinizin saklandığı yer. Bu veritabanı, mssql, mysql, oracle, postgresql gibi veritabanları olabilir.

2 – Yönetim paneli:  Veritabanı ile konuşan ve tim veritabanını yönetmenizi, ayarları değiştirmenizi ve işlemler yapabilmenizi sağlayan web tabanlı arayüz. Bu arayüzün mobil uygulama olması pratik değildir. Web tabanlı olması sebebi genelde bu ayarları mobil haldeyken yapmazsınız. İşinizin başına oturur ayarları yapar ve kalkarsınız. Web tabanlı arayüzler geliştirmek ve güncellemek için daha pratiktir. App store a çıkmanızı da gerek yoktur. Değişiklik için hosting de bulunan kodları değiştirirsiniz ve web yönetim paneli isteğinize göre şekillenir. Ayrıca mobil cihazınızdan da kullanabilirsiniz. Tabi bunun için hazırlanan yönetim panelinin de mobil uyumlu yani responsive dediğimiz şekilde olmalıdır.

3 – Api: Client yani app leriniz ile konuşan sizin görmediğiniz ama web servis dediğimiz kendi response dili olan (xml yada json) bir servistir. Bu serviste yönetim paneli gibi hazırlanabilir ancak arayüzü web gibi değildir. Genelde yazılımcıların yazılımcılar ile haberleştiği bir katman gibi düşünün. Mobil uygulama yazılımcısı bu api yi kullanmak için api yi yazan kişiden api doc ister. Yani api kullanım klavuzu. Mobil yazılımcı direk yönetim panelinden işlem yapamaz – yapmamalıdır. Yada direk veritabanına veri gönderemez. Bunu yapmak için belli kurallar çerçevesinde api yi çağırır. Api ye veri gönderir, api bunu işler ve veritabanına yazar ve api client a yani mobil uygulamaya haber verir. Uygulama sahibi de yönetim panelinden tüm bunları görür bu işlemleri inceler ve yönetir. Yani api bu işe yarar, client app ler ile backend arasında bağlantı kurar.

Şimdi birde yönetim panelimizin neler içermesi gerekir bundan bahsedelim.

Yapacağınız işe göre , ihtiyaçlarınıza göre şekillendirebilirsiniz. Örneğin içerik ağırlıklı bir app var ise mesela Kategoriler ve buna bağlı yazılar var. Bu kayıtları ekleme, silme, güncelleme yapabilmelisiniz. Tüm bu kayıtları kolay şekilde aratabilmeli, sıralatabilmeli,  filtreleyebilmeli, çok kayıt olduğunda da size liste şeklinde sayfalama yaparak gösterebilmelidir. Özetle bu işlemlere kayıt yönetimi diyelim. Bunu içermelidir elbette.

Ancak burada yapacağınız işleri yönetmek dışında olması gereken bazı konular var.

1 –  Güvenlik :

Bu konu genelde atlanan bir özelliktir. Yönetim paneli en çok korunması gereken yerlerden biridir. Buraya sızan bir kişi herşeyi değiştirebilir öyle düşünün. Sıradan bir kullanıcı adı ve şifre ile bu yönetim paneline girmemelisiniz. Bir parola politikası , birden fazla yanlış denemeye – brute force saldırı yani çoklu şifre denemelerine karşı korumalı olması gerekmektedir. Şifrelernizi bu yüzden karmaşık şifreler olarak belirlemelisiniz. Zaten yönetim paneli şifre belirlerken basit şifre girmenize izin vermemelidir.

2 – Yönetici yönetimi ve roller:

Ayrıca ana yönetici olarak farklı yöneticiler yaratabilmeli ve yönetim panelinin belli yerlerini kullanabilme imkanı sağlayabilmelisiniz. Bu yönetim panelini sadece ben kullanacağım diye düşünmeyin. İlerde işiniz büyüdüğünde bu basit özellik yok ise yine ihtiyacınız olacak ve tek kullanıcının olduğu sistemde şu sorunları yaşayacaksınız. Herkes aynı kullanıcı ile işlem yaptığından bir sorun olduğunda kimin ne yaptığını bilemeyiz.

3 – Log:

Bunu anlamak için herkes farklı kullanıcılar ile girmeli ve yönetim paneli altyapınız audit log dediğimiz yönetim loglarını tutmalıdır. Yani kim ne işlem yaptı ne değiştirdi bunu süper yönetici rolundeki kişiler kolay şekilde görebilmelidir. Yani yönetim panelinden süper yönetici roller, izinler , yeni yöneticiler belirleyebilmelidir. Her yönetici tipi farklı işler yapabilir. Bu yüzden yönetim panelinizin her giren kişi için farklı menüler ve haklar ile çalışması gerektiği ortaya çıkar.

4 – Mobil uyumluluk: Bu çok önemli olmasada bilgisayar başında değilken rahat işinizi yapabilmeniz acilen bir ayar değiştirmeniz gerektiğinizde zorlanmamanız açısından yönetim panelinizin mobil uyumlu olması önemlidir.

Bu yazıda yaptırdığınız yada yapacağınız mobil uygulamada yönetim paneli neden önemli ve neleri içermeli onu anlatmaya çalıştım. Sorularınız olursa lütfen çekinmeyin.