ASP.NET Web Pages - Razor 코드 추가

이 튜토리얼에서는 C#과 Visual Basic 코드를 사용하여 Razor 마크업을 사용할 것입니다.

Razor는 무엇인가요?

  • Razor는 웹 페이지에 서버 기반 코드를 추가하는 마크업 문법입니다
  • Razor는 전통적인 ASP.NET 마크업의 기능을 가지고 있지만, 더 쉽게 배울 수 있으며, 더 쉽게 사용할 수 있습니다
  • Razor는 ASP와 PHP와 유사한 서버 측 마크업 문법입니다
  • Razor는 C#과 Visual Basic 프로그래밍 언어를 지원합니다

Razor 코드 추가

지난 장에서의 웹 페이지를 기억하십니까:

<!DOCTYPE html>
<html lang="en">
<head>
   <meta charset="utf-8" />
    <title>Web Pages 데모</title>
</head>
<body>
    <h1>Hello Web Pages</h1>
</body>
</html>

이제 예제에 Razor 코드를 추가하세요:

예제

<!DOCTYPE html>
<html lang="en">
<head>
     <meta charset="utf-8" />
     <title>Web Pages 데모</title>
</head>
<body>
     <h1>Hello Web Pages</h1> 
     <p>시간은 @DateTime.Now입니다</p>
</body>
</html>

실행 예제

이 페이지는 일반적인 HTML 태그를 포함하고 있으며, @ 표시로 표시된 Razor 코드도 포함하고 있습니다.

Razor 코드의 모든 작업은 서버에서 현재 시간을 검출하여 표시하는 것입니다. (형식 옵션을 지정할 수 있으며, 기본 형식으로 표시할 수도 있습니다)

C#의 주요 Razor 문법 규칙

  • Razor 코드 블록은 @{ ... }로 감싸집니다
  • 행 내 표현식(변수와 함수)은 @으로 시작됩니다
  • 코드 문장은 세미콜론으로 끝납니다
  • 변수는 var 키워드를 사용하여 선언됩니다
  • 문자는 쌍따옴표로 둘러싸여 있습니다
  • C# 코드는 대소문자를 구분합니다
  • C# 파일의 확장자는 .cshtml입니다

C# 예제

<!-- 단一行 코드 블록 -->
@{ var myMessage = "Hello World"; }
<!-- 행 내 표현식 또는 변수 -->
<p>myMessage의 값은: @myMessage</p> 
<!-- 여러 줄 코드 블록 -->
@{}}
var greeting = "Welcome to our site!";
var weekDay = DateTime.Now.DayOfWeek;
var greetingMessage = greeting + " Today is: " + weekDay;
}
<p>인사말은: @greetingMessage</p>

실행 예제

VB의 주요 Razor 문법 규칙

  • Razor 코드 블록은 @Code ... End로 둘러싸여 있습니다
  • 행 내 표현식(변수와 함수)은 @으로 시작됩니다
  • 변수는 Dim 키워드로 선언됩니다
  • 문자는 쌍따옴표로 둘러싸여 있습니다
  • C# 코드는 대소문자를 구분하지 않습니다
  • C# 파일의 확장자는 .vbhtml입니다

예제

<!-- 단一行 코드 블록 -->
@Code dim myMessage = "Hello World" End Code
<!-- 행 내 표현식 또는 변수 -->
<p>myMessage의 값은: @myMessage</p> 
<!-- 여러 줄 코드 블록 -->
@Code
dim greeting = "Welcome to our site!" 
dim weekDay = DateTime.Now.DayOfWeek 
dim greetingMessage = greeting & " Today is: " & weekDay
End Code 
<p>인사말은: @greetingMessage</p>

실행 예제

C#과 Visual Basic에 대한更多信息

Razor 및 C#과 Visual Basic 프로그래밍 언어에 대해 더 많이 배우고 싶다면, 이 튜토리얼의 Razor 부분