I’ve been playing around with .NET MVC3 with the Razor engine for work, and I must say it’s really cool. There’s a lot of functionality built in, and it makes developing sites super easy. You get all the benefits of an MVC application, while at the same time, building a website with reusable HTML modules.

One thing I just found for it is the addition of SASS/Coffee-Script. These are basically just higher levels of CSS and Javascript. The format is a little different, but the code is compiled into CSS or Javascript respectively.

So for instance if you take this SASS code snippet (notice how intuitive it is and clear to understand what is going on):

.fakeshadow {
border: {
style: solid;
left: {
width: 4px;
color: #888;
}
right: {
width: 2px;
color: #ccc;
}
}
}

Compiles to the CSS:

.fakeshadow {
  border-style: solid;
  border-left-width: 4px;
  border-left-color: #888;
  border-right-width: 2px;
  border-right-color: #ccc; }

While the above CSS is totally clear, the SASS is just so much quicker to write, edit, and maintain.

If you know Coffee-Script, the code below probably makes sense, but immediately I see so  many benefits and efficiency boosts writing in this language.

list = [1, 2, 3, 4, 5]

square = (x) -> x * x

math =
  root:   Math.sqrt
  square: square
  cube:   (x) -> x * square x

cubes = (math.cube num for num in list)

Which compiles to the Javascript:

list = [1, 2, 3, 4, 5];
square = function(x) {
  return x * x;
};
math = {
  root: Math.sqrt,
  square: square,
  cube: function(x) {
    return x * square(x);
  }
};
cubes = (function() {
  var _i, _len, _results;
  _results = [];
  for (_i = 0, _len = list.length; _i < _len; _i++) {
    num = list[_i];
    _results.push(math.cube(num));
  }
  return _results;
})();

Wow! There’s so much Javascript being created here just by compiling a few lines of Coffee-Script! Imagine having to do all these boilerplate definitions and syntax stuff by hand, and how much time you spend just on that. This is definitely the future for this type of stuff.

Working this into an MVC3 project would totally rock. Imagine a project where you wrote in SASS/Coffee-Script, used MVC3s power to compress/minify CSS/Javascript – you’d have an solution where all you need to do is write the functionality, and compilers and all that take care of syntax, organization, definitions etc, AND compress/minify. When you deploy, the application is efficient, packaged, and optimized, without you having to do any real work.