Aracılığıyla paylaş


ASP.NET Kullanmaya Başlama

yazan: Tom FitzMacken

Yeni web uygulaması geliştirme için Razor Pages'i öneririz. Daha fazla bilgi için bkz . Razor Pages'i kullanmaya başlama.

Not

WebMatrix artık ASP.NET Web Sayfaları için tümleşik bir geliştirme ortamı olarak önerilmez. Visual Studio veya Visual Studio Code kullanın.

Bu kılavuz ve uygulama, ASP.NET Web Sayfaları (sürüm 2 veya üzeri) ve dinamik web siteleri oluşturmaya yönelik basit bir çerçeve olan Razor söz dizimine genel bir bakış sağlar. Ayrıca, sayfa ve site oluşturmaya yönelik bir araç olan WebMatrix'i de tanıtır.

Düzey: ASP.NET Web Sayfalarında yeni.
Kabul edilen beceriler: HTML, temel basamaklı stil sayfaları (CSS).

Kümenin ilk öğreticisinde öğrenecekleriniz:

  • Web Sayfaları teknolojisinin ne ASP.NET ve ne için olduğunu.
  • WebMatrix'in ne olduğu.
  • Her şeyi yükleme.
  • WebMatrix kullanarak web sitesi oluşturma.

Ele alınan özellikler/teknolojiler:

  • Microsoft Web Platformu Yükleyicisi.
  • Webmatrix.
  • .cshtml sayfaları

Mike Pope başlangıçta bu öğreticiyi yazdı. Tom FitzMacken, Microsoft WebMatrix 3 için güncelleştirdi.

Öğreticide kullanılan yazılım sürümleri

  • ASP.NET Web Sayfaları (Razor) 2
  • WebMatrix 3

Ne bilmeniz gerekir?

Aşağıdakiler hakkında bilgi sahibi olduğunuzu varsayıyoruz:

  • HTML. Derinlemesine uzmanlık gerekmez. HTML'yi açıklamayacağız, ancak karmaşık bir şey de kullanmıyoruz. Yararlı olduğunu düşündüğümüz HTML öğreticilerinin bağlantılarını sağlayacağız.
  • Basamaklı stil sayfaları (CSS). HTML ile aynı.
  • Temel veritabanı fikirleri. Veriler için bir elektronik tablo kullandıysanız ve verileri sıralayıp filtrelediyseniz, bu öğretici kümesi için genel olarak kabul ettiğimiz uzmanlık düzeyi budur.

Ayrıca temel programlamayı öğrenmek istediğinizi de varsayıyoruz. ASP.NET Web Sayfaları C# adlı bir programlama dili kullanır. Programlamayla ilgili herhangi bir geçmişe sahip olmanız gerekmez, yalnızca ilginizi çekebilirsiniz. Daha önce bir web sayfasında JavaScript yazdıysanız, birçok arka planınız vardır.

Programlama hakkında bilginiz varsa, biz yeni programcıları hızlandırırken bu öğretici kümesinin başlangıçta yavaş hareket ettiğini fark edebilirsiniz. Ancak ilk birkaç öğreticiyi geçtikçe, açıklanacak daha az temel programlama olacak ve işler daha hızlı bir klipte ilerleyecek.

Neye ihtiyacınız var?

İşte gerekenler:

  • Windows 8, Windows 7, Windows Server 2008 veya Windows Server 2012 çalıştıran bir bilgisayar.
  • Canlı internet bağlantısı.
  • Yönetici ayrıcalıkları (yükleme işlemi için gereklidir).

ASP.NET Web Sayfaları nedir?

ASP.NET Web Sayfaları, dinamik web sayfaları oluşturmak için kullanabileceğiniz bir çerçevedir. Basit bir HTML web sayfası statiktir; içeriği, sayfadaki sabit HTML işaretlemesi tarafından belirlenir. ASP.NET Web Sayfaları ile oluşturduğunuz sayfalar gibi dinamik sayfalar, sayfa içeriğini anında kod kullanarak oluşturmanıza olanak sağlar.

Dinamik sayfalar, her türlü işlemi yapmanızı sağlar. Bir form kullanarak bir kullanıcıdan giriş isteyebilir ve sonra sayfanın ne görüntüleyeceğini veya nasıl görüneceğini değiştirebilirsiniz. Bir kullanıcıdan bilgi alabilir, veritabanında kaydedebilir ve daha sonra listeleyebilirsiniz. Sitenizden e-posta gönderebilirsiniz. Web'de diğer hizmetlerle (örneğin, bir eşleme hizmeti) etkileşimde bulunabilir ve bu kaynaklardan gelen bilgileri tümleştiren sayfalar oluşturabilirsiniz.

WebMatrix nedir?

WebMatrix bir web sayfası düzenleyicisini, veritabanı yardımcı programını, sayfaları test etmek için bir web sunucusunu ve web sitenizi İnternet'te yayımlamaya yönelik özellikleri tümleştiren bir araçtır. WebMatrix ücretsizdir ve yüklemesi ve kullanımı kolaydır. (Yalnızca düz HTML sayfaları ve PHP gibi diğer teknolojiler için de çalışır.)

ASP.NET Web Sayfaları ile çalışmak için WebMatrix kullanmanız gerekmez . Örneğin bir metin düzenleyicisi kullanarak sayfalar oluşturabilir ve erişiminiz olan bir web sunucusunu kullanarak sayfaları test edebilirsiniz. Ancak, WebMatrix her şeyi çok kolaylaştırır, bu nedenle bu öğreticiler webmatrix'i her zaman kullanır.

Bu Öğreticiler Hakkında

Bu öğretici kümesi, ASP.NET Web Sayfalarının nasıl kullanılacağına giriş niteliğindedir. Bu giriş öğretici kümesinde toplam 9 öğretici vardır. Sizi ASP.NET Web Sayfalarından gerçek, profesyonel görünümlü web siteleri oluşturmaya götüren bir dizi öğretici kümesinin bir parçasıdır.

Bu ilk öğretici kümesi, ASP.NET Web Sayfaları ile çalışma hakkında temel bilgileri göstermeye odaklanır. İşiniz bittiğinde, bunun nerede sona erdiğini seçen ve Web Sayfalarını daha ayrıntılı bir şekilde inceleyen ek öğretici kümeleriyle çalışabilirsiniz.

Ayrıntılı açıklamalarda kasıtlı olarak daha kolay bir şekilde ilerleriz. Ve ne zaman bir şey göstersek, bu öğretici kümesi için her zaman anlaşılması en kolay olduğunu düşündüğümüz yöntemi seçeriz. Sonraki öğretici kümeleri daha derine iner ve size daha verimli veya daha esnek yaklaşımlar (ayrıca daha eğlenceli) gösterir. Ancak bu öğreticiler için öncelikle temel bilgileri anlamanız gerekir.

Yeni başlattığınız öğretici kümesi, ASP.NET Web Sayfalarının şu özelliklerini kapsar:

  • Giriş ve her şeyi yükleme. (Bu, okumakta olduğunuz öğreticide yer alır.)
  • ASP.NET Web Sayfaları programlamanın temelleri.
  • Veritabanı oluşturma.
  • Kullanıcı giriş formu oluşturma ve işleme.
  • Veritabanında veri ekleme, güncelleştirme ve silme.

Ne oluşturacaksınız?

Bu öğretici kümesi ve sonrakiler, beğendiğiniz filmleri listeleyebileceğiniz bir web sitesi etrafında döner. Film girebilir, bunları düzenleyebilir ve listeleyebilirsiniz. Bu öğretici kümesinde oluşturacağınız birkaç sayfa aşağıdadır. İlki, oluşturacağınız film listeleme sayfasını gösterir:

Film listesini gösteren finshed Movie uygulaması

İşte sitenize yeni film bilgileri eklemenize olanak tanıyan sayfa:

Film Ekle sayfasını gösteren tamamlanmış film uygulaması

Sonraki öğretici kümeleri bu kümede oluşturulur ve resimleri karşıya yükleme, kişilerin oturum açmasına izin verme, e-posta gönderme ve sosyal medyayla tümleştirme gibi daha fazla işlev ekler.

Bkz. Azure'da Çalışan Bu Uygulama

Tamamlanmış sitenin canlı web uygulaması olarak çalıştığını görmek ister misiniz? Aşağıdaki düğmeye tıklayarak uygulamanın tam sürümünü Azure hesabınıza dağıtabilirsiniz.

Azure dağıtım işlevinin düğmesi.

Bu çözümü Azure'a dağıtmak için bir Azure hesabınızın olması gerekir. Henüz bir hesabınız yoksa aşağıdaki seçeneklere sahip olursunuz:

  • Ücretsiz bir Azure hesabı açma - Ücretli Azure hizmetlerini denemek için kullanabileceğiniz kredileri alırsınız ve bunlar kullanıldıktan sonra bile hesabı tutabilir ve ücretsiz Azure hizmetlerini kullanabilirsiniz.
  • MSDN abone avantajlarını etkinleştirme - MSDN aboneliğiniz, ücretli Azure hizmetleri için kullanabileceğiniz her ay size kredi verir.

Her Şeyi Yükleme

Microsoft'un Web Platformu Yükleyicisi'ni kullanarak her şeyi yükleyebilirsiniz. Aslında yükleyiciyi yükler ve ardından diğer her şeyi yüklemek için kullanırsınız.

Web Sayfalarını kullanmak için en az SP3 yüklü Windows XP veya Windows Server 2008 veya sonraki bir sürümüne sahip olmanız gerekir.

ASP.NET web sitesinin Web Sayfaları sayfasındaYükle'ye tıklayın.

WebMatrix'i yüklemeden önce lisans koşullarını ve gizlilik bildirimini kabul edin.

yüklemeyi başlatmak için terimi kabul etme

Yüklemeyi başlatmak için Çalıştır'a tıklayın. (Yükleyiciyi kaydetmek istiyorsanız Kaydet'e tıklayın ve ardından yükleyiciyi kaydettiğiniz klasörden çalıştırın.)

Çalıştır düğmesinin kırmızı dikdörtgenle vurgulandığı, tarayıcı penceresi programının çalıştırılan başlığının ekran görüntüsü.

Web Platformu Yükleyicisi, WebMatrix'i yüklemeye hazır olarak görünür. Yükle'ye tıklayın.

Microsoft Web Matrisi yükleyicisinin, Yükle düğmesinin kırmızı dikdörtgenle vurgulandığı Web Platformu Yükleyicisi'nin ekran görüntüsü.

Yükleme işlemi, bilgisayarınıza nelerin yükleneceğini belirler ve işlemi başlatır. Tam olarak nelerin yüklenmesi gerektiğine bağlı olarak, işlem birkaç dakikadan birkaç dakikaya kadar sürebilir. Lisans koşullarını kabul etmek için Kabul Ediyorum'a tıklayın.

Merhaba, WebMatrix

İşlem tamamlandığında, yükleme işlemi WebMatrix'i otomatik olarak başlatabilir. Aksi takdirde, Windows'ta Başlatmenüsünden Microsoft WebMatrix'i başlatın.

WebMatrix'i ilk kez başlattığınızda, Microsoft hesabınızla Microsoft Azure'da oturum açma şansınız olur. Oturum açarak Azure üzerinden 10 ücretsiz web uygulaması alırsınız. Bu ücretsiz web uygulamaları, uygulamalarınızı test etmek için kullanışlı bir yol sağlar. Henüz bir Azure hesabınız yoksa ancak MSDN aboneliğiniz varsa MSDN aboneliği avantajlarınızı etkinleştirebilirsiniz. Aksi takdirde, yalnızca birkaç dakika içinde ücretsiz bir deneme hesabı oluşturabilirsiniz. Ayrıntılı bilgi için bkz. Azure Ücretsiz Deneme Sürümü.

Bu öğreticiye devam etmek için şu anda oturum açmanız gerekmez. Şimdi oturum açmazsanız daha sonra oturum açma seçeneğiniz devam eder. Bu öğretici serisinin son konusu , web sitenizi Azure'a dağıtmayı kapsar; bu nedenle, bu konuyu tamamlamak için oturum açmanız gerekir.

Bu noktada Microsoft hesabınızla oturum açın veya sağ alt köşedeki Şimdi Değil'i seçin.

Oturum Aç

Başlamak için boş bir web sitesi oluşturacak ve bir sayfa ekleyeceksiniz. Bu kümenin sonraki öğreticilerinde yerleşik web sitesi şablonlarından biriyle oynayacaksınız.

Başlangıç penceresinde Yeni'ye tıklayın.

WebMatrix başlangıç ekranı

Şablonlar, farklı web sitesi türleri için önceden oluşturulmuş dosyalar ve sayfalardır. Varsayılan olarak kullanılabilen tüm şablonları görmek için Şablon Galerisi seçeneğini belirleyin.

Şablon Galerisi'ne tıklayın

Hızlı Başlangıç penceresinde, ASP.NET grubundan Siteyi Boşalt'ı seçin ve yeni siteyi "WebPagesMovies" olarak adlandırın.

Boş Site şablonunun seçili olduğu WebMatrix Hızlı Başlangıç penceresi

İleri’ye tıklayın.

Microsoft hesabınızda oturum açtıysanız, size siteyi Azure'da oluşturma fırsatı verilir. Sitenizin adına bağlı olarak varsayılan WebPagesMovies.azurewebsites.net adı önerilir; ancak ünlem işareti bu adın Windows Azure'da kullanılamadığını gösterir. Kolaylık olması için Şu anda Azure'da web sitesi oluşturmayı atlamak için Atla'yı seçin. Bu serinin ilerleyen bölümlerinde siteyi Azure'da yayımlayacağız.

azure sitesi oluşturma

WebMatrix siteyi oluşturur ve açar:

WebMatrix'te yeni WebPagesMovies sitesi açıldı

Üst kısımda Hızlı Erişim Araç Çubuğu ve şerit bulunur. Sol altta, görevler (Site, Dosyalar, Veritabanları, Raporlar) arasında geçiş yaptığınız çalışma alanı seçicisini görürsünüz. Sağ tarafta düzenleyici ve raporlar için içerik bölmesi bulunur. Alt kısımda ise bazen iletiler için bir bildirim çubuğu görürsünüz.

Bu öğreticileri incelerken WebMatrix ve özellikleri hakkında daha fazla bilgi edineceksiniz.

Web Sayfası Oluşturma

WebMatrix ve ASP.NET Web Sayfalarını tanımak için basit bir sayfa oluşturacaksınız.

Çalışma alanı seçicisinde Dosyalar çalışma alanını seçin. Bu çalışma alanı, dosya ve klasörlerle çalışmanızı sağlar. Sol bölmede sitenizin dosya yapısı gösterilir. Şerit, dosyayla ilgili görevleri gösterecek şekilde değişir.

WebMatrix'te Dosya Çalışma Alanı

Şeritte, Yeni'nin altındaki oka tıklayın ve ardından Yeni Dosya'ya tıklayın.

Yeni dosya oluşturmak için şeritteki

WebMatrix, dosya türlerinin listesini görüntüler. CSHTML'yi seçin ve Ad kutusuna "HelloWorld" yazın. CSHTML sayfası bir ASP.NET Web Sayfaları sayfasıdır.

HelloWorld.cshtml adlı yeni bir CSHTML sayfası oluşturma

Tamam'a tıklayın.

WebMatrix sayfayı oluşturur ve düzenleyicide açar.

WebMatrix düzenleyicisindeki yeni HelloWorld sayfası

Gördüğünüz gibi sayfa, en üstte şuna benzeyen bir blok dışında çoğunlukla sıradan HTML işaretlemesi içeriyor:

@{ 

}

Bu, kısa süre sonra göreceğiniz gibi kod eklemeye yöneliktir.

Sayfanın farklı bölümlerinin (öğe adları, öznitelikler ve metnin yanı sıra üstteki blok) farklı renklere sahip olduğuna dikkat edin. Bu , söz dizimi vurgulama olarak adlandırılır ve her şeyi net tutmayı kolaylaştırır. WebMatrix'te web sayfalarıyla çalışmayı kolaylaştıran özelliklerden biridir.

aşağıdaki örnekteki <head> gibi ve <body> öğeleri için içerik ekleyin. (İsterseniz aşağıdaki bloğu kopyalayabilir ve mevcut sayfanın tamamını bu kodla değiştirebilirsiniz.)

@{

}

<!DOCTYPE html>

<html lang="en">
    <head>
        <meta charset="utf-8" />
        <title>Hello World Page</title>
    </head>
    <body>
        <h1>Hello World Page</h1>
        <p>Hello World!</p>
    </body>
</html>

Hızlı Erişim Araç Çubuğu'nda veya Dosya menüsünde Kaydet'e tıklayın.

WebMatrix Hızlı Erişim Araç Çubuğu'ndaki Kaydet düğmesi

Sayfayı Test Etme

Dosyalar çalışma alanında HelloWorld.cshtml sayfasına sağ tıklayın ve ardından Tarayıcıda başlat'a tıklayın.

WebMatrix şeridindeki Çalıştır düğmesini kullanarak sayfa çalıştırma

WebMatrix, bilgisayarınızda sayfaları test etmek için kullanabileceğiniz yerleşik bir web sunucusu (IIS Express) başlatır. (WebMatrix'te IIS Express olmadan, test etmeden önce sayfanızı bir web sunucusunda yayımlamanız gerekir.) Sayfa varsayılan tarayıcınızda görüntülenir.

Tarayıcıda çalışan

WebMatrix'te bir sayfayı test ettiğinizde, tarayıcıdaki URL'nin Localhost adı yerel bir sunucuya başvuruyor gibi bir şey http://localhost:33651/HelloWorld.cshtml. olduğuna ve bu da sayfaya kendi bilgisayarınızda bulunan bir web sunucusu tarafından sunulduğuna dikkat edin. Belirtildiği gibi, WebMatrix bir sayfayı başlattığınızda çalışan IIS Express adlı bir web sunucusu programı içerir.

localhost'un ardından gelen sayı (örneğin, localhost:33651), bilgisayarınızdaki bir bağlantı noktası numarasını ifade eder. Bu, IIS Express bu web sitesi için kullandığı "kanalın" numarasıdır. Bağlantı noktası numarası, sitenizi oluştururken 1024 ile 65536 aralığından rastgele seçilir ve oluşturduğunuz her site için farklıdır. (Kendi sitenizi test ettiğinizde, bağlantı noktası numarası neredeyse kesinlikle 33561'den farklı bir sayı olacaktır.) her web sitesi için farklı bir bağlantı noktası kullanarak, IIS Express hangi sitelerinizle konuştuğunu açık tutabilir.

Daha sonra sitenizi genel bir web sunucusunda yayımladığınızda, URL'de artık localhost'u görmezsiniz. Bu noktada, sayfa gibi http://myhostingsite/mywebsite/HelloWorld.cshtml daha tipik bir URL görürsünüz. Bu öğretici serisinin ilerleyen bölümlerinde site yayımlama hakkında daha fazla bilgi edineceksiniz.

Bazı Server-Side Kodu Ekleme

Tarayıcıyı kapatın ve WebMatrix'te sayfaya geri dönün.

Kod bloğuna aşağıdaki kod gibi görünecek şekilde bir satır ekleyin:

@{
   var currentDateTime = DateTime.Now;
}

Bu biraz Razor kodu. Muhtemelen geçerli tarih ve saati aldığı ve bu değeri adlı currentDateTimebir değişkene koyduğu açıktır. Sonraki öğreticide Razor söz dizimi hakkında daha fazla bilgi edineceksiniz.

Sayfanın gövdesinde, öğesinden <p>Hello World!</p> sonra aşağıdakileri ekleyin:

<p>Right now it's @currentDateTime</p>

Bu kod, en üstteki değişkene currentDateTime yerleştirdiğiniz değeri alır ve sayfanın işaretlemesine ekler. Karakter, @ sayfadaki ASP.NET Web Sayfaları kodunu işaretler.

Sayfayı yeniden çalıştırın (WebMatrix, sayfayı çalıştırmadan önce değişiklikleri sizin için kaydeder). Bu kez sayfada tarih ve saati görürsünüz.

Dinamik olarak oluşturulan bir zaman görüntüsüyle tarayıcıda çalışan

Birkaç dakika bekleyin ve ardından tarayıcıda sayfayı yenileyin. Tarih ve saat görünümü güncelleştirilir.

Tarayıcıda sayfa kaynağına bakın. Aşağıdaki işaretlemeye benzer şekilde görünür:

<!DOCTYPE html>

<html lang="en">
    <head>
        <meta charset="utf-8" />
        <title>Hello World Page</title>
    </head>
    <body>
        <h1>Hello World Page</h1>
        <p>Hello World!</p>
        <p>Right now it's 1/18/2012 2:49:50 PM</p>
    </body>
</html>

Üstteki bloğun @{ } orada olmadığına dikkat edin. Ayrıca, tarih ve saat ekranında .cshtml sayfasında olduğu gibi gerçek @currentDateTime bir karakter dizesi (1/18/2012 2:49:50 PMveya her neyse) gösterildiğine de dikkat edin. Burada olan şey, sayfayı çalıştırdığınızda ASP.NET ile işaretlenmiş olan tüm kodu (bu örnekte çok az) işlediğinizdir @. Kod çıkış oluşturur ve bu çıkış sayfaya eklenir.

web sayfalarının ASP.NET konusu budur

ASP.NET Web Sayfalarının dinamik web içeriği ürettiğini okuduğunuzda, burada gördüğünüz fikir budur. Yeni oluşturduğunuz sayfa, daha önce gördüğünüz HTML işaretlemesinin aynısını içeriyor. Ayrıca her türlü görevi gerçekleştirebilen kod da içerebilir. Bu örnekte, geçerli tarih ve saati almak için basit bir görev yaptı. Gördüğünüz gibi, sayfada çıkış oluşturmak için kodu HTML ile birlikte kullanabilirsiniz. Birisi tarayıcıda bir .cshtml sayfası istediğinde, ASP.NET sayfa hala web sunucusunun elindeyken sayfayı işler. ASP.NET, kodun çıkışını (varsa) sayfaya HTML olarak ekler. Kod işleme tamamlandığında, ASP.NET sonuçta elde edilen sayfayı tarayıcıya gönderir. Tarayıcının aldığı tek şey HTML'dir. İşte bir diyagram:

ASP.NET dinamik olarak HTML oluşturma şekline yönelik kavramsal akış

Bu basit bir fikirdir, ancak kodun gerçekleştirebileceği birçok ilginç görev vardır ve sayfaya dinamik olarak HTML içeriği eklemenin birçok ilginç yolu vardır. Ayrıca herhangi bir HTML sayfası gibi .cshtml sayfalarını ASP.NET, tarayıcının kendisinde (JavaScript ve jQuery kodu) çalışan kod da içerebilir. Bu öğretici kümesinde ve sonraki öğreticilerde bunların tümünü keşfedeceksiniz.

Sonraki Geliyor

Bu serinin sonraki öğreticisinde ASP.NET Web Sayfaları programlamasını biraz daha keşfedersiniz.

Ek Kaynaklar

Sıfırdan bir ASP.NET web sitesi oluşturun. Bu, özellikle WebMatrix (Web Sayfaları ASP.NET değil) kullanımıyla ilgili bir öğreticidir. WebMatrix'in bu öğretici kümesinde ele almayacağı bazı ek özellikleri hakkında biraz daha ayrıntılı bilgi verir.