ASP.NET Core 2 Fundamentals

Build cross-platform apps and dynamic web services with this server-side web application framework

Onur Gumus, Mugilan T. S. Ragupathi

• Publisher: Packt Publishing
• Year: 2018
• ISBN:
  9781789533552
• Edition: 1
• Topic: Ciencia de la computación
• Subtopic: Lenguajes de programación

Imagine the boost in business if you can build large, rich web applications with little code and built-in Windows authentication. With this book, you can gain skills to develop real-world applications with ASP.NET Core 2.

Key Features

• Adopts the application-centric approach to explain core concepts
• Covers industry-best practices to build flexible, robust applications
• Shows how to enhance your applications by adding more functionalities

Book Description

The book sets the stage with an introduction to web applications and helps you build an understanding of the tried-and-true MVC architecture. You learn all about views, from what is the Razor view engine to tagging helpers. You gain insight into what models are, how to bind them, and how to migrate database using the correct model. As you get comfortable with the world of ASP.NET, you learn about validation and routing. You also learn the advanced concepts, such as designing Rest Buy (a RESTful shopping cart application), creating entities for it, and creating EF context and migrations. By the time you are done reading the book, you will be able to optimally use ASP.NET to develop, unit test, and deploy applications like a pro.

What you will learn

• Work with basic programming constructs using the Razor view engine
• Use flexibility and data compartmentalization of ViewModel
• Build a custom route for ASP.NET MVC applications for SEO
• Optimize applications with performance analysis and improvement steps
• Improve application performance, security, and data access to optimize the overall development process
• Deploy an ASP.NET MVC application in a non-Windows environment

Who this book is for

If you are looking to build web applications using ASP.NET Core or you want to become a pro in building web applications using the Microsoft technology, this is the ideal book for you. Prior exposure and understanding of C#, JavaScript, HTML, and CSS syntax is assumed.

Views

Views are the actual output of an application which are delivered to the user. They are what users actually see on the screen when they access your application. All components, including menus, input elements, dialog boxes, and everything else the user sees come from your views. If you do not provide a good user experience when accessing your application, users will not care how great your application is. So, views play a critical role when building an ASP.NET MVC application. Separating views from a controller allows the HTML design process to be separate from the logic. It is also beneficial in terms of unit testing the controller.

By the end of this chapter, you will be able to:

• Explain the purpose of the view engine and the Razor view engine
• Program in the Razor view engine and use different programming constructs
• Work with the layout in ASP.NET Core and its features
• Generate HTML code
• Create and call partial views
• Create a view component
• Create custom Tag Helpers

The View Engine and the Razor View Engine

As discussed in Chapter 1, Setting the Stage, a browser can only understand HTML, CSS, and JavaScript. The purpose of the view engine is to generate the HTML code from your view and send it to the browser so that it can understand the content. Primarily, there are two different types of view engines—the Razor view engine and the Web Form view engine. Although these two view engines come out of the box with ASP.NET MVC, you can use any custom view engine.

The Razor View Engine

The Razor view engine is the default and recommended view engine in ASP.NET Core. Going forward, it may be the only view engine that comes out of the box when you install ASP.NET MVC.

You can mix C# code and HTML code in your Razor view and the Razor view engine is intelligent enough to distinguish between the two and generate the expected output. In some scenarios, you may have to give additional information to the Razor view to produce appropriate results. Razor code blocks start with the @ symbol but do not require a closing @.

Programming in the Razor View Engine

Programming in the Razor view engine is just like programming in C#. The difference is that, in the Razor view engine, your C# code will be mixed with HTML to produce the desired HTML output.

Variables in the Razor View

You can declare a variable inside the Razor block and use that variable using the @ symbol.

In all the examples in this chapter, we will only present the code samples of the view.

Working with Razor View

Here's an example for us to explore Razor view. Follow these steps:

1. Create a new empty ASP.NET Core project.
2. Create a Controllers folder and a controller called HomeController.
3. Create a folder called Views, a subfolder called Home, and a view file called Index.cshtml by right-clicking on the context menu, navigating to Add | New Item, and then selecting MVC View Page from the list.

According to the pattern of configuration over convention, the controller name must match the appropriate view folder. Hence, we name the controller HomeController and the view folder Home.

4. Make sure your Startup.cs file looks as follows:

Go to https://goo.gl/qzz2aT to access the code.

public class Startup
{
 // This method gets called by the runtime. Use this method to add services to the container.
 // For more information on how to configure your application, visit
  https://go.microsoft.com/fwlink/?LinkID=398940
 public void ConfigureServices(IServiceCollection services)
 {
 services.AddMvc();
 }
…
…
}

5. The HomeController.cs file will have the following code:

Go to https://goo.gl/vWxjRq to access the code.
When copying code from the link provided, remember to append it with the closing curly brace for the HomeController class, as shown in the preceding code snippet.

public class HomeController : Controller
{
 // GET: /<controller>/
 public IActionResult Index()
 {
 return View();
 }
}

Next is the updated MVC view page, where we will declare a variable and use it. The first five lines and the last two lines are simple HTML elements.

We will concentrate on the lines that are bold. Then, we will create a Razor block using @ { … } and declare a variable inside it. The Razor block ends with the closing curly bracket. The snippet Value: is considered simple HTML text. As we would like to use the Razor variable value, we will use @i to instruct the Razor view engine that i is not normal HTML text; it is a Razor construct and is to be treated accordingly. The complete HTML code is as follows:

Go to https://goo.gl/Jch17b to access the code.

<html>
<head>
 <title> Views demo</title>
</head>
<body>
 @{
 int i = 5;
 }
 Value: @i
</body>
</html>

When you run the application, you'll see the following output:

When you access the Razor variable, you will need to use the @ symbol. Without this, the Razor view engine sees the i variable as text and not as an expression.

The following screenshot is the result you will get when you access the variable without the @ symbol:

Programming Constructs in the Razor View

You can use most of the programming constructs available in C# in the Razor view. Let's look at some of these in detail.

The for Loop

Writing code for the for loop is pretty straightforward. Let's write a piece of code for the for loop construct.

Here's the code for the for loop construct where we loop thro...