Projeyi Oluşturma

tarafından Erik Reitan

Bu öğretici serisi, web için ASP.NET 4.5 ve Microsoft Visual Studio Express 2013 kullanarak ASP.NET Web Forms uygulaması oluşturmanın temellerini öğretecektir. Bu öğretici serisine eşlik etmek için C# kaynak koduna sahip bir Visual Studio 2013 projesi kullanılabilir.

Bu öğreticide Visual Studio'da varsayılan projeyi oluşturacak, gözden geçirecek ve çalıştıracaksınız ve bu sayede ASP.NET özellikleri hakkında bilgi sahibi olacaksınız. Ayrıca Visual Studio ortamını da gözden geçireceksiniz.

Öğrenecekleriniz:

  • Yeni bir Web Forms projesi oluşturma.
  • Web Forms projesinin dosya yapısı.
  • Visual Studio'da projeyi çalıştırma.
  • Varsayılan Web formları uygulamasının farklı özellikleri.
  • Visual Studio ortamını kullanma hakkında bazı temel bilgiler.

Projeyi Oluşturma

  1. Visual Studio'yu açın.

  2. Visual Studio'daki Dosyamenüsünden Yeni Proje'yi seçin.

    Proje Oluşturma - Yeni Proje Menü Öğesi

  3. Soldaki Şablonlar ->Visual C# ->Web şablonları grubunu seçin.

  4. Orta sütunda ASP.NET Web Uygulaması şablonunu seçin.
    Bu öğretici serisi .NET Framework 4.5.2 sürümünü kullanıyor.

  5. Projenize WingtipToys adını verin ve Tamam düğmesini seçin.

    Proje Oluşturma - Yeni Proje İletişim Kutusu

    Not

    Bu öğretici serisindeki projenin adı WingtipToys'tır. Öğretici serisi boyunca sağlanan kodun beklendiği gibi çalışabilmesi için tam olarak bu proje adını kullanmanız önerilir.

  6. Kimlik Doğrulamayı Değiştir düğmesine tıklayın. Bireysel Kullanıcı Hesapları'nı seçin ve Tamam düğmesine tıklayın.

  7. Web Forms şablonunu seçin ve Tamam düğmesine tıklayın.

    Web Forms şablonu ve Tamam düğmesinin seçili olduğu Yeni ASP.NET Projesi penceresinin ekran görüntüsü.

Projenin oluşturulması biraz zaman alacaktır. Hazır olduğunda Default.aspx sayfasını açın.

Default.aspx sayfasını görüntüleyen Web için Microsoft Visual Studio Express 2013 penceresinin ekran görüntüsü.

Orta pencerenin alt kısmındaki bir seçeneği belirleyerek Tasarım görünümü ile Kaynak görünümü arasında geçiş yapabilirsiniz. Tasarım görünümü WYSIWYG'ye yakın bir görünüm kullanarak Web sayfaları, ana sayfalar, içerik sayfaları, HTML sayfaları ve kullanıcı denetimleri ASP.NET görüntüler. Kaynak görünümünde Web sayfanızın HTML işaretlemesi görüntülenir ve bu işaretlemeyi düzenleyebilirsiniz.

İpucu

ASP.NET Çerçevelerini Anlama

ASP.NET Web Forms, tanıdık sürükle ve bırak, olay odaklı bir model kullanarak dinamik web siteleri oluşturmanıza olanak tanır. Tasarım yüzeyi ve yüzlerce denetim ve bileşen, veri erişimine sahip gelişmiş, güçlü UI tabanlı siteleri hızla oluşturmanıza olanak sağlar. Wingtip Oyuncak Mağazası ASP.NET Web Forms temel alır, ancak bu öğretici serisinde öğrendiğiniz kavramların çoğu tüm ASP.NET için geçerlidir.

ASP.NET dört birincil geliştirme çerçevesi sunar:

  • ASP.NET Web Forms
    Web Forms çerçevesi, Microsoft Windows Forms (WinForms) ve WPF/XAML/Silverlight gibi bildirim temelli ve denetim tabanlı programlamayı tercih eden geliştiricileri hedefler. WYSIWYG tasarımcı temelli bir geliştirme modeli sunar, bu nedenle web geliştirme için hızlı bir uygulama geliştirme (RAD) ortamı arayan geliştiriciler arasında popülerdir. Web programlamada yeniyseniz ve geleneksel Microsoft RAD istemci geliştirme araçlarını (örneğin, Visual Basic ve Visual C# için) biliyorsanız, HTML ve JavaScript deneyimi yaşamadan hızla bir web uygulaması oluşturabilirsiniz.
  • ASP.NET MVC
    ASP.NET MVC, test temelli geliştirme, endişelerin ayrılması, denetimin ters çevrilmesi (IoC) ve bağımlılık ekleme (DI) gibi desenler ve ilkelerle ilgilenen geliştiricileri hedefler. Bu çerçeve, bir web uygulamasının iş mantığı katmanını sunu katmanından ayırmayı teşvik eder.
  • ASP.NET Web Sayfaları
    ASP.NET Web Sayfaları, PHP satırlarında basit bir web geliştirme hikayesi isteyen geliştiricileri hedefler. Web Sayfaları modelinde HTML sayfaları oluşturur ve ardından işaretlemenin nasıl işleneceğini dinamik olarak denetlemek için sayfaya sunucu tabanlı kod eklersiniz. Web Sayfaları özellikle basit bir çerçeve olacak şekilde tasarlanmıştır ve HTML bilen ancak geniş bir programlama deneyimine sahip olmayabilecek kişiler (örneğin, öğrenciler veya hobiciler) için ASP.NET en kolay giriş noktasıdır. PHP veya benzer çerçeveleri bilen web geliştiricilerinin ASP.NET kullanmaya başlaması için de iyi bir yoldur.
  • Tek Sayfalı Uygulamayı ASP.NET
    ASP.NET Tek Sayfalı Uygulama (SPA), HTML 5, CSS 3 ve JavaScript kullanarak önemli istemci tarafı etkileşimleri içeren uygulamalar oluşturmanıza yardımcı olur. ASP.NET and Web Tools 2012.2 Güncelleştirmesi, knockout.js ve ASP.NET Web API'sini kullanarak tek sayfalı uygulamalar oluşturmaya yönelik yeni bir şablon gönderir. Yeni SPA şablonuna ek olarak, topluluk tarafından oluşturulan yeni SPA şablonları da indirilebilir.

dört ana geliştirme çerçevesine ek olarak, ASP.NET ayrıca dikkat edilmesi ve bilinmesi önemli olan ancak bu öğretici serisinde ele alınmayan ek teknolojiler de sunar:

  • ASP.NET Web API'si - Tarayıcılar ve mobil cihazlar da dahil olmak üzere çok çeşitli istemcilere ulaşan HTTP hizmetleri oluşturmaya yönelik bir çerçeve.
  • ASP.NET SignalR - Gerçek zamanlı web işlevselliği geliştirmeyi kolaylaştıran bir kitaplık.

Projeyi Gözden Geçirme

Visual Studio'da Çözüm Gezgini penceresi proje dosyalarını yönetmenize olanak tanır. Şimdi Çözüm Gezgini'de uygulamanıza eklenen klasörlere göz atalım. Web uygulaması şablonu temel bir klasör yapısı ekler:

Proje Oluşturma - Çözüm Gezgini

Visual Studio, projeniz için bazı ilk klasörler ve dosyalar oluşturur. Bu öğreticinin ilerleyen bölümlerinde üzerinde çalışacağınız ilk dosyalar şunlardır:

Dosya Amaç
Default.aspx Genellikle uygulama bir tarayıcıda çalıştırıldığında görüntülenen ilk sayfadır.
Site.Master Tutarlı bir düzen oluşturmanıza ve uygulamanızdaki sayfalar için standart davranışı kullanmanıza olanak tanıyan bir sayfa.
Asax ASP.NET veya HTTP modülleri tarafından tetiklenen uygulama düzeyi ve oturum düzeyindeki olaylara yanıt vermek için kod içeren isteğe bağlı bir dosya.
Web.config Bir uygulamanın yapılandırma verileri.

Varsayılan Web Uygulamasını Çalıştırma

Varsayılan Web uygulaması, yerleşik işlevlere ve desteğe dayalı zengin bir deneyim sağlar. Varsayılan Web formları projesinde herhangi bir değişiklik yapılmadan, uygulama yerel Web tarayıcınızda çalıştırılmaya hazırdır.

  1. Visual Studio'dayken F5 tuşuna basın.
    Uygulama, Web tarayıcınızda derlenir ve görüntülenir.

    Proje Oluşturma - Varsayılan Sayfa

  2. Çalışan uygulamayı gözden geçirmeyi tamamladıktan sonra tarayıcı penceresini kapatın.

Bu varsayılan Web uygulamasında üç ana sayfa vardır: Default.aspx (Giriş), About.aspx ve Contact.aspx. Bu sayfaların her birine üst gezinti çubuğundan ulaşılabilir. Ayrıca Hesap klasöründe bulunan iki ek sayfa vardır: Register.aspx sayfası ve Login.aspx sayfası. Bu iki sayfa, kullanıcı kimlik bilgilerini oluşturmak, depolamak ve doğrulamak için ASP.NET üyelik özelliklerini kullanmanıza olanak tanır.

arka plan ASP.NET Web Forms

ASP.NET Web Forms, sunucuda çalışan kodun tarayıcıya veya istemci cihazına dinamik olarak Web sayfası çıkışı oluşturduğu Microsoft ASP.NET teknolojisini temel alan sayfalardır. ASP.NET Web Forms sayfası stiller, düzen vb. özellikler için doğru tarayıcı uyumlu HTML'yi otomatik olarak işler. Web Forms, .NET ortak dil çalışma zamanı tarafından desteklenen Microsoft Visual Basic ve Microsoft Visual C# gibi tüm dillerle uyumludur. Ayrıca, Web Forms yönetilen ortam, tür güvenliği ve devralma gibi avantajlar sağlayan Microsoft .NET Framework üzerine kurulmuştur.

bir ASP.NET Web Forms sayfası çalıştırıldığında, sayfa bir dizi işleme adımı gerçekleştirdiği bir yaşam döngüsünden geçer. Bu adımlar başlatma, denetimlerin örneğini oluşturma, durumu geri yükleme ve koruma, olay işleyici kodunu çalıştırma ve işlemeyi içerir. ASP.NET Web Forms gücü hakkında daha fazla bilgi edindikçe, amaçladığınız etki için uygun yaşam döngüsü aşamasında kod yazabilmeniz için ASP.NET sayfa yaşam döngüsünü anlamanız önemlidir.

Bir Web sunucusu bir sayfa için istek aldığında, sayfayı bulur, işler, tarayıcıya gönderir ve sonra tüm sayfa bilgilerini atar. Kullanıcı aynı sayfayı yeniden isterse, sunucu tüm sırayı tekrarlar ve sayfayı sıfırdan yeniden işler. Başka bir ifadeyle, bir sunucunun işlediği sayfaların belleği yoktur ve sayfalar durum bilgisi yoktur. ASP.NET sayfa çerçevesi, sayfanızın durumunu ve denetimlerini koruma görevini otomatik olarak işler ve uygulamaya özgü bilgilerin durumunu korumanın açık yollarını sağlar.

İpucu

Web Forms Uygulama Şablonundaki Web Uygulaması Özellikleri

ASP.NET Web Forms Uygulaması şablonu, zengin bir yerleşik işlevsellik kümesi sağlar. Size yalnızca bir Home.aspx sayfası, About.aspx sayfası, Contact.aspx sayfası sağlamakla kalmaz, aynı zamanda kullanıcıları kaydeden ve web sitenizde oturum açabilmeleri için kimlik bilgilerini kaydeden üyelik işlevlerini de içerir. Bu genel bakış, ASP.NET Web Forms Uygulaması şablonunda yer alan bazı özellikler ve Wingtip Toys uygulamasında nasıl kullanıldıkları hakkında daha fazla bilgi sağlar.

Üyelik

ASP.NET Kimlik, kullanıcılarınızın kimlik bilgilerini uygulama tarafından oluşturulan bir veritabanında depolar. Kullanıcılarınız oturum açtığında, uygulama veritabanını okuyarak kimlik bilgilerini doğrular. Projenizin Account klasörü üyeliğin çeşitli bölümlerini uygulayan dosyaları içerir: kaydolma, oturum açma, parola değiştirme ve erişimi yetkilendirme. Ayrıca, ASP.NET Web Forms OAuth ve OpenID'yi destekler. Bu kimlik doğrulama geliştirmeleri kullanıcıların Facebook, Twitter, Windows Live ve Google gibi hesaplardan mevcut kimlik bilgilerini kullanarak sitenizde oturum açmasına olanak tanır.

Proje Oluşturma - Çözüm Gezgini (ASP.NET Kimliği)

Varsayılan olarak, şablon Web için Visual Studio Express 2013 ile birlikte gelen geliştirme veritabanı sunucusu SQL Server Express LocalDB örneğinde varsayılan veritabanı adını kullanarak bir üyelik veritabanı oluşturur.

SQL Server Express LocalDB

SQL Server Express LocalDB, SQL Server veritabanının birçok programlama özelliğine sahip SQL Server basit bir sürümüdür. SQL Server Express LocalDB kullanıcı modunda çalışır ve yükleme önkoşullarının kısa bir listesini içeren hızlı, sıfır yapılandırmalı bir yüklemeye sahiptir. Microsoft SQL Server'da, herhangi bir veritabanı veya Transact-SQL kodu SQL Server Express LocalDB'den SQL Server ve yükseltme adımları olmadan SQL Azure taşınabilir. Bu nedenle SQL Server Express LocalDB, tüm SQL Server sürümlerini hedefleyen uygulamalar için geliştirici ortamı olarak kullanılabilir. SQL Server Express LocalDB saklı yordamlar, kullanıcı tanımlı işlevler ve toplamalar, .NET Framework tümleştirmesi, uzamsal türler ve SQL Server Compact'de bulunmayan diğer özellikleri etkinleştirir.

Ana Sayfalar

ASP.NET ana sayfası, uygulamanızdaki tüm sayfalar için tutarlı bir görünüm ve davranış tanımlar. Ana sayfanın düzeni, kullanıcının gördüğü son sayfayı oluşturmak için tek bir içerik sayfasındaki içerikle birleştirilir. Wingtip Toys uygulamasında Site.master ana sayfasını değiştirerek Wingtip Toys web sitesindeki tüm sayfaların aynı ayırt edici logoyu ve gezinti çubuğunu paylaşmasını sağlarsınız.

HTML5

ASP.NET Web Forms Uygulaması şablonu, HTML işaretleme dilinin en son sürümü olan HTML5'i destekler. HTML5, Web sitesi oluşturmayı kolaylaştıran yeni öğeleri ve işlevleri destekler.

Modernizr

HTML5'i desteklemeyen tarayıcılar için Modernizr'i kullanabilirsiniz. Modernizr, tarayıcının HTML5 özelliklerini destekleyip desteklemediğini algılayıp desteklemediği takdirde etkinleştirebilen açık kaynaklı bir JavaScript kitaplığıdır. ASP.NET Web Forms Uygulaması şablonunda Modernizr bir NuGet paketi olarak yüklenir.

Bootstrap

Visual Studio 2013 proje şablonları, Twitter tarafından oluşturulan bir düzen ve temalı çerçeve olan Bootstrap'ı kullanır. Bootstrap, hızlı yanıt veren bir tasarım sağlamak için CSS3 kullanır. Bu, düzenlerin farklı tarayıcı pencere boyutlarına dinamik olarak uyum sağlayabildiği anlamına gelir. Uygulamanın genel görünümündeki bir değişikliği kolayca etkilemek için Bootstrap'ın tema özelliğini de kullanabilirsiniz. Varsayılan olarak, Visual Studio 2013'daki ASP.NET Web Uygulaması şablonu Bootstrap'ı NuGet paketi olarak içerir.

NuGet Paketleri

ASP.NET Web Forms Uygulaması şablonu bir dizi NuGet paketi içerir. Bu paketler, açık kaynak kitaplıkları ve araçları biçiminde bileşenli işlevsellik sağlar. Uygulamalarınızı oluşturmanıza ve test etmeye yardımcı olacak çok çeşitli paketler vardır. Visual Studio, NuGet paketlerini eklemeyi, kaldırmayı ve güncelleştirmeyi kolaylaştırır. Geliştiriciler de paket oluşturabilir ve NuGet'e ekleyebilir.

jQuery'nin vurgulandığı NuGet Paketlerini Yönet penceresinin ekran görüntüsü.

Bir paket yüklediğinizde, NuGet dosyaları çözümünüzde kopyalar ve başvuru ekleme ve Web uygulamanızla ilişkili yapılandırmayı değiştirme gibi gerekli değişiklikleri otomatik olarak yapar. Kitaplığı kaldırmaya karar verirseniz, NuGet dosyaları kaldırır ve projenizde yaptığı değişiklikleri tersine çevirerek karışıklığı ortadan kaldırır. NuGet, Visual Studio'daki Araçlar menüsünden kullanılabilir.

jQuery

jQuery , hızlı web geliştirme için HTML belge geçişi, olay işleme, animating ve Ajax etkileşimlerini basitleştiren hızlı ve kısa bir JavaScript Kitaplığıdır. jQuery JavaScript kitaplığı, ASP.NET Web Forms Uygulaması şablonuna NuGet paketi olarak eklenir.

Engelleyici Olmayan Doğrulama

Yerleşik doğrulayıcı denetimleri, istemci tarafı doğrulama mantığı için göze çarpmayan JavaScript kullanacak şekilde yapılandırılmıştır. Bu, sayfa işaretlemesinde satır içinde işlenen JavaScript miktarını önemli ölçüde azaltır ve genel sayfa boyutunu azaltır. ASP.NET Web Forms Uygulama şablonuna, uygulamanın kökündeki Web.configdosyasının <appSettings> öğesindeki ayara bağlı olarak, izlemesiz doğrulama genel olarak eklenir.

Entity Framework Code First

wingtip Toys uygulaması, ASP.NET Web Forms Uygulaması şablonundaki özelliklerin yanı sıra, verilerle çalışırken kod odaklı geliştirmeye olanak sağlayan bir NuGet kitaplığı olan Entity Framework Code First'i kullanır. Basitçe söylemek gerekirse, yazdığınız koda göre uygulamanızın veritabanı bölümünü oluşturur. Entity Framework'i kullanarak verileri kesin olarak yazılan nesneler olarak alır ve işleyebilirsiniz. Bu, verilere erişim ayrıntıları yerine uygulamanızdaki iş mantığına odaklanmanızı sağlar.

ASP.NET Web Forms şablonuna dahil edilen yüklü kitaplıklar ve paketler hakkında ek bilgi için yüklü NuGet paketlerinin listesine bakın. Bunu yapmak için Visual Studio'da yeni bir Web Forms projesi oluşturun, Araçlar>NuGet Paket Yöneticisi>Çözüm için NuGet Paketlerini Yönet'i seçin ve NuGet Paketlerini Yönet iletişim kutusunda Yüklü paketler'i seçin.

Visual Studio Turu

Visual Studio'daki birincil pencereler Çözüm Gezgini, Sunucu Gezgini'ni (Express'te Veritabanı Gezgini), Özellikler Penceresi'ni, Araç Kutusu'nu, Araç Çubuğu'nu ve Belge Penceresi'ni içerir.

Visual Studio'daki birincil pencereleri gösteren diyagram.

Visual Studio hakkında daha fazla bilgi için bkz. Visual Web Geliştiricisi Görsel Kılavuzu.

Özet

Bu öğreticide varsayılan Web Forms uygulamasını oluşturdunuz, gözden geçirdiniz ve çalıştıracaksınız. Varsayılan Web formları uygulamasının farklı özelliklerini gözden geçirdiniz ve Visual Studio ortamını kullanma hakkında bazı temel bilgileri öğrendinsiniz. Aşağıdaki öğreticilerde veri erişim katmanını oluşturacaksınız.

Ek Kaynaklar

Web Uygulaması Projeleri ile Web Sitesi Projeleri karşılaştırması
ASP.NET Web Forms Sayfalarına Genel Bakış