Razor 구문

Posted in .NET Framework // Posted at 2011. 7. 19. 10:05
728x90
체계적으로 한번은 봐야하는 Razor!. 다른 곳에 집중하느라 아직 제대로 훓어 보지 못하고 있다.
일단 간단한 Razor 구문을 정리해 본다.

1. Razor 코드 블럭
Razor 에서는 골뱅이(@) 키워드가 핵심이다.
과거 ASP.NET 에서 인라인 코드 작성할 때 사용했던 아래와 같은 구문이,
<script runat="server"> ... </script>

Razor에서는 다음과 같이 축약되었다. 과거에 존재했던, 스크립트 선언문과 서버로직이라는 명시가 필요 없어져 매우 간단해졌다
@{ ... }

이 코드 블럭에 닷넷 로직을 구현할 수 있다. 대략 다음과 같이...
@{
int i = 10;
Response.Write(i.ToString());
    }

여기서 한가지 주의할 점은, 코드 블럭을 시작하는 @와 중괄호({) 사이에는 공백이 허용되지 않는다는 것이다.
즉, 아래와 같이 작성하면 런타임 오류를 만나게 된다.
@
{
   ...
}

2. Razor 주석
다른 구문을 보기 전에 주석문 정의를 살펴보자. Razor의 코드 블럭안에서의 주석은, 이전과 동일하게 한줄 주석은 //, 여러줄 주석은 /* ... */ 로 가능하다. 대략 다음과 같다.
@{
        //주석...
        /*
        int i = 5;
        Response.Write(i.ToString());
        */
    }

코드 블럭 바깥에서의 주석 역시 지원하는데 다음과 같이 사용가능하다. @와 *를 같이 사용한다.
@*
       Razor 주석
*@

참고로 당연한 말이지만, Razor 주석은 HTML 주석(<!-- ... -->과는 달리, 서버측 주석이기 때문에 페이지 페이지 랜더링 후, DOM으로 생성되지 않는다.

3. 변수 출력
이전 환경의 ASP.NET 에서는 서버 로직에 구현된 변수를 페이지에 출력하기 위해서는 코드 블럭 안에서는Response.Write 메서드,  코드 블럭 바깥에서는 <%= 변수 %> 구문을 사용했었다. 그러나 Razor 에서는 두 경우 모두 변수에 @만 붙여주면 된다.

@{  
       var str = "Hello, Razor!";  
       @str;
    }

코드 블럭 바깥에서도 단순히 아래와 같이 변수를 출력할 수 있다.
@str

4. Razor 구문 안의 일반 텍스트
만일 Razor 구문안에서 일반 텍스트를 한번에 표현하고 싶을 경우 @: 키워드를 사용할 수 있다.
이전 같으면 변수와 문자열을 + 연산자로 합치고 Response.Write 해야 할 것을 다음과 같이 간단해졌다.
@{      
       var str = "Hello, Razor!";
       @:Plane Text... @str;
   }

5. Razor 구문 안의 마크업 태그
일반 텍스트와는 달리 태그의 경우에는 Razor 구문에서 별다른 키워드 없이 바로 사용가능하다
@{      
       var str = "Hello, Razor!";
      <b>@str</b>
   }

그리고 태그와 함께라면 일반 텍스트도 바로 사용 가능하다.
@{      
       var str = "Hello, Razor!";
      <b>반갑습니다</b>
   }

Razor 엔진에서는 태그를 인식해서 특별한 구문 없이 바로 출력 가능하도록 한 것 같다.

그렇다면 Razor 엔진이 HTML 태그를 모두 기억하고 있는 것일까? 그렇진 않은 것 같다. 다음과 같이 의미없는 태그를 삽입해도 오류 없이 결과를 내뱉는걸 보니, 태그를 기억하는 것이 아니라 태그 기호( <태그>)를 인식하는 듯 하다.
@{      
       var str = "Hello, Razor!";
      <btt>@str;</btt>
   }

한가지 주의할 점은, Razor 구문안에 태그를 혼용할 경우 반드시 여는 태그와 닫는 태그가 쌍으로 존재해야 한다. 다시 말해 다음과 같은 태그 작성은 허용되지 않는다.
@{      
       var str = "Hello, Razor!";
      <b>@str;
   }

6. 조건문
조건문 역시 @ 키워드와 함께 사용할 수 있다. 다음과 같이.
@if(1==1) {
        <font size=@i>@str</font>
    }

7. 반복문
반목문도 사용패턴이 동일하다. 아래 코드는 목록을 만드는 반복문 예를 보여준다.
<ul>
    @for (int i = 0; i < 5; i++)
    {

        <li>@i</li>
    }
  </ul>

동일한 예를 while 반목문으로 처리하는 다음과 같다.
<ul>
    @{
        int i = 0;
        while(i < 5)
        {

            <li>@(i++)</li>
        }
     }
 </ul>

8. 키워드가 아닌 문자로써 '@' 사용하기
Razor 에서는 @ 자체가 키워드이기 문자 출력에 바로 사용할 수 없다. 즉 실제 '@'라는 문자를 출력하고 싶을 경우에는 다음과 같이 @@ 연속해서 두번 써 줘야 한다. 이렇게 하면 Razor 엔진은 @를 키워드로 인식하지 않고 일반 문자로 출력해 준다.
<span>@@난 그냥 골뱅이 문자야</span>


지금까지 아주 기본적인 Razor 구문을 살펴 봤다. 실제 구현시에는 더 많은 상황이 닥칠 것이다.
그럴땐 아래 asp.net 사이트 글을 참조하도록 하자. Razor 구문의 대부분의 규칙을 확인할 수 있다

=> Introduction to ASP.NET Web Programming Using the Razor Syntax

'.NET Framework' 카테고리의 다른 글

LING to SQL에서 다중 결과 셋 받기  (0) 2012.11.13
MVC 다중 폼 유효성 체크  (0) 2012.09.07
ASP.NET Razor  (5) 2010.12.13
웹 리소스 요청 막기, HttpNotFoundHandler  (0) 2010.08.09
ASP.NET MVC, 폼 데이타 전송하기  (0) 2010.08.06

ASP.NET Razor

Posted in .NET Framework // Posted at 2010. 12. 13. 18:24
728x90

아... 이 코드의 유연함(?)을 보라!


[출처: 코드파티 ASP.NET Razor 동영상 강의 중...]

과거 ASP의 스파게티가 생각나지 않는가?
ASP.NET의 또 하나의 새로운 시도 Razor(레이저라고 발음)의 코드이다

빠른 개발, 쉬운 개발을 지향하며 탄생한 레이저!
확실히 ASP.NET 웹폼의 그것과는 비교할 수 없이 유연하다

이런 코딩 스타일은 확실히 스파게티 모양새다.
시대가 변하면서 코딩 스타일을 바라보는 시각도 변하는 것 같다.

HTML 코드와 ASP.NET 코드를 철저히 분리하려고 시도하면서 칭송(?) 받았던 ASP.NET 웹폼의 코딩 스타일은 확실히 무거운 느낌이었다.

물론 Razor의 특징을 이 코드블록만으로 설명할 수는 없다.
장점이 분명 있으며 나 역시 프로젝트에 도입을 하려 한다.

그러나 일단 코딩 스타일을 스파게티로 구성할 수 있도록 열어 둔 점은 확실히 시대가 또 변했음을 느낀다