ASP.NET MVC Northwind Demo Using the Spark View Engine

asp.net mvc, asp.net 0 comments suggest edit

While at PDC, I met Louis DeJardin and we had some lively discussions on various topics around ASP.NET MVC. He kept bugging me about some view engine called Flint? No… Electricity? No… Spark!

I had heard of it, but never got around to actually playing with it until after the conference. And the verdict is, I really like it.

Spark is a view engine for both Monorail and ASP.NET MVC. It supports multiple content area layouts much like master pages, which is one thing that seems to be lacking in many other view engines I’ve seen, which only support a single content area, correct me if I’m wrong. Not only that, but he’s already included IronPython and IronRuby support.

But what I really like about it is the simple way you effectively data bind HTML elements to code. Let’s start with a simple example. Suppose you have an enumeration of products you’re passing to the view from your controller action. Here’s how you might render it in Spark.

<viewdata model="IEnumerable[[Product]]"/>

<ul class="products">
  <li each="var product in ViewData.Model">${product.ProductName}</li>
</ul>

Note the each attribute of the <li> tag contains a code expression. This will repeat the <li> tag once per product. The <viewdata> element there declares the type of the ViewData.Model property.

Spark still supports using code nuggets <% %> when you absolutely need them. For example, when using the BeginForm method, I needed a using block, so I used the code nuggets.

Just for fun, I redid the views of my Northwind sample to replace all the ASPX views with Spark as a demonstartion of using an alternative view engine. Try it out.

UPDATE: Updated to the latest version of ASP.NET MVC and Spark as of ASP.NET MVC 1.0 RC 2.

Found a typo or error? Suggest an edit! If accepted, your contribution is listed automatically here.

Comments

avatar

26 responses

  1. Avatar for Gabriel Bog&#233;a
    Gabriel Bog&#233;a December 7th, 2008

    This is really cool Phil. I'm already used to NVelocity because of my Java roots but Spark seems to introduce a new twist to the way velocity does things. I give it further attention. Who knows, maybe it can even replace the old (but effective) NVelocity.

  2. Avatar for Lerxst
    Lerxst December 8th, 2008

    I really like how fluent it reads; even though technically this is equivalent to the default ASP.NET View Engine, it "feels" less spaghetti.

  3. Avatar for Erik
    Erik December 8th, 2008

    I haven't had a chance to play with this yet myself either but I am intrigued. Thanks for bringing this back to my attention Phil. =)

  4. Avatar for James Brechtel
    James Brechtel December 8th, 2008

    Hi Phil,
    I don't see any Spark views in that download...only webforms/aspx. Did you link to the wrong zip or am I missing something?

  5. Avatar for haacked
    haacked December 8th, 2008

    Whoops, I uploaded the wrong one. One sec.
    Ok, I updated the link to the correct one. Sorry about that.

  6. Avatar for James Brechtel
    James Brechtel December 8th, 2008

    Got it...thanks.

  7. Avatar for cowgaR
    cowgaR December 8th, 2008

    I've said it many time I'll say it again.
    Despite many articles of (quite few) view engines and many many (and many more) gurus advocating them (and saying how the default spagetti like code behind engine is bad) I still see no reason to jump from the default to these engines...
    1. .aspx gets the job done, everyone is familiar with it, zero learning curve, constant developement (etc etc), new things appearing on regular basis and I think it is quite feature rich
    2. I can use some interesting free ASP.NET Webforms controls (recent example - charting control) quite easily as well as some paid one (telerik) and I don't see a reason not to do so. Can I use them in others? Like CAPTCHA controls and such?
    3. In the end I am really doing just the basic HTML fillings, I am not a superb designer. Layout/Design is usually in the hands of Photoshop/XHTML/CSS gurus and they will deliver whatever C# developers need (and I just adjust minor things).
    4. Imagine a situation where you will receive a lot of design stuff from your co-worker and you will start rewriting it to NHaml...wow, how geeky! I know it can be automated but...why?
    A lot of criticism from me, nothing but success to View Engines folk. But just because I have a hammer in my hand not everything for me is a nail. I CAN change view engine, but give me _concise_ reason to do so.
    Not this hackers (sorry Phil;-) toys that it looks cool and I feel better and (add whatever you want) but tell me something like - we've invented ASP.NET MVC controls which can do this and this ten thousands times lighter and better, supports JSON data exchange using JQUERY out of the box and partial AJAX updating is a matter of writting just half of a letter (you don't even need to click it, it will guees it for you =D ). NOW I will consider.
    thanks for reading, maybe I am another newbie developer in MVC world, but Mr. Jeff Atwood built www.stackoverflow.com using the defaults and didn't die (just was swearing a bit more ;-).
    Now, I am really going to study spark, probably it has something which will increase my productivity, and will clean my car at least during the weekends :)

  8. Avatar for David Hayden
    David Hayden December 8th, 2008

    I am using Spark in my current project and really enjoy using it. It is less verbose than the webforms view engine and has a few features that make managing and creating views quite enjoyable. I also like that Louis is really active about adding new features and open to suggestions.
    Kudos to Louis for all his hard work...

  9. Avatar for Andrei Rînea
    Andrei Rînea December 8th, 2008

    Nice work for the Spark engine developer(s) and for Phil to show it to us.
    However, I'm afraid, I'll have to agree with cowgaR on all of the things he said above.

  10. Avatar for Ben Scheirman
    Ben Scheirman December 8th, 2008

    Phil,
    Both NVelocity and Brails support multiple content areas, and I bet NHaml does too. It's just usually hard to find the right information on these view engines.
    As for the sample you posted, I don't know... it looks clean I guess, but no cleaner than what you'd get with NVelocity.
    <ul>
    #foreach $p in $viewdata.model
    <li>$p.name</li>
    #end
    </ul>
    Maybe it's just personal preference, but NVelocity seems a lot easier to read and write. Also, you still don't get refactoring support or intellisense, so what's so great about it?

  11. Avatar for Louis DeJardin
    Louis DeJardin December 8th, 2008

    Cool, I've been Haacked. :)
    @ben, Yep, I've used NVelocity for a few years too. The named-content features of Spark are heavily influenced by the capturefor directive.
    @cowgaR, @Andrei, I guess the most concise reason would be you'll type less and your views will look more like html. What more could you ask for? :)

  12. Avatar for Torkel
    Torkel December 8th, 2008

    You guess now that you have seen light(the spark) Haacked, will you ever be able to use WebForms view engine again? :)
    Spark has really shaped up, it is very feature rich, with a lot of small features that are all focused on keeping your markup as clean as possible (for example auto variables).
    www.codinginstinct.com/.../...s-of-brilliance.html
    Although Sparks offer a much better syntax for a html templating engine compared to the webforms engines, the loss of Intellisense and Resharper support has to be considered.

  13. Avatar for cowgaR
    cowgaR December 8th, 2008

    Louis, you're cool guy and your work is certainly moving ASP.NET MVC framework towards gaining more popularity, which is simply what it needs to get addopted by coders from PHP/JAVA/RUBY world.
    But as Ben said (and I stupidly shouted;-) you don't get intellisense, so you will write more and I on the other hand will just do *affirmative Sir!*. :)
    Or even better, I usually use "soldiers" to do the design, and because they are generally "stupid" and all they know is XHTML/CSS I can't expect any other results from them.

    What would be great for a lazy one like me is:

    1. I'll import the design templates of all the pages in XHTML.
    2. I run some _cool_ tool and it will transform them to View engine specific language (I really enjoy NHaml and I am not VB.NET guy) detecting common practices (very few in XHTML) and using View Engine tricks to do them "better" in less code.
    3. Then it will (via some Visual Studio plugin) bring somehing like the design surface in code editor to better understand the structure (like different color background inside code editor for different blocks [think Firefox HTML plugins], highligthing the loops and "expanding" them when I hower on them with my mouse, and thinks like that, cool when I imagine it using NHaml).
    4. And of course I will have FULL intellisense when adding/modifying stuff and bringing new ideas when connecting these things with JQuery.

    Now I am starting my work with these bare views and connecting them to my controllers/models, and I am really enjoying what I see, it is like the design and code connected together, and modifying things is a pleasure because I really do write less and see more on a screen (NHaml doesn't have closing tags).

    I think inserting some ASP.NET controls (which work) wouldn't be a big problem providing we would have source code, but it would be nice if the engines would support them.

    wow, again a long post, that is becasue I am still a beginner in MVC world but I really like it, for me it is definitely better than Webforms...I feel more in control.
    Thanks Phil for your work on ASP.NET MVC, and one question I allways wanted to write to Scott Gu but were afraid to ask ;-)
    what about if the default views had .mvcx extension so we could differentiate them from classic webforms files more easily? I really like mvcx file extension ;P

  14. Avatar for Doug Wilson
    Doug Wilson December 8th, 2008

    Spark reminds me a bit too much of ColdFusion. Those days are behind me now and I'd rather not go back.

  15. Avatar for Louis DeJardin
    Louis DeJardin December 9th, 2008

    @cowgaR Yes, yes, intellisense. That would be the holy grail. It's almost as tricky to implement as you would expect it to be. :)
    However I submit if your view templates are sufficiently html-like, and you follow guidelines about "don't break the ${}'s", your xhtml/css specialists would be very productive working directly in a Spark views folder. Even with elements like for /for and if /if, since the indentation, scope, and closing of them are visually and syntactically xhtml.

    @doug I get that a lot; it's even more similar to Genshi. It's just a coincidence, honest.

  16. Avatar for haacked
    haacked December 9th, 2008

    @Ben Scheirman I think the NVelocity example has a bit more syntactic noise, though not much. For example, you have to have the #end in just the right place.
    With Spark, the "end" is the closing &lt;/li&gt; tag. Talk about DRY!
    @cowGaR I'm not trying to push Spark on anybody. I just thought it was an interesting approach. I have a feeling that most people will stick with the defaults, and they'll be good enough for them. But for those who have a personal preference for a different style of view template, I'd like them to be aware of alternatives, that's all.

  17. Avatar for Steve Wagner
    Steve Wagner December 9th, 2008

    I dont like on Spark that it is really hard to find the template code between the html attributes. I think it must be more clear what is template and what is html.
    But here is the NHaml example :-)
    %ul.products
    - foreach( var product in ViewData.Model )
    %li=product.ProductName

  18. Avatar for anon
    anon December 10th, 2008

    So.. how about a XAML viewengine?

  19. Avatar for Manuel Martone
    Manuel Martone December 10th, 2008

    Hi Phil,
    I'm really excited about Spark and all the things it brings to asp.net mvc world, why i'm saying so? because in the first time I saw the mvc engine I was really excited about it, but, the web forms view engine brings me, my rememberings, to the past, to the asp years, where the code was mixed up with the markup and all the things possible, and this makes me to not so think well about mvc..
    But when I learned more about view engines, I saw it was possible to replace them, and I said "maybe it's possible to òrovide a different engine, well organized and well structured".. I say this, because I really love Struts programming tags (eg. if, switch, ect) and the way them avoid to mix code and markup, I was waiting something similar in asp.net mvc which personally I think better the Struts way..even if, it's clear, asp.net mvc needs to grow more...
    So I really like Spark, and personally I'm going to use it in my next project.
    Thanks and sorry for my english
    p.s.
    Uh, if nothing like Spark was come out, I was seriously thinking about starting a "call of duty" for an open source project to build up something similar...

  20. Avatar for Andrei Rînea
    Andrei Rînea December 11th, 2008

    On the other hand let's not be too harsh on the Spark view engine. It's so nice that in ASP.NET MVC we have choices. The more the better.
    We have ASPX, NHaml, Spark, NVelocity, who knows next...
    Choose the one you feel best ;)
    Congrats to you Louis DeJardin and don't be upset on me ;)

  21. Avatar for Louis DeJardin
    Louis DeJardin December 12th, 2008

    Oh of course, please don't worry about that. :) You're exactly right it's nice to have options and I wouldn't encourage anyone really happy with their technology to switch.
    Also keeping a eye out for comments about what's missing helps guide priorities, so threads like this are very much appreciated.

  22. Avatar for Ngoc
    Ngoc December 14th, 2008

    Hi Haacked,
    In a view, how can I get current action that return the view. The ViewContext property is only allow me to get the current controller but not current action. Can you help me?

  23. Avatar for Saurabh
    Saurabh February 3rd, 2009

    Hi Haacked......
    I trid Spart View Engine with Asp.Net MVC RC1
    it gives an error.
    Could not load type 'Spark.ISparkServiceInitialize' from assembly 'Spark, Version=1.0.0.0, Culture=neutral, PublicKeyToken=7f8549eed921a12c'.
    Can u plz tell us why this error comes
    Kind Regards,
    Saurabh

  24. Avatar for Saurabh
    Saurabh February 3rd, 2009

    @Louis DeJardin
    Is Spark View Engine is working with Asp.Net MVC RC1 ???
    Kind Regards,
    Saurabh

  25. Avatar for Lou
    Lou February 15th, 2009

    Hi @Saurabh, the dev group would probably be a good place to send questions. Cheers, Lou.
    http://groups.google.com/group/spark-dev

  26. Avatar for George
    George December 17th, 2009

    Thanks for sharing. The attached file used to work but now seems to be curropted for some reason, please can you help.