1) Visual Studio açılarak Proje adına ders3 yazılarak onaylanır. Kalıp Olarak Üst kısımdan Empty alt kısımdan MVC seçilir.
2) Boş bir proje karşımıza gelecektir.
3) Solution içinde Entity Framework 6 ‘yı NuGet Package kısmından yüklemek gerekir. Bunun için solution üzerinde sağ tuşa basılarak Manage NuGet Packages seçeneğine tıklanır.
4) Gelen ekranlar onaylanır. İşlem tamamlanınca Close ile çıkılır.
Eğer daha önce kurduysanız şekildeki gibi görünür.
5) Models/Add/Class seçimi yapılarak gelen ekrana User.cs yazılarak onaylanır.
Görüntü şekildeki gibi olacaktır.
POCO (Plain Old CLR Objects): Entity Framework, kendi sınıflarımızı yazabilmemize destek verir. Böylece projemizi otomatik olarak oluşturulan modelle birlikte gelen birçok koddan kurtarıp, daha basit bir model oluşmasını sağlayabiliriz. Bu uygulamada kendi kütüphanemi kendim oluşturuyorum.
6) User isimli class ile tabloma ait sütunları tanımlıyorum. Burada dikkat etmemiz gereken nokta; kendi yazdığımız User sınıfının adının ve özellik adlarının modeldeki isimlerle bire bir aynı olması gerektiğidir.
Burada veri tabanımızda oluşturmak istediğimiz tablolarımızın isimlerini ve içerisindeki alanların türlerini ve isimlerini veriyoruz. Sonuçta; Class veya Classlar birer tablo olacaktır. İçinde tanımladığımız Propertyler ise birer sütun haline dönüşmüş olacaklar . Eğer birden fazla tablo varsa ve tablolar arası ilişki kurmak istiyorsak virtual property kullanmamız gerekir. dikkatinizi çekmişlerdir. Bu propertyler sayesinde de tablolar arasındaki ilişkileri sağlamış oluyoruz.
Tablomuz için gerekli tanımlamamızı yaptığımıza göre bu veri tabanımıza bağlanmak için veya otomatik oluşturulması için DbContext sınıfından türeyen bir Context Class oluşturmamız gerekiyor. Bu Context modelimizi ve sınıflarımızı barındıracaktır.
EF bu classı kullanarak veri tabanımızdaki tablolarla çalışabilecektir. DbSet bir ObjectSet’dir ve Entity Class’ın bir Collection’ıdır.
En üste using System.Data.Entity; ifadesini ekleyelim.
Kodları aşağıdaki gibi değiştirelim. ID aynen kalacak bunun yerine başka bir isim kullanılamaz…
using System;
using System.Data.Entity;
namespace ders1.Models
{
public class User
{
public int ID { get; set; }
public string Ad { get; set; }
public string sehir { get; set; }
public string firma { get; set; }
}
public class UserDbContext : DbContext
{
public DbSet<User> Users { get;set; }
}
}
7) Web.config dosyasını açarak aşağıdaki ifadeyi configuration kapanış tagının(yani en alta) hemen üstüne ekleyelim.
Burada dikkat etmemiz gereken kısım connectionstring name’inin Models klasörü içerisinde oluşturduğumuz datacontext ismi ile aynı olması gerektiğidir.(Bizim örneğimizde bu isim UserDbContext) Aksi taktirde EF projemiz çalıştığı anda bu connectionstring’i kullanmayacaktır ve eğer varsa varsayılan connectionstring’i kullanacaktır.
Bu veri tabanını(User.mdf) daha önce oluşturmadım ve çalışma zamanında hem veri tabanı hem de içerisindeki tablolar otomatik olarak oluşacak.
Veri tabanının oluşacağı yer App_Data klasörüdür.
<connectionStrings>
<add name="UserDbContext"
connectionString="Data Source=(LocalDb)\v11.0; AttachDbFilename=|DataDirectory|\User.mdf;
Integrated Security=true"
providerName="System.Data.SqlClient"/>
</connectionStrings>
8) App_Start altındaki RouteConfig.cs dosyasını açarak bunun içinde yazan Home ifadesini User olarak değiştirelim.
Tüm kodlar aşağıdaki gibi olacak;
namespace ders1
{
public class RouteConfig
{
public static void RegisterRoutes(RouteCollection routes)
{
routes.IgnoreRoute("{resource}.axd/{*pathInfo}");
routes.MapRoute(
name: "Default",
url: "{controller}/{action}/{id}",
defaults: new { controller = "Users", action = "Index", id = UrlParameter.Optional }
);
}
}
}
9) Controllers/Add/New Scaffolded Item seçeneğine tıklayalım.
10)Gelen sihirbaz ekranından sol taraftan Common seçimini ve sağ taraftan 2.seçimi yaparak Add butonuna basalım.
11) Aşağıdaki seçimleri yaparak onaylayalım.
Buradaki Use async controller acitons seçeneğini işaretlersek bu yapı çalışırken biz başka bir iş yapabiliriz. Ancak performans düşer. Çok uzun işlemlerde bu kutucuğu doldurmak faydalı olabilir. Ancak kısa işlemlerde gerek yoktur.
Bu işlem sonucunda Controllers klasörü altında UserController.cs isimli bir dosya oluşması gerekir.
Ayrıca Views klasörü altında birden fazla sayfa oluştuğunu gözlemleyelim.
12) Artık sayfamızı çalıştırabiliriz. Empty proje olduğu için biz bir User Controller oluşturmuş olduk. Yani istediğimiz bilgileri veri tabanında tutacak özel bir yapı oluşturduk. Bu bir seçimdir bu yapıyı temel alarak veri tabanı sayfalarını çoğaltabiliriz.
13) Create New linkine basarak yeni kayıtlar girebiliriz.
14) İlk kayıt oluştuktan sonra sağ tarafta oluşan Edit, Details ve Delete linklerini de kullanabiliriz.
Bir önceki uygulamamızdan devam ediyoruz.
15) Controllers altındaki UsersControllers.cs dosyasını açarak inceleyelim. Burada otomatik kodların yazıldığı unutmayınız.
16) Şimdi sayfalarımızı Türkçeleştirelim. Bunun için Views klasörü altında otomatik olarak oluşmuş olan User klasörü altında bulunan Index.cshtml dosyasını açalım.
17) Sayfanın başlangıcı şekildeki gibidir.
18) Koyu büyük yazılmış kısımları değiştirdik.
IEnumerable: “foreach” döngüsünü kullanmamızı sağlayan ara yüzdür. Array, List, ArrayList, Hashtable vb. birçok koleksiyon IEnumerable sınıfını baz almıştır. Bu sayede, foreach döngüsünü kullanarak bu koleksiyondaki elemanlara ulaşabilmekteyiz.
@model IEnumerable<ders3.Models.User>
@{
ViewBag.Title = "YÜKSEL İNAN";
}
<h2>BAŞLANGIÇ</h2>
<p>
@Html.ActionLink("YENİ KAYIT", "Create")
</p>
<table class="table">
<tr>
<th>
//Buraya İstediğiniz bir başlık yazabiliriz. Alttaki satırı iptal etmeyi unutmayın.
@Html.DisplayNameFor(model => model.Ad)
</th>
<th>
@Html.DisplayNameFor(model => model.Sehir)
</th>
<th>
@Html.DisplayNameFor(model => model.Firma)
</th>
<th></th>
</tr>
@foreach (var item in Model) {
<tr>
<td>
@Html.DisplayFor(modelItem => m.Ad)
</td>
<td>
@Html.DisplayFor(modelItem => m.Sehir)
</td>
<td>
@Html.DisplayFor(modelItem => m.Firma)
</td>
<td>
@Html.ActionLink("DÜZENLE", "Edit", new { id=m.ID }) |
@Html.ActionLink("DETAYLAR", "Details", new { id=m.ID }) |
@Html.ActionLink("SİL", "Delete", new { id=m.ID })
</td>
</tr>
}
</table>
19) Sayfayı yüklediğimizde görüntü şekildeki gibi olacaktır.
20) Edit.cshtml dosyasında aşağıdaki değişiklikleri gerçekleştiriniz.
Bir önceki sayfada yaşadığı şehir için aşağıdaki üç satırı deneyebilirsiniz.
<div>Yaşadığı Şehir</div>
<div class="control-label col-md-2">Yaşadığı Şehir</div>
<div class="control-label col-md-2"><b>Yaşadığı Şehir</b></div>
Edit.cshtml dosyasını açtığınızda bir çok class ifadesi ve bunun yanında bir kontrol adı ve hareketi görmektesiniz. Bunlar hazır Bootstrap kütüphaneleridir. Bu kütüphanelerle sayfamız ilişkilendiren kodlar otomatik olarak eklenmiştir.
<script src="~/Scripts/jquery-1.10.2.min.js"></script>
<script src="~/Scripts/jquery.validate.min.js"></script>
<script src="~/Scripts/jquery.validate.unobtrusive.min.js"></script>
Css ve Jquery yapıları tasarımda büyük kolaylık sağlamaktadır. Buradaki yapılar ile ilgili birçok site vardır. Örneğin http://www.w3schools.com/bootstrap/ sitesinde her yapının görünüşü size sunulmaktadır. Veya BootStrap’ın kendi sayfası olan http://getbootstrap.com/css işinize yarayacaktır.
Örneğin ben bir alert yapısını Create.cshtml dosyasının başında şekildeki gibi koydum.
Çalıştırınca görüntü şekildeki gibi olacaktır;
21) Şimdi birazda fontla oynayalım. Bunun için index.cshtml dosyasını tekrar açarak en alttaki foreach döngüsü içindeki tabloya aşağıda büyütülmüş olarak belirtilen style kodlarını ekleyelim.
İlk tr içindeki style de renk sarı ve zemin rengi mavi olacaktır. Ayrıca siz veri girişini nasıl yaparsanız yapın büyük harfe çevrilecektir.
Kayıtların yanındaki düzenle, detay ve sil linklerinin zemin rengi ise siyah olacaktır. Burada kullanım biçimi verilmiştir. Diğer özellikleri internetten bulabilirsiniz.
@foreach (var item in Model) {
<tr style="color:yellow;background-color:blue;text-transform:uppercase">
<td>
@Html.DisplayFor(modelItem => item.Ad)
</td>
<td>
@Html.DisplayFor(modelItem => item.Sehir)
</td>
<td>
@Html.DisplayFor(modelItem => item.Firma)
</td>
<td style="background-color:black">
@Html.ActionLink("DÜZENLE", "Edit", new { id=item.ID }) |
@Html.ActionLink("DETAYLAR", "Details", new { id=item.ID }) |
@Html.ActionLink("SİL", "Delete", new { id=item.ID })
</td>
</tr>
}
</table>
Sayfa yüklenince görüntü şekildeki gibi olacaktır.
22) Hangi sayfayı açarsak açalım en üst kısımda Application name yazan bir siyah bant vardır. Hatta bu Application name yazısına tıklayınca da sayfa bulunamadı hata mesajı verecektir. Çünkü Home isimli bir sayfamız yoktur.
Bu kısmı düzenlemek için Views klasörü altında bulunan Layout.cshtml dosyasını açalım.
23) Aşağıda büyük harfle yazılan değişiklikleri yapalım.
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>@ViewBag.Title - ANKARA 2015</title>
<link href="~/Content/Site.css" rel="stylesheet" type="text/css" />
<link href="~/Content/bootstrap.min.css" rel="stylesheet" type="text/css" />
<script src="~/Scripts/modernizr-2.6.2.js"></script>
</head>
<body>
<div class="navbar navbar-inverse navbar-fixed-top">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
@Html.ActionLink("BENİM UYGULAMAM", "Index", "Home", null, new { @class = "navbar-brand" })
</div>
<div class="navbar-collapse collapse">
<ul class="nav navbar-nav">
</ul>
</div>
</div>
</div>
<div class="container body-content">
@RenderBody()
<hr />
<footer>
<p>© @DateTime.Now.Year - YÜKSEL TARAFINDAN YAPILDI</p>
</footer>
</div>
<script src="~/Scripts/jquery-1.10.2.min.js"></script>
<script src="~/Scripts/bootstrap.min.js"></script>
</body>
</html>
24) Çalıştırdığımızda sayfa üst başlığı ve alt kısmı şekildeki gibi gözükecektir. Sağ taraftaki link birden fazla satır olduğunda sayfayı açmak-kapatmak için kullanılır.
25) Bu alt başlık (Yüksel Tarafından Yapıldı) renksiz. Bunu daha önceki sytle metodu ile değiştirebiliriz. Ancak bu sefer CSS yöntemi kullanacağız.Layout.cshtml dosyasının üst kısmında baktığımız zaman hemen title tagının altında şöyle ifadeler göreceğiz.
<link href="~/Content/Site.css" rel="stylesheet" type="text/css" />
<link href="~/Content/bootstrap.min.css" rel="stylesheet" type="text/css" />
Bu satırların anlamı proje bulunan CSS dosyaları ile sayfayı ilişkilendiriyoruz. Bu CSS dosyalarını da Content klasörü altında görebiliriz.
26) Yeni bir CSS dosyası oluşturup yukardaki link href ile sayfamıza bağlayabiliriz. Ancak ben var olan bir CSS dosyası içinde yeni bir style tanımlaması yapacağım Bu daha pratik olacaktır. Bunun için ilk olarak Site.CSS dosyasını açalım. Bunun içinde tanımlanmış onlarca style vardır.
En alta inerek .benimbaslik yazarak { açıp } kapattım.(NOKTA koymayı unutmayın)
27) Köşeli parantezler arasında sağ tuşa basarak Build Style seçeneğine tıklayalım. Eğer çıkmaz ise el ile yazacaksınız.
28) Gelen iletişim kutusundan zemin rengi yazı rengi font vesaire ayarlamaları yapalım.
29) Bunun sonucunda aşağıdaki ifadeler otomatik olarak yazılacaktır. Kaydedip çıkalım.
.benimbaslik {
font-family: 'Arial Black';
font-size: x-large;
font-style: italic;
background-color: #0000FF;
color: #FFFF00;
}
30) _Layaout.cshtml dosyasının en altına inerek footer bölümüne aşağıdaki gibi bu class’ı ekleyelim.
<footer>
<div class="benimbaslik">
<p>© @DateTime.Now.Year - YÜKSEL TARAFINDAN YAPILDI</p>
</div>
</footer>
31) Sayfayı yüklediğimizde görüntü şekildeki gibi olacaktır.
32) Üst başlıkta bulunan Benim Uygulamam linkine tıkladığımız zaman sayfa yok hatası ile karşılaşıyoruz.
33) Bunun sebebi Layaout.cshtml dosyası içinde yazılı aşağıdaki satırdan kaynaklanır.
@Html.ActionLink("BENİM UYGULAMAM", "Index", "Home", null, new { @class = "navbar-brand" })
Burada yazılı olan Home ifadesinin anlamı bir dizin adı diğeri ise sayfa adıdır. Biz şimdi rastgele oluşturduğumuz bir sayfaya yönlendireceğiz.
34) Proje adı üzerinde sağ tuşa basarak Add/New item seçeneği işe dede.aspx isimli bir web sayfası ekleyerek içinde “merhaba dede” yazalım.
35) Yukarıdaki ifadeyi aşağıdaki gibi değiştirelim. Buradaki noktanın anlamı ana dizi demektir.
@Html.ActionLink("BENİM UYGULAMAM", "dede.aspx", ".", null, new { @class = "navbar-brand" })
36) Çalıştırarak sonucu gözlemleyelim.
37) Projemizi bir aspx sayfası ile ilişkilendirelim. Bunun için ana dizine index.aspx isimli bir web sayfası ekleyerek üzerine “UYGULAMAMIZA HOŞ GELDİNİZ” ı yazalım. Altına koyduğumuz tablo içine bir Hyperlink kontrolü getirerek onun da Text kısmına Kullanıcı Kayıtları yazalım. Görüntü şekildeki gibi olacaktır.
38) Hyperlink özelliklerinden NavigateUrl kısmına şekildeki gibi ~/Users yazalım. Bu ifade ile direk bizim Views altındaki User klasörü içindeki Index.cshtml dosyasına yönlendirmiş oluyoruz.
39) Index.aspx dosyamızı yükleyerek linke tıkladığımızda Index.cshtml dosyasına gittiğimiz gözlemleyelim.
40) Benim Uygulamam yazısına tıkadığımızda Index.aspx dosyasına dönsün. Ve Benim Uygulamam yazısı yerine ANA SAYFA yazsın. Bu işlemleri yapınız.
Layout.cshtml içinden;
@Html.ActionLink("ANA SAYFA", "index.aspx", ".", null, new { @class = "navbar-brand" })
Bu arada veri tabanı oluşmuş mu? Onu kontrol etmek için App_Data klasörü üzerinde sağ tuşa basarak Open Folder in File Explorer seçimi yapalım.
Projeye dâhil etmek için Show All Files seçilir. Ardından dosya seçilerek
41) Şimdi sitemiz içinde ikinci bir Model ile veri tabanı yapısı oluşturalım. Bunun için ilk olarak
Models/Add/Class seçimi yapılarak gelen ekrana adres.cs yazarak onaylayalım.
42) Kodları aşağıdaki gibi değiştirelim.
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Data.Entity; //Eklemeyi Unutmayınız
namespace ders3.Models
{
public class adres
{
public int ID { get; set; }
public string Ad { get; set; }
public string Yer { get; set; } //Adres yazma class ismi ile çakışır..
public string Tel { get; set; }
public int Maas { get; set; }
}
public class AdresDbContext : DbContext
{
public DbSet<adres> Adresler { get; set; }
}
}
43) Controllers/Add/New Scaffolded Item seçeneğine tıklayalım.
44)Gelen sihirbaz ekranından sol taraftan Common seçimini ve sağ taraftan 2.seçimi yaparak Add butonuna basalım.
45) Aşağıdaki seçimleri yaparak onaylayalım. İsmini AdreslerController verdik.
Bu işlem sonucunda aşağıdaki hata mesajı ile karşılaşırsanız, projenizi derlemeniz gerekir.
Sonuçta Adres klasörü View altında oluşması gerekir.
46) index.aspx dosyamıza ikinci bir Hypertext koyarak “Kullanıcı Bilgileri” yazalım ve Navigate URL kısmına ~\Adresler yazalım.
47) index.aspx sayfasını yükleyerek yeni oluşturduğumuz veri tabanına bilgileri girelim.
İsterseniz bu kısmı yeni bir proje açarak yapabilirsiniz.
48) Kontrol yapısını daha iyi anlamak için bu sefer yeni bir boş kontrol ekleyeceğiz. Bunun için Controllers klasörü üzerinde sağ tuşa basarak Add/Controller seçimi yaptıktan sonra MVC-5 Controller-Empty kalıbını seçerek Add butonuna basıyoruz.
HomeController adı ile ekleyelim.
49) İçindeki kodları aşağıdaki gibi yapılandıralım.
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
namespace ders0.Controllers
{
public class HomeController : Controller
{
//
// GET: /Home/
public ActionResult Index()
{
return View();
}
public ActionResult Welcome()
{
ViewBag.Message = "Merhaba Dünyalı Hoş Geldin";
return View();
}
}
}
50) View klasörü altında Home klasörü yoksa oluşturalım varsa sorun yok. Ardından Home klasörü üzerinde sağ tuşa basarak Add/View seçeneğine basarak ismine Index verelim.
Burada Use a layout page seçeneğini işaretlediğimiz için varsayılan olarak bir seçim yapılmasa bile üst ve alt başlığı kullanacaktır. Eğer istemiyorsak bu kutuyu boş bırakmak gerekir.
51) index.aspx içine yeni bir Hypertext ekleyerek bu sayfa ile ilişkilendirelim.
52) Index.aspx sayfasını yükleyerek seçim yapalım ve şekildeki yapının geldiğini gözlemleyelim.
53) Artık kendi alt ve üst başlığımızı sıfırdan
oluşturalım. Bunun için Shared klasörü üzerinde sağ tuşa basarak Add
MVC 5 Layout Page seçimi yaparak ismine _HomeLayout
diyelim.
54) Kod kısmını aşağıdaki gibi yapılandıralım. Esasında bizim ana sayfamızdaki kodlar ile aynı sadece iki satır ilave ettik. Onun için Layout.cshtm içindeki kodları kopyalayın. Sadece değişiklikleri yansıtın.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<title>@ViewBag.Title - Home Sayfası</title>
<link href="~/Content/Site.css" rel="stylesheet" type="text/css" />
<link href="~/Content/bootstrap.min.css" rel="stylesheet" type="text/css" />
<script src="~/Scripts/modernizr-2.6.2.js"></script>
</head>
<body>
<div class="navbar navbar-inverse navbar-fixed-top">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
@Html.ActionLink("Yeni Başlık", "Index", "Home", null, new { @class = "navbar-brand" })
@Html.ActionLink("Home", "Index", "Home")
@Html.ActionLink("Welcome", "Welcome", "Home")
</div>
<div class="navbar-collapse collapse">
<ul class="nav navbar-nav">
</ul>
</div>
</div>
</div>
<div class="container body-content">
@RenderBody()
<hr />
<footer>
<p>© @DateTime.Now.Year - YÜKSEL-KADIKÖY</p>
</footer>
</div>
<script src="~/Scripts/jquery-1.10.2.min.js"></script>
<script src="~/Scripts/bootstrap.min.js"></script>
</body>
</html>
Bu iki sattırın diğer bir yazılış şekli . Hemen alttaki <ul class > içine <li> tagları arasına yazılabilir. Hangi görüntü hoşunuza gitti ise onu kullanınız.
<div class="navbar-collapse collapse">
<ul class="nav navbar-nav">
<li> @Html.ActionLink("Home", "Index", "Home") </li>
<li> @Html.ActionLink("Welcome", "Welcome", "Home") </li>
</ul>
</div>
55) Home klasörü içindeki Index.cshtml sayfamızı bu layout sayfası ile ilişkilendirmek için Index sayfasının kod kısmına aşağıdaki ifadeyi yazalım.
@{
ViewBag.Title = "Index";
Layout = "~/Views/Shared/_HomeLayout.cshtml";
}
<h2>Index</h2>
HOME içindeki Index sayfasındasınız.
56) Yeni bir sayfayı Home klasörü altına welcome adı ile ekleyelim. Bu sefer yeni layout sayfamızla direk olarak ilişkilendirdik.
57) Çalıştırabiliriz.
58) Model daha öne oluşturmuştuk. Yeni bir model oluşturalım. Ancak bunu yeni proje de yapıyorsanız ilk olarak yapmanız gerekenleri kısaca hatırlayalım.
Eğer projenize daha önce kurduysanız görüntü aşağıdaki gibi olacaktır.
59) Models klasörü üzerinde Add/Class seçeneğini kullanarak Okul.cs isimli bir class ekleyelim.
60) İçindeki kodları aşağıdaki gibi düzenleyelim.
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Data.Entity; //Eklemeyi Unutmayalım
namespace ders3.Models
{
public class okul
{
public int ID { get; set; } //Bu değişmez
public string Ad { get; set; }
public int Sozlu { get; set; }
public int Yazılı { get; set; }
public string Derece { get; set; }
}
public class okulDbContext : DbContext
{
public DbSet<okul> okulnot { get; set; }
}
}
61) Veri tabanı bağlantısı için eğer bu proje yeni ise web.config içine configuration kapanış tagının hemen üstüne aşağıdaki kodları ilave ediyoruz.
<connectionStrings>
<add name="okulDbContext"
connectionString="Data Source=(LocalDb)\v11.0;
AttachDbFilename=|DataDirectory|\okul.mdf;
Integrated Security=true"
providerName="System.Data.SqlClient"/>
</connectionStrings>
62) Projemizi derledikten sonra Controllers üzerinde sağ tuş Add ve New Scaffolded Item seçeneğine tıklayarak kalıbımızı seçelim.
63) Projemizi derleyelim. Şekildeki seçimleri yaparak
onaylayalım.
64) _HomeLayout sayfasında daha önce eklediğimiz üst başlık seçeneklerinin altına aşağıda büyük yazılmış satırı ekleyelim.
@Html.ActionLink("Yeni Başlık", "Index", "Home", null, new { @class = "navbar-brand" })
@Html.ActionLink("Home", "Index", "Home")
@Html.ActionLink("Welcome", "Welcome", "Home")
@Html.ActionLink("Okulumuz", "Index", "Okullar")
65) Projemizi çalıştırarak Home seçimi yapalım ve buradan üst kısımda görünen Okulumuz linkine tıklayalım.
66) Şu ana kadar oluşturduğumuz tüm bilgiler veri tabanında tutulmaktadır. Bunu görmek için Server Explorer kısmını kullanabiliriz.
67) Şu ana kadar pek çok kullandığımız razor page’ler sayesinde çok kullanışlı ve performanslı sayfa oluşturduk. Bu kısımda bir razor sayfası daha oluşturarak linkimize ilave edelim. Bunun için Home folder üzerinde sağ tuşa basarak Add/MVC 5 View Page (Razor) seçeneğine tıklayalım.
68) zaman ismi vererek oluşturalım.
Kod kısmına geçtiğimiz layoutu olmayan boş bir sayfa olarak oluştuğunu gözlemleyebliriz.
69) div taglarının arasına aşağıdaki kodları yazalım.
Merhaba <p>Saat: @System.DateTime.Now.ToLongTimeString(); </p>
<hr />
Tarih:@System.DateTime.Now.ToLongDateString();
70) HomeLayout sayfasına aşağıdaki satırı ilave edelim.
@Html.ActionLink("ZamanveTarih", "zaman", "Home")
71) HomeController içine aşağıdaki satırı ekleyelim.
public ActionResult zaman()
{
ViewBag.Message = "Zaman zaman o zaman";
return View();
}
71) Çalıştırarak sayfayı gözlemleyelim.