Tek bir kod taban\u0131ndan hem masa\u00fcst\u00fc, hem mobil hem de web uygulamalar\u0131 geli\u015ftirmek hayal mi? Modern yaz\u0131l\u0131m d\u00fcnyas\u0131n\u0131n karma\u015f\u0131kl\u0131\u011f\u0131n\u0131 basitle\u015ftirirken, Smart Caf\u00e9 gibi projelerde g\u00f6z al\u0131c\u0131 kullan\u0131c\u0131 deneyimleri yaratman\u0131n s\u0131rlar\u0131n\u0131 ke\u015ffedin. Bu makale, .NET ekosisteminin g\u00fcc\u00fcn\u00fc kullanarak nas\u0131l tek bir C# kod taban\u0131yla \u00fc\u00e7 farkl\u0131 platform i\u00e7in muhte\u015fem kullan\u0131c\u0131 aray\u00fczleri olu\u015fturabilece\u011finizi ad\u0131m ad\u0131m a\u00e7\u0131kl\u0131yor.<\/p>\n
G\u00fcn\u00fcm\u00fcz\u00fcn dijital \u00e7a\u011f\u0131nda, i\u015fletmelerin ve son kullan\u0131c\u0131lar\u0131n beklentileri s\u00fcrekli olarak artmakta. Art\u0131k bir uygulaman\u0131n sadece web \u00fczerinde var olmas\u0131 yeterli de\u011fil; mobil cihazlarda kusursuz \u00e7al\u0131\u015fmas\u0131, hatta geleneksel masa\u00fcst\u00fc ortamlar\u0131nda da sa\u011flam bir deneyim sunmas\u0131 bekleniyor. Ancak bu \u00e7oklu platform gereksinimi, yaz\u0131l\u0131m geli\u015ftiriciler i\u00e7in \u00f6nemli zorluklar\u0131 beraberinde getiriyor. Her platformun kendine \u00f6zg\u00fc bir programlama dili (\u00f6rne\u011fin, iOS i\u00e7in Swift, Android i\u00e7in Kotlin\/Java, Web i\u00e7in JavaScript), farkl\u0131 bir geli\u015ftirme \u00e7er\u00e7evesi ve ayr\u0131 bir UI\/UX tasar\u0131m yakla\u015f\u0131m\u0131 gerektirmesi, geli\u015ftirme s\u00fcre\u00e7lerini inan\u0131lmaz derecede karma\u015f\u0131k ve maliyetli hale getirebilir.<\/p>\n
Bu durum, \u00f6zellikle kaynaklar\u0131 k\u0131s\u0131tl\u0131 olan veya h\u0131zl\u0131 pazara \u00e7\u0131kmak isteyen i\u015fletmeler i\u00e7in b\u00fcy\u00fck bir engel te\u015fkil ediyor. Bir projeyi \u00fc\u00e7 ayr\u0131 ekip veya ayn\u0131 ekiple \u00fc\u00e7 farkl\u0131 teknoloji y\u0131\u011f\u0131n\u0131 kullanarak geli\u015ftirmek, yaln\u0131zca zaman ve para israf\u0131na yol a\u00e7makla kalmaz, ayn\u0131 zamanda kod tabanlar\u0131 aras\u0131nda tutarl\u0131l\u0131k sorunlar\u0131, hata ay\u0131klama zorluklar\u0131 ve bak\u0131m maliyetlerinin artmas\u0131 gibi pek \u00e7ok operasyonel riski de beraberinde getirir. \u00d6rne\u011fin, bir hatay\u0131 gidermek veya yeni bir \u00f6zellik eklemek istedi\u011finizde, bunu her platform i\u00e7in ayr\u0131 ayr\u0131 yapman\u0131z gerekir. Bu da inovasyon h\u0131z\u0131n\u0131 yava\u015flat\u0131r ve kullan\u0131c\u0131 deneyiminde tutars\u0131zl\u0131klara neden olabilir. M\u00fc\u015fterileriniz farkl\u0131 platformlarda farkl\u0131 aray\u00fczler ve davran\u0131\u015flarla kar\u015f\u0131la\u015ft\u0131klar\u0131nda, marka alg\u0131s\u0131 olumsuz etkilenebilir.<\/p>\n
\u0130\u015fte tam bu noktada, Smart Caf\u00e9 gibi modern bir i\u015f modelini d\u00fc\u015f\u00fcnelim. Bir kafe i\u015fletmesinin dijital d\u00f6n\u00fc\u015f\u00fcm\u00fc i\u00e7in masa\u00fcst\u00fc, mobil ve web platformlar\u0131nda g\u00fc\u00e7l\u00fc bir varl\u0131\u011fa ihtiyac\u0131 var:\n<\/p>\n
Bu \u00fc\u00e7 farkl\u0131 platform i\u00e7in \u00fc\u00e7 ayr\u0131 kod taban\u0131 olu\u015fturmak, hayata ge\u00e7irilmesi zorlu ve maliyetli bir i\u015f olacakt\u0131r. Her biri i\u00e7in ayr\u0131 bir geli\u015ftirme ekibi veya uzmanl\u0131k gerektirecek, s\u00fcrekli entegrasyon ve senkronizasyon problemleri do\u011furacakt\u0131r. \u0130\u015fte bu sebeple, tek bir kod taban\u0131 kullanarak bu \u00e7oklu platform ihtiyac\u0131n\u0131 kar\u015f\u0131lamak, hem geli\u015ftirme verimlili\u011fi hem de proje s\u00fcrd\u00fcr\u00fclebilirli\u011fi a\u00e7\u0131s\u0131ndan kritik bir \u00f6neme sahiptir. Bu yakla\u015f\u0131m, sadece maliyetleri d\u00fc\u015f\u00fcrmekle kalmaz, ayn\u0131 zamanda daha h\u0131zl\u0131 iterasyonlar yap\u0131lmas\u0131na, tutarl\u0131 bir kullan\u0131c\u0131 deneyimi sunulmas\u0131na ve nihayetinde i\u015fletmenin rekabet avantaj\u0131 elde etmesine yard\u0131mc\u0131 olur. Modern .NET ekosistemi, \u00f6zellikle .NET MAUI ve Blazor gibi teknolojileriyle, bu zorluklar\u0131n \u00fcstesinden gelmek i\u00e7in g\u00fc\u00e7l\u00fc ve entegre bir \u00e7\u00f6z\u00fcm sunar. \u0130lerleyen b\u00f6l\u00fcmlerde bu \u00e7\u00f6z\u00fcm\u00fcn detaylar\u0131n\u0131 inceleyece\u011fiz.<\/p>\n
.NET, Microsoft taraf\u0131ndan geli\u015ftirilen ve geni\u015f bir uygulama yelpazesi i\u00e7in kullan\u0131lan g\u00fc\u00e7l\u00fc, a\u00e7\u0131k kaynakl\u0131 bir geli\u015ftirme platformudur. Ge\u00e7mi\u015ften g\u00fcn\u00fcm\u00fcze \u00f6nemli evrimler ge\u00e7irerek, g\u00fcn\u00fcm\u00fczde tek bir kod taban\u0131yla farkl\u0131 platformlara ula\u015fma yetene\u011fiyle \u00f6ne \u00e7\u0131kmaktad\u0131r. Peki, bu ekosistem ve i\u00e7erisindeki kilit teknolojiler, \u00e7apraz platform geli\u015ftirmenin temel ta\u015flar\u0131n\u0131 nas\u0131l olu\u015fturur?<\/p>\n
.NET ekosistemi, zaman i\u00e7inde ciddi bir d\u00f6n\u00fc\u015f\u00fcmden ge\u00e7mi\u015ftir. \u0130lk olarak Windows odakl\u0131 geli\u015ftirme i\u00e7in tasarlanm\u0131\u015fken, .NET Core ile birlikte a\u00e7\u0131k kaynakl\u0131 ve platformlar aras\u0131 bir yap\u0131ya b\u00fcr\u00fcnm\u00fc\u015ft\u00fcr. .NET Core’un ortaya \u00e7\u0131k\u0131\u015f\u0131, Linux, macOS ve Windows gibi farkl\u0131 i\u015fletim sistemlerinde ayn\u0131 kodun \u00e7al\u0131\u015fmas\u0131na olanak tan\u0131yarak geli\u015ftiricilere b\u00fcy\u00fck bir esneklik kazand\u0131rm\u0131\u015ft\u0131r. Daha sonra .NET 5, .NET 6, .NET 7 ve .NET 8 gibi s\u00fcr\u00fcmlerle bu ekosistem, .NET Framework, .NET Core ve Xamarin gibi farkl\u0131 teknolojileri tek bir birle\u015fik platform alt\u0131nda toplamay\u0131 hedeflemi\u015ftir. Bu birle\u015fme, geli\u015ftiricilerin farkl\u0131 projeler i\u00e7in farkl\u0131 .NET versiyonlar\u0131 aras\u0131nda ge\u00e7i\u015f yapma ihtiyac\u0131n\u0131 ortadan kald\u0131rarak geli\u015ftirme s\u00fcrecini sadele\u015ftirmi\u015ftir.<\/p>\n
Bu birle\u015fik platform, Ortak Dil \u00c7al\u0131\u015fma Zaman\u0131 (CLR) ve Temel S\u0131n\u0131f K\u00fct\u00fcphanesi (BCL) gibi temel bile\u015fenleri payla\u015farak t\u00fcm .NET uygulamalar\u0131na tutarl\u0131 bir \u00e7al\u0131\u015fma ortam\u0131 sunar. Bu, i\u015f mant\u0131\u011f\u0131n\u0131z\u0131 ve veri modellerinizi bir kez yaz\u0131p, farkl\u0131 platform projelerinde yeniden kullanabilece\u011finiz anlam\u0131na gelir. \u00d6rne\u011fin, Smart Caf\u00e9 projenizin men\u00fc y\u00f6netimi, sipari\u015f i\u015fleme veya kullan\u0131c\u0131 kimlik do\u011frulama gibi temel i\u015f mant\u0131\u011f\u0131n\u0131 C# ile bir kez yaz\u0131p, bunu hem masa\u00fcst\u00fc, hem mobil hem de web uygulamalar\u0131n\u0131zda kullanabilirsiniz. Bu durum, kod tekrar\u0131n\u0131 en aza indirirken, geli\u015ftirme verimlili\u011fini ve uygulama tutarl\u0131l\u0131\u011f\u0131n\u0131 art\u0131r\u0131r. Visual Studio gibi entegre geli\u015ftirme ortamlar\u0131 da bu s\u00fcrecin ayr\u0131lmaz bir par\u00e7as\u0131 olarak, geli\u015ftiricilere g\u00fc\u00e7l\u00fc hata ay\u0131klama, test ve da\u011f\u0131t\u0131m yetenekleri sunarak t\u00fcm bu ekosistemi destekler.<\/p>\n
.NET Multi-platform App UI (MAUI), Xamarin.Forms’un evrimle\u015fmi\u015f halidir ve tek bir kod taban\u0131ndan hem mobil (Android, iOS) hem de masa\u00fcst\u00fc (Windows, macOS) uygulamalar\u0131 geli\u015ftirmek i\u00e7in tasarlanm\u0131\u015f bir \u00e7er\u00e7evedir. Xamarin.Forms, mobil platformlara odaklan\u0131rken, .NET MAUI bu kapsam\u0131 geni\u015fleterek yerel masa\u00fcst\u00fc uygulamalar\u0131n\u0131 da kapsayacak \u015fekilde ilerlemi\u015ftir. Bu, geli\u015ftiricilerin Smart Caf\u00e9 projesi gibi senaryolarda, masa\u00fcst\u00fc kasiyer uygulamas\u0131 ile mobil m\u00fc\u015fteri uygulamas\u0131n\u0131 ayn\u0131 C# ve XAML kod taban\u0131n\u0131 kullanarak olu\u015fturabilece\u011fi anlam\u0131na gelir.<\/p>\n
.NET MAUI’nin mimarisi, “tek proje” yakla\u015f\u0131m\u0131 etraf\u0131nda d\u00f6ner. Bu, t\u00fcm platformlar i\u00e7in kaynaklar\u0131 (resimler, yaz\u0131 tipleri vb.), kod dosyalar\u0131n\u0131 ve yap\u0131land\u0131rmalar\u0131 tek bir projede bar\u0131nd\u0131rabilece\u011finiz anlam\u0131na gelir. Farkl\u0131 platformlara \u00f6zg\u00fc ihtiya\u00e7lar i\u00e7in ise platforma \u00f6zel kod yazma esnekli\u011fi sunar. Kullan\u0131c\u0131 aray\u00fczleri genellikle XAML (Geni\u015fletilebilir Uygulama \u0130\u015faretleme Dili) kullan\u0131larak tan\u0131mlan\u0131r ve bu, tasar\u0131m\u0131n koddan ayr\u0131lmas\u0131n\u0131 sa\u011flayarak daha temiz ve y\u00f6netilebilir bir yap\u0131 sunar. MVVM (Model-View-ViewModel) deseni, .NET MAUI geli\u015ftirmede yayg\u0131n olarak kullan\u0131l\u0131r ve UI mant\u0131\u011f\u0131n\u0131 i\u015f mant\u0131\u011f\u0131ndan ay\u0131rarak test edilebilirli\u011fi ve s\u00fcrd\u00fcr\u00fclebilirli\u011fi art\u0131r\u0131r. Bu sayede, Smart Caf\u00e9 uygulaman\u0131zdaki men\u00fc g\u00f6sterimi veya sipari\u015f verme ekran\u0131 gibi bile\u015fenleri hem mobil hem de masa\u00fcst\u00fc i\u00e7in benzer bir yap\u0131da tasarlayabilir, ancak gerekti\u011finde platforma \u00f6zg\u00fc g\u00f6rsel ayarlamalar yapabilirsiniz. \u00d6rne\u011fin, mobil cihazlarda dikey d\u00fczenleme \u00f6ncelikliyken, masa\u00fcst\u00fcnde daha geni\u015f bir alandan faydalanarak yatay d\u00fczenlemeler tercih edilebilir.<\/p>\n
Geleneksel web geli\u015ftirme genellikle JavaScript, HTML ve CSS \u00fc\u00e7l\u00fcs\u00fcne dayan\u0131rken, Blazor bu paradigmaya C# ile yeni bir soluk getiriyor. Blazor, C# ve .NET kullanarak tam y\u0131\u011f\u0131n (full-stack) web uygulamalar\u0131 olu\u015fturman\u0131za olanak tan\u0131yan bir .NET web \u00e7er\u00e7evesidir. Blazor’\u0131n temel g\u00fcc\u00fc, C# kodunu taray\u0131c\u0131da WebAssembly \u00fczerinde \u00e7al\u0131\u015ft\u0131rabilmesi veya sunucu taraf\u0131nda i\u015fleyebilmesidir. Bu da geli\u015ftiricilerin, JavaScript’e ba\u011f\u0131ml\u0131l\u0131\u011f\u0131 azaltarak veya tamamen ortadan kald\u0131rarak, t\u00fcm uygulamalar\u0131n\u0131 tek bir dil ve platform \u00e7at\u0131s\u0131 alt\u0131nda geli\u015ftirebilmelerini sa\u011flar.<\/p>\n
Blazor’\u0131n ba\u015fl\u0131ca modelleri \u015funlard\u0131r:<\/p>\n
Smart Caf\u00e9 senaryosunda, online sipari\u015f web sitesini veya y\u00f6netim panelini Blazor ile geli\u015ftirmek, mevcut .NET i\u015f mant\u0131\u011f\u0131n\u0131z\u0131 ve veri modellerinizi do\u011frudan web aray\u00fcz\u00fcnde kullanabilece\u011finiz anlam\u0131na gelir. Bu, \u00f6zellikle C# diline hakim geli\u015ftiriciler i\u00e7in \u00f6\u011frenme e\u011frisini d\u00fc\u015f\u00fcr\u00fcr ve kod payla\u015f\u0131m\u0131n\u0131 maksimize eder. Performansa yak\u0131n bir deneyim sunan Blazor, modern, etkile\u015fimli ve dinamik web uygulamalar\u0131 olu\u015fturmak i\u00e7in g\u00fc\u00e7l\u00fc bir alternatiftir. K\u0131sacas\u0131, .NET ekosistemi, MAUI ile mobil ve masa\u00fcst\u00fcn\u00fc, Blazor ile ise web’i tek bir \u00e7at\u0131 alt\u0131nda birle\u015ftirerek, Smart Caf\u00e9 gibi \u00e7ok platformlu projeleri daha verimli ve tutarl\u0131 bir \u015fekilde hayata ge\u00e7irme imkan\u0131 sunar.<\/p>\n
Smart Caf\u00e9 projesi, modern bir kafe i\u015fletmesinin t\u00fcm dijital ihtiya\u00e7lar\u0131n\u0131 kar\u015f\u0131lamak \u00fczere tasarlanm\u0131\u015f, \u00e7ok y\u00f6nl\u00fc bir uygulama setidir. Bu proje, hem \u00e7al\u0131\u015fanlar\u0131n operasyonel s\u00fcre\u00e7lerini kolayla\u015ft\u0131rmay\u0131 hem de m\u00fc\u015fterilere yenilik\u00e7i bir deneyim sunmay\u0131 hedeflemektedir. Projenin en belirgin \u00f6zelli\u011fi, tek bir C# kod taban\u0131 \u00fczerinden masa\u00fcst\u00fc, mobil ve web platformlar\u0131na y\u00f6nelik \u00e7\u00f6z\u00fcmler sunmas\u0131d\u0131r. Bu yakla\u015f\u0131m, geli\u015ftirme s\u00fcresini k\u0131salt\u0131r, bak\u0131m maliyetlerini d\u00fc\u015f\u00fcr\u00fcr ve t\u00fcm platformlarda tutarl\u0131 bir marka deneyimi sa\u011flamaya yard\u0131mc\u0131 olur. Peki, bu \u00fc\u00e7 farkl\u0131 aray\u00fcz, tek bir kod taban\u0131 \u00fczerinden nas\u0131l ba\u015far\u0131yla yarat\u0131l\u0131r?<\/p>\n
Smart Caf\u00e9 projesi, a\u015fa\u011f\u0131daki temel gereksinimleri ve platform da\u011f\u0131l\u0131mlar\u0131n\u0131 i\u00e7ermektedir:<\/p>\n
Bu farkl\u0131 gereksinimlere ra\u011fmen, projenin ba\u015far\u0131l\u0131 olabilmesi i\u00e7in t\u00fcm platformlarda tek bir veri kayna\u011f\u0131na ve ortak i\u015f kurallar\u0131na dayal\u0131 olmas\u0131 zorunludur. Aksi takdirde, veri tutars\u0131zl\u0131klar\u0131 ve i\u015fletme mant\u0131\u011f\u0131 \u00e7eli\u015fkileri ka\u00e7\u0131n\u0131lmaz olacakt\u0131r.<\/p>\n
Tek kod taban\u0131 stratejisinin kalbi, t\u00fcm platformlar taraf\u0131ndan payla\u015f\u0131lacak ortak bir kod katman\u0131 olu\u015fturmakt\u0131r. Bu katman genellikle a\u015fa\u011f\u0131daki bile\u015fenleri i\u00e7erir:<\/p>\n
Urun<\/code>, Siparis<\/code>, Musteri<\/code>, Kategori<\/code> gibi s\u0131n\u0131flar. Bu modeller, t\u00fcm platformlarda ayn\u0131 \u015fekilde kullan\u0131l\u0131r.<\/li>\n- \u0130\u015f Mant\u0131\u011f\u0131 (Business Logic):<\/b> Uygulaman\u0131n temel i\u015f kurallar\u0131n\u0131 ve s\u00fcre\u00e7lerini bar\u0131nd\u0131r\u0131r. \u00d6rne\u011fin, sipari\u015fin nas\u0131l olu\u015fturulaca\u011f\u0131, stok kontrol\u00fc, indirim hesaplamalar\u0131, \u00f6deme do\u011frulama gibi algoritmalar. Bu mant\u0131k, farkl\u0131 platformlardaki UI’lar taraf\u0131ndan \u00e7a\u011fr\u0131l\u0131r ancak kendisi platformdan ba\u011f\u0131ms\u0131zd\u0131r.<\/li>\n
- Servisler (Services):<\/b> \u0130\u015f mant\u0131\u011f\u0131n\u0131 d\u0131\u015f katmanlara a\u00e7an ve genellikle belirli bir g\u00f6revi yerine getiren bile\u015fenlerdir. \u00d6rne\u011fin,
UrunService<\/code> (\u00fcr\u00fcn listesi getirme, \u00fcr\u00fcn ekleme), SiparisService<\/code> (sipari\u015f olu\u015fturma, sipari\u015f durumu g\u00fcncelleme) gibi. Bu servisler, veri eri\u015fim katman\u0131yla (\u00f6rne\u011fin Entity Framework Core) etkile\u015fim kurar.<\/li>\n- Veri Eri\u015fim Katman\u0131 (Data Access Layer – DAL):<\/b> Veritaban\u0131 ile etkile\u015fimi y\u00f6netir. Genellikle Entity Framework Core gibi bir ORM (Object-Relational Mapper) arac\u0131 kullan\u0131larak uygulan\u0131r. Bu katman da temel olarak platformdan ba\u011f\u0131ms\u0131zd\u0131r, ancak API arac\u0131l\u0131\u011f\u0131yla sunucu \u00fczerinde \u00e7al\u0131\u015f\u0131r.<\/li>\n<\/ul>\n
Bu ortak kod katman\u0131 genellikle bir .NET Standard S\u0131n\u0131f K\u00fct\u00fcphanesi (Class Library) veya payla\u015f\u0131lan bir proje (Shared Project) olarak olu\u015fturulur. .NET Standard, farkl\u0131 .NET uygulamalar\u0131 ve kitapl\u0131klar\u0131 aras\u0131nda kod payla\u015f\u0131m\u0131n\u0131 sa\u011flayan resmi bir spesifikasyondur. Bu sayede, yaz\u0131lan C# kodu, hem .NET MAUI (mobil ve masa\u00fcst\u00fc) hem de Blazor (web) projelerinde herhangi bir uyumluluk sorunu olmadan kullan\u0131labilir.<\/p>\n
\n Uzman \u0130pucu: Ortak kod katman\u0131n\u0131 tasarlarken, ba\u011f\u0131ml\u0131l\u0131klar\u0131n tersine \u00e7evrilmesi (Dependency Inversion Principle) ve ba\u011f\u0131ml\u0131l\u0131k enjeksiyonu (Dependency Injection) prensiplerini aktif olarak kullanmak, kodun daha esnek, test edilebilir ve s\u00fcrd\u00fcr\u00fclebilir olmas\u0131n\u0131 sa\u011flar. Bu sayede farkl\u0131 platformlarda farkl\u0131 implementasyonlar gerektiren durumlarda, ana i\u015f mant\u0131\u011f\u0131n\u0131 de\u011fi\u015ftirmeden kolayca adaptasyon sa\u011flayabilirsiniz.\n<\/div>\n\u00d6rne\u011fin, SmartCafe.Core<\/code> ad\u0131nda bir .NET Standard k\u00fct\u00fcphanesi olu\u015fturulur. Bu k\u00fct\u00fcphane i\u00e7erisinde MenuItem<\/code>, Order<\/code> gibi modeller ve IMenuService<\/code>, IOrderService<\/code> gibi aray\u00fczler tan\u0131mlan\u0131r. Bu aray\u00fczlerin implementasyonlar\u0131 ise SmartCafe.Infrastructure<\/code> gibi ayr\u0131 bir k\u00fct\u00fcphanede Entity Framework Core ile veri eri\u015fimini sa\u011flayarak ger\u00e7ekle\u015ftirilir. T\u00fcm UI projeleri (MAUI masa\u00fcst\u00fc, MAUI mobil, Blazor web), SmartCafe.Core<\/code> k\u00fct\u00fcphanesini referans alarak bu ortak modelleri ve servis aray\u00fczlerini kullan\u0131r. Ger\u00e7ek implementasyonlar ise bir RESTful API \u00fczerinden veya Blazor Server\/Hybrid senaryosunda do\u011frudan sunucu taraf\u0131nda enjekte edilerek sa\u011flan\u0131r. Bu mod\u00fcler yap\u0131, Smart Caf\u00e9 projesinin \u00f6l\u00e7eklenebilirli\u011fini ve uzun vadeli s\u00fcrd\u00fcr\u00fclebilirli\u011fini garanti eder.<\/p>\n.NET MAUI ile \u00c7arp\u0131c\u0131 Mobil ve Masa\u00fcst\u00fc UI Geli\u015ftirme Ad\u0131mlar\u0131<\/h2>\n
.NET MAUI, tek bir C# kod taban\u0131 ve XAML kullanarak hem Android, iOS gibi mobil platformlar hem de Windows, macOS gibi masa\u00fcst\u00fc platformlar\u0131 i\u00e7in yerel g\u00f6r\u00fcn\u00fcml\u00fc uygulamalar geli\u015ftirme imkan\u0131 sunar. Smart Caf\u00e9 projesinin m\u00fc\u015fteri mobil uygulamas\u0131 ve kasiyer\/garson masa\u00fcst\u00fc uygulamas\u0131, .NET MAUI’nin bu g\u00fcc\u00fcnden faydalanarak geli\u015ftirilir. Peki, bu platformda nas\u0131l \u00e7arp\u0131c\u0131 ve tutarl\u0131 bir kullan\u0131c\u0131 aray\u00fcz\u00fc olu\u015fturabiliriz?<\/p>\n
Ortak UI Mant\u0131\u011f\u0131 ve Platform \u00d6zellikleri<\/h3>\n
.NET MAUI’nin temel prensiplerinden biri, m\u00fcmk\u00fcn oldu\u011funca fazla UI kodunu platformlar aras\u0131nda payla\u015fmakt\u0131r. Bu, XAML kullan\u0131larak ortak bir g\u00f6rsel dil olu\u015fturmakla ba\u015flar. \u00d6rne\u011fin, Smart Caf\u00e9’nin men\u00fc \u00f6\u011fesi g\u00f6sterimi, sepete ekle d\u00fc\u011fmesi veya \u00f6deme ekran\u0131 gibi temel bile\u015fenler, XAML ile bir kez tan\u0131mlan\u0131r ve t\u00fcm platformlarda kullan\u0131l\u0131r. Bu sayede hem tasar\u0131m tutarl\u0131l\u0131\u011f\u0131 sa\u011flan\u0131r hem de geli\u015ftirme s\u00fcresi \u00f6nemli \u00f6l\u00e7\u00fcde k\u0131sal\u0131r.<\/p>\n
AppShell<\/code>, .NET MAUI uygulamalar\u0131nda navigasyonu ve uygulaman\u0131n genel yap\u0131s\u0131n\u0131 tan\u0131mlayan g\u00fc\u00e7l\u00fc bir ara\u00e7t\u0131r. Sekmeler, a\u00e7\u0131l\u0131r men\u00fcler (flyout) ve sayfalar aras\u0131 ge\u00e7i\u015fler, AppShell<\/code> ile kolayca yap\u0131land\u0131r\u0131labilir. Bu, Smart Caf\u00e9 mobil uygulamas\u0131nda men\u00fc, sepet ve profil sayfalar\u0131 aras\u0131nda sorunsuz ge\u00e7i\u015fler sa\u011flamak i\u00e7in idealdir. Benzer \u015fekilde, masa\u00fcst\u00fc uygulamas\u0131nda da farkl\u0131 y\u00f6netim mod\u00fclleri (sipari\u015fler, stok, raporlar) aras\u0131nda gezinmek i\u00e7in AppShell<\/code> kullan\u0131labilir.<\/p>\nAncak, her platformun kendine \u00f6zg\u00fc UI\/UX beklentileri ve yetenekleri vard\u0131r. .NET MAUI, bu farkl\u0131l\u0131klar\u0131 y\u00f6netmek i\u00e7in esnek mekanizmalar sunar:<\/p>\n
\n- Platforma \u00d6zel Kod:<\/b> Baz\u0131 durumlarda, belirli bir platform i\u00e7in farkl\u0131 bir g\u00f6rsel veya i\u015flevsellik gerekebilir. .NET MAUI,
OnPlatform<\/code> i\u015faretlemesini veya \u00e7al\u0131\u015fma zaman\u0131 denetimlerini kullanarak platforma \u00f6zel kod bloklar\u0131 yazman\u0131za olanak tan\u0131r. \u00d6rne\u011fin, bir dosya se\u00e7ici mobil cihazlarda farkl\u0131, masa\u00fcst\u00fcnde farkl\u0131 \u00e7al\u0131\u015fabilir.<\/li>\n- Dependency Injection (Ba\u011f\u0131ml\u0131l\u0131k Enjeksiyonu):<\/b> Platforma \u00f6zg\u00fc API’lere (\u00f6rne\u011fin, konum servisleri, kamera eri\u015fimi) eri\u015fmek i\u00e7in aray\u00fczler tan\u0131mlan\u0131r ve her platformda bu aray\u00fczlerin implementasyonlar\u0131 sa\u011flan\u0131r. Ard\u0131ndan, ba\u011f\u0131ml\u0131l\u0131k enjeksiyonu ile uygun implementasyon \u00e7al\u0131\u015fma zaman\u0131nda uygulamaya verilir.<\/li>\n
- Custom Handlers:<\/b> E\u011fer .NET MAUI’nin standart kontrolleri belirli bir ihtiyac\u0131n\u0131z\u0131 kar\u015f\u0131lam\u0131yorsa, yerel kontrolleri sarmalayarak kendi \u00f6zel i\u015fleyicilerinizi (handler) olu\u015fturabilirsiniz.<\/li>\n<\/ul>\n
A\u015fa\u011f\u0131daki kod \u00f6rne\u011fi, Smart Caf\u00e9 uygulamas\u0131nda bir men\u00fc \u00f6\u011fesinin nas\u0131l XAML ile tan\u0131mland\u0131\u011f\u0131n\u0131 g\u00f6stermektedir. Bu kod, hem mobil hem de masa\u00fcst\u00fc uygulamas\u0131nda benzer bir g\u00f6r\u00fcn\u00fcmle kullan\u0131labilir:<\/p>\n
\n\n <\/code><\/p>\n
Bu XAML kodu, bir men\u00fc \u00f6\u011fesini resim, isim, a\u00e7\u0131klama ve fiyat ile birlikte bir \"Sepete Ekle\" butonuyla g\u00f6r\u00fcnt\u00fcler. Binding<\/code> ifadeleri sayesinde, ViewModel'deki veriler otomatik olarak UI'ya yans\u0131t\u0131l\u0131r.<\/p>\nResponsif Tasar\u0131m ve Temaland\u0131rma<\/h3>\n
Farkl\u0131 ekran boyutlar\u0131 ve y\u00f6nelimleri i\u00e7in uygulaman\u0131n d\u00fczg\u00fcn g\u00f6r\u00fcnmesini sa\u011flamak, responsif tasar\u0131m\u0131n temelidir. .NET MAUI, bunu desteklemek i\u00e7in g\u00fc\u00e7l\u00fc d\u00fczen panelleri sunar:<\/p>\n
\n- Grid:<\/b> Sat\u0131r ve s\u00fctun tabanl\u0131 d\u00fczenlemeler i\u00e7in kullan\u0131l\u0131r. \u0130\u00e7 i\u00e7e gridler ile karma\u015f\u0131k d\u00fczenler olu\u015fturulabilir.<\/li>\n
- FlexLayout:<\/b> Esnek kutu modeli (Flexbox) mant\u0131\u011f\u0131yla \u00e7al\u0131\u015f\u0131r ve \u00f6\u011felerin kendini otomatik olarak organize etmesini sa\u011flar. \u00d6zellikle dinamik listeler ve kart g\u00f6r\u00fcn\u00fcm\u00fc gibi senaryolarda \u00e7ok kullan\u0131\u015fl\u0131d\u0131r.<\/li>\n
- VerticalStackLayout ve HorizontalStackLayout:<\/b> \u00d6\u011feleri dikey veya yatay olarak y\u0131\u011fmak i\u00e7in kullan\u0131l\u0131r.<\/li>\n<\/ul>\n
VisualStateManager<\/code>, .NET MAUI'de uygulaman\u0131n farkl\u0131 g\u00f6rsel durumlar\u0131na (\u00f6rne\u011fin, geni\u015f veya dar ekran, odaklanm\u0131\u015f kontrol) g\u00f6re UI'y\u0131 dinamik olarak de\u011fi\u015ftirmek i\u00e7in kullan\u0131lan g\u00fc\u00e7l\u00fc bir ara\u00e7t\u0131r. \u00d6rne\u011fin, Smart Caf\u00e9 uygulamas\u0131nda tablet boyutunda geni\u015f ekranda men\u00fc \u00f6\u011feleri yan yana dizilirken, telefon boyutunda dikey olarak alt alta s\u0131ralanabilir. Bu, VisualStateManager<\/code> i\u00e7inde tan\u0131mlanan durumlarla kolayca y\u00f6netilebilir.<\/p>\nTemaland\u0131rma, uygulaman\u0131n marka kimli\u011fini yans\u0131tan ve kullan\u0131c\u0131 deneyimini iyile\u015ftiren \u00f6nemli bir unsurdur. .NET MAUI'de stiller ve kaynak s\u00f6zl\u00fckleri (ResourceDictionary<\/code>) kullan\u0131larak renkler, yaz\u0131 tipleri ve kontrol g\u00f6r\u00fcn\u00fcmleri merkezi olarak y\u00f6netilebilir. Bu sayede, uygulaman\u0131n \"light\" (a\u00e7\u0131k) ve \"dark\" (koyu) temalar aras\u0131nda ge\u00e7i\u015f yapmas\u0131 veya kafe markas\u0131n\u0131n ana renklerinin t\u00fcm uygulamaya uygulanmas\u0131 kolayla\u015f\u0131r. \u00d6rne\u011fin, bir \"PrimaryColor\" kayna\u011f\u0131 tan\u0131mlay\u0131p, bunu t\u00fcm butonlar\u0131n veya ba\u015fl\u0131klar\u0131n arka plan rengi olarak kullanabilirsiniz. Daha sonra bu rengi tek bir yerden de\u011fi\u015ftirerek t\u00fcm uygulaman\u0131n temas\u0131n\u0131 kolayca g\u00fcncelleyebilirsiniz.<\/p>\n\n Uzman \u0130pucu: Tasar\u0131m sisteminizi olu\u015ftururken, renk paleti, tipografi, ikon setleri ve bile\u015fen k\u00fct\u00fcphanesini \u00f6nceden belirleyin. Bu, \u00f6zellikle farkl\u0131 platformlarda tutarl\u0131 bir UI sa\u011flamak i\u00e7in kritik \u00f6neme sahiptir. MAUI'nin Style ve ResourceDictionary \u00f6zelliklerini aktif olarak kullanarak bu sistemi uygulaman\u0131za entegre edin.\n<\/div>\nBu ad\u0131mlar ve ara\u00e7lar sayesinde, Smart Caf\u00e9 projesi i\u00e7in .NET MAUI ile hem mobil hem de masa\u00fcst\u00fc platformlar\u0131nda \u00e7arp\u0131c\u0131, tutarl\u0131 ve kullan\u0131c\u0131 dostu aray\u00fczler geli\u015ftirmek m\u00fcmk\u00fcn hale gelir. Geli\u015ftiriciler, tek bir dil ve \u00e7er\u00e7eve ile birden fazla platforma hitap ederek hem zamandan hem de maliyetten \u00f6nemli \u00f6l\u00e7\u00fcde tasarruf edebilirler.<\/p>\n
Blazor ile Ak\u0131c\u0131 ve Etkile\u015fimli Web Aray\u00fczleri Olu\u015fturmak<\/h2>\n
Smart Caf\u00e9 projesinin y\u00f6netim paneli ve online sipari\u015f portal\u0131 gibi web tabanl\u0131 aray\u00fczleri i\u00e7in Blazor, C# geli\u015ftiricilerine JavaScript'e olan ba\u011f\u0131ml\u0131l\u0131\u011f\u0131 azaltarak veya tamamen ortadan kald\u0131rarak modern ve etkile\u015fimli web uygulamalar\u0131 olu\u015fturma imkan\u0131 sunar. Blazor'\u0131n esnek mimarisi sayesinde, uygulaman\u0131n performans ve da\u011f\u0131t\u0131m ihtiya\u00e7lar\u0131na g\u00f6re farkl\u0131 modeller aras\u0131nda se\u00e7im yapmak m\u00fcmk\u00fcnd\u00fcr. Peki, Blazor ile ak\u0131c\u0131 web aray\u00fczleri nas\u0131l olu\u015fturulur ve Smart Caf\u00e9 projesine nas\u0131l entegre edilir?<\/p>\n
Blazor WebAssembly ve Server Se\u00e7imi<\/h3>\n
Blazor'\u0131n iki ana \u00e7al\u0131\u015fma modeli, web uygulamas\u0131 geli\u015ftirirken \u00f6nemli bir karar noktas\u0131n\u0131 temsil eder:<\/p>\n
\n- Blazor WebAssembly (WASM):<\/b> Bu modelde, .NET kodu WebAssembly'ye derlenir ve uygulama dosyalar\u0131 (HTML, CSS, C# DLL'leri ve WebAssembly dosyalar\u0131) taray\u0131c\u0131ya indirilir. Uygulama tamamen istemci taraf\u0131nda, taray\u0131c\u0131da \u00e7al\u0131\u015f\u0131r.\n
\n- Avantajlar\u0131:<\/b> D\u00fc\u015f\u00fck sunucu y\u00fck\u00fc, \u00e7evrimd\u0131\u015f\u0131 \u00e7al\u0131\u015fma yetene\u011fi, statik dosya sunucular\u0131nda veya CDN'lerde bar\u0131nd\u0131r\u0131labilme. Kullan\u0131c\u0131 deneyimi, tam SPA (Single Page Application) hissi verir.<\/li>\n
- Dezavantajlar\u0131:<\/b> \u0130lk y\u00fckleme s\u00fcresi, indirilmesi gereken dosya boyutlar\u0131 nedeniyle daha uzun olabilir. Taray\u0131c\u0131da JavaScript interop gereksinimi baz\u0131 durumlarda ortaya \u00e7\u0131kabilir.<\/li>\n
- Smart Caf\u00e9 Senaryosu:<\/b> M\u00fc\u015fterilere y\u00f6nelik online sipari\u015f portal\u0131 i\u00e7in ideal olabilir. \u00d6zellikle resimli men\u00fcler ve sipari\u015f detaylar\u0131 gibi yo\u011fun etkile\u015fimli sayfalar, istemci taraf\u0131nda h\u0131zl\u0131 yan\u0131t s\u00fcreleri sa\u011flayarak daha ak\u0131c\u0131 bir deneyim sunabilir.<\/li>\n<\/ul>\n<\/li>\n
- Blazor Server:<\/b> Bu modelde, uygulama sunucuda \u00e7al\u0131\u015f\u0131r ve UI g\u00fcncellemeleri, SignalR ba\u011flant\u0131s\u0131 arac\u0131l\u0131\u011f\u0131yla taray\u0131c\u0131ya ger\u00e7ek zamanl\u0131 olarak g\u00f6nderilir. Kullan\u0131c\u0131 etkile\u015fimleri sunucuya iletilir ve sunucu DOM'u g\u00fcncelleyip de\u011fi\u015fiklikleri geri g\u00f6nderir.\n
\n- Avantajlar\u0131:<\/b> D\u00fc\u015f\u00fck ilk y\u00fckleme boyutu, sunucunun g\u00fc\u00e7l\u00fc i\u015flem yeteneklerinden faydalanma, platforma \u00f6zg\u00fc sunucu API'lerine kolay eri\u015fim.<\/li>\n
- Dezavantajlar\u0131:<\/b> S\u00fcrekli bir SignalR ba\u011flant\u0131s\u0131 gerektirir (\u00e7evrimd\u0131\u015f\u0131 \u00e7al\u0131\u015fmaz), y\u00fcksek gecikme (latency) durumlar\u0131nda performans d\u00fc\u015f\u00fc\u015f\u00fc ya\u015fanabilir. Sunucu taraf\u0131nda her kullan\u0131c\u0131 i\u00e7in durum bilgisi tutulur, bu da \u00f6l\u00e7eklenebilirlik zorluklar\u0131 yaratabilir.<\/li>\n
- Smart Caf\u00e9 Senaryosu:<\/b> Y\u00f6netim paneli i\u00e7in Blazor Server daha uygun olabilir. Y\u00f6neticilerin ger\u00e7ek zamanl\u0131 raporlar\u0131 g\u00f6rmesi, stok durumunu anl\u0131k takip etmesi veya men\u00fcde h\u0131zl\u0131 g\u00fcncellemeler yapmas\u0131 i\u00e7in sunucu taraf\u0131ndaki g\u00fcncel verilere h\u0131zl\u0131 eri\u015fim \u00f6nemlidir. Ayr\u0131ca, y\u00f6netici kullan\u0131c\u0131 say\u0131s\u0131 genellikle daha s\u0131n\u0131rl\u0131 oldu\u011fu i\u00e7in SignalR ba\u011flant\u0131s\u0131 y\u00fck\u00fc daha y\u00f6netilebilir olabilir.<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n
Ortak Bile\u015fenler ve Kod Payla\u015f\u0131m\u0131<\/h3>\n
T\u0131pk\u0131 .NET MAUI'de oldu\u011fu gibi, Blazor'da da ortak kod katman\u0131ndan (modeller, i\u015f mant\u0131\u011f\u0131 servisleri) faydalan\u0131l\u0131r. Bunun yan\u0131 s\u0131ra, Blazor ile geli\u015ftirilen web uygulamalar\u0131nda, UI bile\u015fenlerini de platformlar aras\u0131nda payla\u015fmak m\u00fcmk\u00fcnd\u00fcr. Razor S\u0131n\u0131f K\u00fct\u00fcphaneleri<\/code> (Razor Class Libraries - RCL) bu ama\u00e7la kullan\u0131l\u0131r. RCL'ler, Razor bile\u015fenlerini (.razor<\/code> dosyalar\u0131), statik varl\u0131klar\u0131 (CSS, JavaScript) ve hatta C# kodunu i\u00e7eren paketlenebilir ve yeniden kullan\u0131labilir k\u00fct\u00fcphanelerdir. Bu sayede, Smart Caf\u00e9 uygulamas\u0131n\u0131n hem Blazor WebAssembly tabanl\u0131 online sipari\u015f portal\u0131nda hem de Blazor Server tabanl\u0131 y\u00f6netim panelinde ayn\u0131 \"Men\u00fc \u00d6\u011fesi Kart\u0131\" veya \"Sipari\u015f Listesi\" bile\u015fenleri kullan\u0131labilir.<\/p>\nJavaScript Interop, Blazor'\u0131n C# kodunun taray\u0131c\u0131daki JavaScript fonksiyonlar\u0131n\u0131 \u00e7a\u011f\u0131rmas\u0131na veya tam tersi, JavaScript'ten C# y\u00f6ntemlerini \u00e7a\u011f\u0131rmas\u0131na olanak tan\u0131r. Genellikle Blazor, JavaScript'e olan ihtiyac\u0131 en aza indirse de, belirli \u00fc\u00e7\u00fcnc\u00fc taraf JavaScript k\u00fct\u00fcphanelerini entegre etmek veya taray\u0131c\u0131ya \u00f6zg\u00fc API'lere do\u011frudan eri\u015fmek gerekti\u011finde bu \u00f6zellik olduk\u00e7a faydal\u0131d\u0131r. Smart Caf\u00e9 projesinde, \u00f6rne\u011fin, \u00f6deme a\u011f ge\u00e7idi entegrasyonu i\u00e7in \u00f6zel bir JavaScript SDK's\u0131 veya haritalar\u0131 g\u00f6stermek i\u00e7in bir harita k\u00fct\u00fcphanesi kullan\u0131lmas\u0131 gerekirse JavaScript Interop devreye girebilir.<\/p>\n
A\u015fa\u011f\u0131da, Smart Caf\u00e9 online sipari\u015f portal\u0131nda kullan\u0131labilecek basit bir sipari\u015f formu i\u00e7in Blazor kod \u00f6rne\u011fi yer almaktad\u0131r:<\/p>\n
\n\n Sipari\u015f Detaylar\u0131<\/h3>\n \n