razor display engine
by Dave
Sun 5 February 2012 @ 13:57
Yesterday I updated the software that controls this site to the latest version of BlogEngine.Net. One of the changes this has allowed is that I have now been able to build the UI all over again in Razor. This is Microsoft’s new web-rendering language which as a general rule is a lot lighter than asp.net. It was developed as a result of a need to make asp.net be a little more accessible, and a lot more approachable for designers.
Consider the code block below, which is the head section from this page. While still maintaining the overall feeling of HTML, it allows injection of code to be done on a much more flexible basis than traditional asp.net. As you can see, the code is wrapped in quotation marks, in meta tags and within script blocks. The more I use it, the more I’m liking how my markup “feels”, and how easier it is to manage than traditional asp. If nothing else, <% %> is no longer needed and the replacement @( ) is a lot easier to type!
@Page.Title
<script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.7.1.min.js"></script>
<script type="text/javascript" src="@Href(Utils.RelativeWebRoot + "></script>
<script type="text/javascript" src="@Href(Utils.RelativeWebRoot + "></script>
<script type="text/javascript">
$(document).ready(function () {
var imageList = ['@Href(Utils.RelativeWebRoot + "themes/" + BlogSettings.Instance.Theme + "/images/mastheads/logo-blue.png")',
'@Href(Utils.RelativeWebRoot + "themes/" + BlogSettings.Instance.Theme + "/images/mastheads/logo-bw.png")',
'@Href(Utils.RelativeWebRoot + "themes/" + BlogSettings.Instance.Theme + "/images/mastheads/logo-green.png")',
'@Href(Utils.RelativeWebRoot + "themes/" + BlogSettings.Instance.Theme + "/images/mastheads/logo-mono.png")',
'@Href(Utils.RelativeWebRoot + "themes/" + BlogSettings.Instance.Theme + "/images/mastheads/logo-red.png")'];
var imgToDisplay = imageList[Math.floor(Math.random() * imageList.length)]
$('#imgMasthead').attr('src', imgToDisplay);
});
</script>
The @Page.Title is far more accessible to non-programmers than <asp:label id="Title" runat="server"/> . It is also a lot easier to type, which actually makes a fairly big difference. Likewise @Href(someVariables) handles outputting a URI. It can handle multiple strings and variables built up within the brackets.
I’ve been playing around with Razor for a while now and I have to admit that I seem to be able to type it with a little more speed than I can standard asp.net.