Views in Practice

The Views folder contains the HTML files for a view. Their extension will be determined by their code.

File types commonly found in the folder include, but are not limited to the following types:

HTML .html
ASP .asp
ASP.NET .aspx
ASP.NET Razor C# .cshtml
ASP.NET Razor VB .vbhtml

One folder exists for each controller.


Modifying a controller class to use a view template file creates a view. The Razor view engine is one tool for creating a view template. Some developers prefer Razor due to its clean, minimalist code and the speed of developing code for a template. There are many ways to create a template, but the general syntax used follows:

	var name = “Text”; @* Comments *@

Add code by starting a block with the “@” character. Enclose code blocks in curly braces. End statements with a semicolon, enclose literal string values with double quotation marks, and enclose comments with “@*” and “*@.” Whitespace has no effect on statements.

Note that code is case sensitive; for example, two variables with the same name in different cases (e.g., “powertools” and “PowerTools”) will be treated as 2 different variables.

Review a sample document template below:

@using Payroll.UI.Repo;
	ManageLink(new LinkEntry {Type = "image/x-icon", Rel = "shortcut",
		Href = Url.Content("~/design/objects/tree.ico")});
<!DOCTYPE html>
<html lang="en" class="static @Repo.PageClass()">
		<meta charset="utf-8" />


Edit the _layout.cshtml file to modify a template and the general substance of a view. Typical edits include modifications to formatting, structure, and behavior; virtually identical to modifying any HTML document. Changes made to the layout file will be cloned in the _ViewStart.cshtml file. ViewBag can be used to modify the layout in use.

Review the sample layout template below:

@* Page.RegisterStyle("page.css"); *@
	Model.Top.Add(Display.Top(), "8");
	Model.Top.Add(Display.TheUser(), "12");
	Model.Top.Add(Model.SiteMap, "17");
<div id="page">
	<div id="main">
		<div id="welcome">
		<div id="content-wrapper">
			<div id="material">
		<div id="sidebar-wrapper">
			<div id="leftpane">
	<div id="footer-wrapper">

Though view templates offer more functionality capabilities (much like CSS sheets), best practices dictate to avoid performing logic or interaction with a view template. Maintain separation of objectives to keep code clean.