Temel Web Teknolojileri Kavramları

  • 16.07.2016
  • M.Tayyip Yetiş
  • .Net Framework

ASP.NET ile Yeni Nesil Web Sitesi Geliştirme

BÖLÜM  1 :   Temel Kavramlar

Web sitesi nedir ?

Günümüzde globalleşen dünya adeta büyük bir köy haline geldi, ürün veya hizmetler çok kısa sürede çok uzun mesafelere taşınabilir oldu ve insanlar istedikleri ürünlere veya hizmetlere neredeyse ışık hızında ulaşabilir hale geldi nitekim bu baş döndürücü teknoloji çağında en çok üretilen ve en çok transfer edilen ürün bilgiden başka bir şey değil. Bir bilginin istenen hedeflere bu kadar hızlı gönderilmesi de sadece teknolojik araçlar ile yapılabiliyor. Cep telefonları, Televizyon, Tablet ve bilgisayarlar bu transfer için en önemli taşıyıcı görevi görüyor ve bu araçların kullandığı, bilgiyi en çok üreten, toplayan, depolayan ve transfer eden araç ise şüphesiz Web siteleri.

Web siteleri, eski zamanlarda bilgiyi üretme depolama, işleme vs. İşlemlerinin yapıldığı ne kadar uygulama veya araç varsa neredeyse hepsinin yerini almış durumda artık bakkallar bile veresiyelerini defterlerde değil web sitelerinde tutabiliyorlar, devletler çok kritik kurumsal işlemleri dahi artık kendi web siteleri üzerinden vatandaşlarına yaptırabiliyor ve bu sayede zaman, para ve emekten büyük oranda tasarruf edebiliyorlar, Mağazalar artık fiziksel şubelerden daha çok internet şubelerinden satış yapar hale geldiler sadece bir kaç tık ile onlarca ürünü sipariş edip bir kaç günde kapınızın önünde bulabiliyorsunuz, Gazeteler fiziksel yayından çok internet siteleri üzerinden trajlarını yüksetmeye başladılar üstelik bazıları sadece internet üzerinden yayın yapmaya başladı, Doktorlar muayene işlemlerini yine web siteleri üzerinden işleyip ilaçlarını buradan yazıyorlar, şirketlerin tüm kritik muhasebe işlemleri de yine web siteleri üzerinden yapılıyor.

Tüm bu örnekler ve daha fazlaları ile şöyle bir tanımlama yapabiliriz; web siteleri, her gün petabyte’larca veri üretip yine bu çapta veriyi depolayan, işleyen ve tekrar kullanıcılarına sunan,  hareketli, interaktif dökümanlar sunan çok amaçlı bilgisayar yazılımlarıdır.

Web sitesi nasıl çalışır ?

Web siteleri yapı itibariyle bir yayınlama aracıdır ve yayınlama araçları aynı anda çok sayıda kişiye istediği bilgiyi verebilmelidir bunun için ise bu bilgilerin depolandığı ve işlendiği tek bir nokta olmalıdır kullanıcılar bu merkezden istedikleri veriyi talep etmeli ve merkez ise istenen veriyi tekil kullanıcıya özel hazırlamalı ve göndermelidir.

Gerçekte bu sistemde iki ana aktör vardır Server ve Client diğer bir deyişle Sunucu ve İstemci. İstemci adı itibariyle sunucudan bilgi talep eder ve sunucu bilgiyi istemciye gönderir netice itibariyle ikise bir bilgisayardır fakat sunucu aynı anda görevine göre değişiklik göstermek şartıyla yüzlerce, binlerce hatta milyonlarca bilgisayarın sorgusuna cevap vermesi gerektiğinden oldukça güçlü, hızlı ve sürekli çalışabilecek yapıda olmalıdır. bu sebeple Datacenter(Veri merkezi) denen ve içerisinde yüzlerce sunucunun bulunduğu soğuk ve yüksek güvenlikli binalarda saklanırlar ayrıca güçlü internet altyapısına sahiptirler, istemciler ise tek bir kullanıcı için üretilen daha az özellikleri olan sıradan bilgisayarlardır (Personal Computer).

Sunucular üzerinde sunucu vazifesi görmesi yani gelen taleplere göre web sitelerini çalıştırıp istenen cevapları üretebilmesi için işletim sistemi tipine göre Web Server denilen yazılımlar bulunur. Windows sunucularda buna IIS (Internet Information Service) denirken Linux sunucularda Apache, Tomcat vs. Yazılımlar kullanılır. Bu yazılımlar ASP.Net, PHP, Java gibi programlama dilleri ile yazılan web sitelerini yani bir nevi yazılımları çalıştırarak tüm dünyada web sitelerinin ortak dili olarak kabul edilen HTML veri işaretleme dili olarak bir sonuç dökümanı üretip gönderirler ve böylece yayın yapmış olurlar.

Web sitesi nasıl yapılır ?

Web sitesi yapılırken öncelikle hangi teknolojinin kullanılacağı belirlenmelidir günümüzde web projesi geliştirmek için Asp.net, Php ve Java olmak üzere üç adet programlama dili mevcuttur. Her biri kendi derleyicisini ve kendi geliştirme ortamını kullanmaktadır aynı zamanda hibrit imkanları olsa bile en iyi performans için kendilerine ait web server yazılımları vardır.

Teknoloji belirlendikten sonra uygun bir bütünleşik geliştirme ortamı seçilmelidir. Klasik asp, php ve jsp  için kendilerine ait IDE’leri olsa dahi sıradan bir notpad de yeterlidir fakat asp.net genelde Visual Studio ile kodlanır.

.Net Framework nedir ?

.Net Framework microsoft tarafından geliştirilen yine kendi geliştirmiş olduğu uygulamaları tek çatı altında toplayıp programcılar için daha kolay yönetilebilir projeler oluşturmak amacıyla üretilen geniş çaplı uygulama geliştirme platformudur.

.Net Framework, kendisi ile aynı amaç için geliştirilen Java sanal makinesi ile benzerlik göstermektedir zira ikisi de tüm platformlar için ayrı ayrı teknolojiler kullanmanın önüne geçmek için üretilmiştir. Bundan önce web için ayrı masaüstü için ayrı ve mobil için ayrı programlama dilleri ve araçları öğrenmek gerekiyordu bu ise programcıların işini hayli zorlaştırıyordu fakat .Net Framework ile aynı araçlar ile Web, masaüstü ve mobil cihazlarda çalışabilecek uygulamar geliştirebilmek mümkün hale geldi.

ASP.Net Çalışma Mantığı

Asp.net Web Forms ile yazılan bir web sayfasının tıpkı doğada olduğu gibi bir yaşam döngüsü(Life Cycle) vardır. İstemciden gelen Request(İstek) ile başlayan bu döngü sırasıyla; PreInit, Init, InitComplate, PreLoad, Load, LoadComplate, PreRender, PreRenderComplate, SaveStateComplate, Unload evrelerinden geçerek bir web sayfasını ortaya çıkarır ve yokeder. sonuçta ise kullanıcının isteğine Response(Cevap) verilmiş olur bu işlemler sayfa her açıldığında tekrarlanır.

Asp.Net web formları temelde üç kod sayfasından oluşur. Html ile bütünleşik olarak kontrollerin yerleştirildiği ve tasarımsal işlemlerin yapıldığı(Design) dosya .aspx uzantılıdır. Yazılımsal işlemlerin yapıldığı verilerin hazırlandığı dosya programlama diline göre .cs (C#) veya .vb (VB.net) uzantılıdır bunların yanında sayfa üzerindeki asp.net kontrollerinin default özelliklerinin belirtildiği dosya .designer.cs dosyasıdır. Tüm bu dosyalar derlenerek Solution içinde Bin klasörü altında proje ile aynı ismi taşıyan bir .dll dosyası üretilir normalde site için gerekli olan sadece aspx ve dll dosyalarıdır diğer dosyaların server üzerinde bulunmasına gerek yoktur. Web sitesine istek geldiğinde IIS siteyi çalıştırmak için Bin klasörünün altındaki dll dosyasını arar ve çalıştırır aspx ile de html çıktıları üretir. Web sitesi için gerekli olan konfigürasyon ayarları için ana dizinde web.config isminde bir dosya bulunmalıdır bu dosya içinde XML formatında IIS’ye bu web sitesinin nasıl çalıştırılacağını ve veritabanı bağlantıları, urlrewrite vs gibi bilgileri içeren ayarlamalar bulunmaktadır.

ASP.Net Web Forms Nedir ?

Microsoft, masaüstü uygulamalarından esinlenerek ilk önce web forms yani adından da anlaşılacağı üzere form mantığı ile çalışan bir sistem tasarladı bu masaüstü programlamadan web’e geçen programcılar için kolaylık sağladı.

Web Forms’un bazı avantajları şunlardır; Sürükle-Bırak mantığı ile kolayca tasarım yapabilmeyi sağlar, çok sayıda hazır kontrol barındırdığından bir çok işi programcıdan devraldı, tıpkı masaüstü formları gibi olay tabanlı çalışır ve kullanıcıların buton tıklaması, tuşlara basması vs. İşlemlerini yakalar ve ona göre işlemler yapar, geliştiriciyi olabildiğince kodlamadan uzaklaştırmayı hedefler. Fakat tüm bunların yanında olay temelli olduğundan kullanıcının her tetiklemesinde sunucu ile istemci arasında gidip gelen sayfaların bilgilerinin kaybolmaması için viewstate yöntemini kullanır bu ise zamanla çok fazla boyutlara ulaşıp performansı düşürür, ayrıca kullanıcıyı kodlamadan uzak tutmak istemesi sebebiyle programcının html üzerindeki etkinliğini kısıtlar dolayısıyla bir projede tasarımcının ve yazılımcının bağımsız çalışmasını engeller.

ASP.Net MVC Nedir ?

MVC açılımı Model – View- Controller olan geçmişi eskilere dayanan bir uygulama geliştirme mimarisidir etki alanı sadece web değil bilhassa şuan ios ve android’de de kullanılmaktadır. Asp.net Mvc ise Mvc teknolojisinin .net ile birleştirilmiş şeklidir. Bir web uygulamasında Tasarım, İş ve Veri katmanlarını birbirinden ayırarak proje geliştirme ve yönetimini kolaylaştırmaktadır. Tüm yetkiyi programcıya verir bu ise daha özgür proje geliştirmeye olanak sağlar. Hazır kontroller ve tetikleyiciler barındırmaz kullanıcı sayfayı tek yönlü post eder sunucu gelen veriye göre sayfayı yeniden hazırlar ve tekrar gönderir bu ise daha az veri transferi ile performans kaybına neden olmaz. Aşağıda Katmanların açıklamaları yer almaktadır.

  1. Model : Veri katmanıdır projede işlenecek, listelenecek verilerin tanımlanması bu katmanda yapılır. verilerin kaynağı xml, sql database yada yada sınıflar olabilir.
  2. View : Projenin görsel bölümünün oluşturulduğu katmandır. Razor engine yapısıve C# kullanıldığında cshtml uzantılı dosyalarda tanımlanır ve Dinamik olarak Html üretir.
  3. Controller : İş katmanıdır. Web forms’da Code Behind olarak tabir edilen kavramın karşılığıdır sistemin işleyişinden sorumludur ve model (veri) ile view(tasarımın) arasındaki ilişkiyi sağlar. İstemciden gelen isteklere cevap verir.

Kullanıcılardan gelen istek Controller tarafından karşılanır eğer veriler ihtiyaç duyuluyorsa model katmanından veriler alınır işlenir ve iş bitiminde view’e gönderilir artık iş bitmiş sadece verinin gösterimi kalmıştır. View ise gelen model(veriyi) tasarımına göre listeler ya da şekillendirir ve dinamik olarak html üretip cevap olarak gönderir.

Routing Nedir ?

Routing, kelime manasıyla yönlendirme demektir ve tarayıcının adres çubuğundaki URL yapısı ile ilgili herşeyi kapsar. Daha çok ismi MVC ile zikredilir çünkü yönlendirme işleminin modern şeklidir. Web forms mimarisindeki karşılığı olan UrlRewrite nispeten daha elverişsiz bir yapı sunar. UrlRewrite, teknik olarak bir request geldiğinde bunu yakalayarak url yapısını incelemeye ve parse etmeye imkan sağlar basit string fonksiyonları ile parse işlemi yapılıp gerçek adreslerine yönlendirilir . Örnek bir dönüştürme aşağıdadır.

http://www.siteadi.com/casper-dizustu-bilgisayarlar

http://www.siteadi.com/urunler.aspx?markaid=147&kategoriid=78

yukarıda yapılan sadece link dönüştürme işlemidir ve bir çok dezavantajı vardır fakat routing işlemi ise link yapısını olduğu gibi okuyup verilen desene (pattern) anlamlandırarak doğrudan ilgili sayfanın işlenmesini sağlamaktadır amaç kullanıcılar ve seo için daha anlamlı linkler üretebilmektir.

BÖLÜM 2 : Visual Studio IDE Ortamı

Visual Studio 2012

Visual Studio 2012, Microsoft teknolojileri ile uygulama geliştirmek için üretilen bütünleşik uygulama geliştirme (IDE) yazılımıdır. İçerisinde web, masaüstü, mobil, azure programlama için gerekli tüm araç gereçleri barındırır ve tek bir arayüz ile onlarca farklı proje türünü kolayca geliştirmenize olanak tanır.

https://www.microsoft.com/en-us/download/details.aspx?id=30682 linkinden ücretli olan professional sürümü indirebilirsiniz express sürümü ise ücretsizdir. İsterseniz iso olarak isterseniz de web yükleyicisini kullanarak visual studio 2012’yi bilgisayarınıza kurabilirsiniz. Kurulumu tamamlayıp visual studio’yu açtığınızda karşınıza light teması ile beyaz ağırlıklı bir görünüm gelecektir genelde daha koyu renklere sahip ve uzun süre bilgisayar başında duranlar yazılımcılar için gözleri daha az yoran dark teması tercih edilir bunu değiştirmek için Tools > Options > Environment > General içinde Color Theme seçeneğini Dark olarak seçmelisiniz.

Yeni Proje Oluşturmak

Visual Studio’da yeni bir proje oluşturmak için üst menüde File > New Project yolunu izleyerek new project penceresini açın.

New Project pencerisinde 1 numaralı bölümde sisteminizde yüklü olan template seçenekleri listelenir örneğin; windows forms, web, cloud(Bulut), WCF vs. Türlerinde platformlar seçebilirsiniz. 3 numaralı alanda seçilen platforma göre proje türleri listelenecektir. 4 numaralı alanda hangi .net framework versiyonu ile çalışacağınızı seçebilirsiniz. 5 numaralı alanda belirli kriterlere göre sıralama yapabilirsiniz. 6 numaralı alanda seçilen proje türünün kısa açıklaması yer almaktadır. 2 numaralı alanda projenize ve solution’a isim verebilir konumunu browse ile değiştirebilirsiniz. 7 numaralı alanda ise ayarlarınızı yaptıktan son visual studio’nun projeyi otomatik toplaması için ok tuşu ve işlemlerin iptali için cancel tuşu yer almaktadır.

Proje Yönetim Araçları

Proje ayarlarını yapıp projenizi oluşturduktan sonra kolayca yönetebilmeniz için size sunulan bazı yönetim araçları vardır bu araçlara View menüsü altından erişebilirsiniz.

  • Solution Explorer : Projenize dahil olan tüm klasör ve dosyaları hiyerarşik bir yapı ile treeview görünümünde kontrol etmenizi sağlar. Bu araç ile projenize sürükle-bırak yöntemiyle yeni klasör veya dosyalar ekleyebilir, isimlerini değiştirebilir silebilirsiniz kısacası projenizin temel yönetim işlemlerini sağlar.
  • Properties : Solution Explorer içiden seçilen bir dosyanın ya da form üzerinden seçilen kontrollerin özelliklerine erişip değiştirebilmeyi sağlayan araçtır.
  • Toolbox : Web form, user kontrol gibi kullanıcı ara birimi olan sayfalara sürükle bırak mantığı ile kontrol ekleyebilmeyi sağlayan araçtır. Ayrıca bir çok araca gruplandırarak hızlıca erişilmesini sağlar.
  • Server Explorer : Veritabanı ile çalışılan uygulamalarda bir server’a ya da veritabanına bağlanmak ve yönetmek için gerekli bileşenleri içeren araçtır.
  • Error List : Proje derlenirken meydana gelen hataların loglarını tutarar konsol görünümünde programcıyı bilgilendiren ve ilgili hatayla ilgili açıklama, satır numarası, dosya ismi gibi bilgileri içeren araçtır.
  • Output : Projenin derleme aşamasında yapılan tüm işlemleri ve uyarıları konsol görünümünde programcıya bildiren araçtır.

 

Proje Türleri

Windows platformu ;

Windows forms application : Windows üzerinde standart form uygulamaları geliştirmek için kullanılır

WPF application : WPF uygulamaları geliştirmek için kullanılır.

Console application : mssdos penceresinde çalışan grafiksel olmayan konsol uygulamaları geliştirmek için kullanılır.

Class Library : Uygulama uzantıları olan dll kütüphane dosyaları oluşturmak için kullanılır.

Empty Project : Herhangi özelleştirilmiş bir içeriği bulunmayan programcının isteğine göre yapılandırılan projeler oluşturmak için kullanılır.

Windows Services : windows altında belli görevleri yapmakla yükümlü grafik yapısı olmayan servisler yazmak için kullanılır.

Web Platformu :

ASP.Net Empty Web Application : Özelleştirilmemiş standart web uygulamaları geliştirmek için kullanılan proje türüdür.

ASP.Net Web Forms Application : Standart web forms solution ile hazır klasör yapıları kullanarak web forms uygulamaları oluşturmak için kullanılır

ASP.Net MVC : MVC uygulamaları geliştirmek için kullanılan proje türüdür.

Projelere Item Ekleme

AJAX Nedir ? Ne işe yarar ? Nasıl Kullanılır ?

Merhaba arkadaşlar bu makalede AJAX teknolojisi ile ilgili olabildiğince geniş anlatım yapmaya çalışacağım özellikle bu teknolojiye yeni başlayan ya da meraklı olan geliştiriciler için örnekler üzerinden gitmeye özen gösterip, hangi özelliğin hangi durumlarda kullanılabileceğine dair geniş bilgiler vermek istiyorum. Çünkü Ajax kullanım şeklinin bir hayli kombinasyonlu olduğu farklı işlemler için esneyebilen bir yapı fakat bunun yanında tarayıcı tabanlı çalıştığı için debug işlemi yapılamadığı için hataların yakalanmasının da zor olduğu gerçeği var. Konu başlıkları üzerinden giriş yapalım.

AJAX Nedir ?

İngilizce ismi  Asynchronous JavaScript And XML (Eşzamansız JavaScript ve XML) kelimelerinin baş harflerinden oluşan Ajax teknolojisi Javascript ile XmlHttpRequest işlemini kullanarak farklı bir yöntem ile Server ve client haberleşmesini sağlar. Bu yöntem ile standart post işlemlerinin ötesine geçilerek sunucu üzerinde sadece istenen fonksiyonlar çalıştırılır ve istenen bilgiler getirilir böylece basit bir buton tıklamasında bile tüm sayfanın derlenip yeniden oluşturulmasının önüne geçilir. kullanıcılar açısından da hızlı işlem yapıldığı izlenimi verdiği için daha pozitif etki oluşturur. Ajax bir programlama dili değildir, bir teknolojidir öyleki asp.net içerisinde de UpdatePanel kontrolü ile kısmen ajax kullanılmaya çalışılmıştır. şu an en yaygın kullanım şekli ise bir javascript kütüphanesi olan Jquery ile birlikte kullanılmasıdır fakat sadece javascript ile de daha fazla kod yazarak çalıştırılabilir.

AJAX Ne İşe Yarar ?

Yeni nesil web sitelerinde daha interaktif uygulamalar oluşturmak için kullanılır. örneğin bir eticaret sitesinde ürün sayfasında yeni bir ürün eklemek, silmek, güncellemek gibi işlemler için klasik httprequest ile post yapmak daha fazla zaman ve kaynak kaybına sebep olacaktır çünkü her butona tıklandığında tüm sayfa sunuya gönderilip sunucu tarafında da yeniden oluşturulup cevap olarak gönderilmektedir yani biz yeni bir ürün eklemek isterken aynı sayfada bulunan kategoriler, yorumlar, siparişler vs. bilgilerde bu yolculukta yer alacaktır fakat aynı işlem ajax ile yapıldığında .net tarafında bir web metot yazılıp eklenecek ürün bilgileri de bu metoda parametre olarak gönderildiğinde sadece bu alanlar işlenecektir ve kullanıcı da tıpkı bir masaüstü uygulamasında çalışıyor hissine kapılıp bu durumdan memnun kalacaktır.

AJAX Nasıl Kullanılır ?

AJAX, javascript temelli bir teknolojidir ve taracılar üzerinde çalışır dolayısıyla javascript’in içinde hazır sınıflar ve metotlar bulunmaktadır fakat JQuery kütüphanesiyle çok daha az işlem yaparak aynı işlemi yapabilirsiniz fakat biz önce javascript ile basit ajax işlemleri yapacağız ardından jquery ile kullanımına değineceğiz

 

Yorum Yap