ASP.NET Razor – C# and VB Code Syntax

Welcome to The Coding College, your go-to resource for mastering web development. In this guide, we’ll explore the syntax differences and features of C# and VB.NET in ASP.NET Razor. Whether you’re a C# enthusiast or prefer VB.NET, Razor empowers you to combine server-side logic with HTML seamlessly.

What Is Razor Syntax?

Razor is a streamlined syntax for embedding server-side code in HTML in ASP.NET Web Pages. It supports both C# and VB.NET, making it flexible for developers with different language preferences.

Why Use Razor Syntax?

  1. Lightweight and Clean: Minimal code with no boilerplate.
  2. Secure by Design: Automatically encodes output to prevent XSS attacks.
  3. Flexibility: Supports both C# and VB.NET, enabling developers to use their preferred language.

Razor Syntax Basics

Razor syntax begins with the @ symbol to indicate server-side code.

C# Example

<p>The current year is: @DateTime.Now.Year</p>

VB.NET Example

<p>The current year is: @DateTime.Now.Year</p>

In both languages, Razor automatically switches between HTML and server-side code.

Code Blocks in Razor

Code blocks allow you to include multiple lines of logic.

C#:

@{
    var name = "John";
    var age = 30;
}
<p>Name: @name</p>
<p>Age: @age</p>

VB.NET:

@Code
    Dim name As String = "John"
    Dim age As Integer = 30
End Code
<p>Name: @name</p>
<p>Age: @age</p>

Conditional Statements

Razor makes it easy to add conditions in your web pages.

C#:

@{
    var isLoggedIn = true;
}
@if (isLoggedIn)
{
    <p>Welcome back!</p>
}
else
{
    <p>Please log in.</p>
}

VB.NET:

@Code
    Dim isLoggedIn As Boolean = True
End Code
@if isLoggedIn Then
    <p>Welcome back!</p>
Else
    <p>Please log in.</p>
End If

Loops in Razor

Razor supports loops for rendering repetitive content.

C#: Using foreach

@{
    var fruits = new[] { "Apple", "Banana", "Cherry" };
}
<ul>
    @foreach (var fruit in fruits)
    {
        <li>@fruit</li>
    }
</ul>

VB.NET: Using For Each

@Code
    Dim fruits As String() = {"Apple", "Banana", "Cherry"}
End Code
<ul>
    @For Each fruit In fruits
        <li>@fruit</li>
    Next
</ul>

Inline Expressions

Inline expressions embed server-side code directly within HTML.

C#:

<p>2 + 2 = @(2 + 2)</p>

VB.NET:

<p>2 + 2 = @(2 + 2)</p>

Working with Variables

C#: Declaring and Using Variables

@{
    var greeting = "Hello, world!";
}
<p>@greeting</p>

VB.NET: Declaring and Using Variables

@Code
    Dim greeting As String = "Hello, world!"
End Code
<p>@greeting</p>

Calling Methods

Razor lets you call server-side methods directly.

C#:

@{
    string Greet(string name) => $"Hello, {name}!";
    var message = Greet("John");
}
<p>@message</p>

VB.NET:

@Code
    Function Greet(name As String) As String
        Return $"Hello, {name}!"
    End Function
    Dim message As String = Greet("John")
End Code
<p>@message</p>

Combining Razor with HTML Attributes

You can dynamically generate HTML attributes using Razor.

C#:

@{
    var isActive = true;
}
<div class="menu-item @(isActive ? "active" : "")">Home</div>

VB.NET:

@Code
    Dim isActive As Boolean = True
End Code
<div class="menu-item @(If(isActive, "active", ""))">Home</div>

HTML Encoding in Razor

Razor automatically encodes output to protect against XSS.

Example:

@{
    var script = "<script>alert('Hello!')</script>";
}
<p>@script</p> <!-- Output: <script>alert('Hello!')</script> -->

To display raw HTML, use Html.Raw.

<p>@Html.Raw(script)</p> <!-- Output: <script>alert('Hello!')</script> -->

Switching Between C# and VB.NET

While you can choose either C# or VB.NET in Razor, the choice depends on your project settings. Ensure your project is configured to support the language you prefer.

Best Practices for Razor Code Syntax

  1. Keep Razor Views Clean
    Limit logic in Razor views; use controllers or models for complex operations.
  2. Comment Your Code
    Use @* *@ for Razor-specific comments. @* This is a Razor comment *@
  3. Organize Your Code
    Use the App_Code folder for reusable functions and classes.
  4. Test for HTML Encoding
    Ensure that all user-generated content is properly encoded to avoid vulnerabilities.

Why Learn Razor Syntax with The Coding College?

At The Coding College, we simplify complex concepts into actionable tutorials. Whether you prefer C# or VB.NET, mastering Razor Syntax will elevate your web development skills, enabling you to build robust and dynamic applications.

Explore more ASP.NET tutorials at The Coding College and take your coding journey to the next level.

Have any questions or need more examples? Let us know in the comments below, and don’t forget to check out our other ASP.NET Razor guides!

Leave a Comment