Tag Archives: Visual Studio

Holy Microsoft, Now Compile

The following is 100% parody of the good-natured Weird Al variety. Much like a good Weird Al song, I couldn’t get it out of my head, so now I’m subjecting you to my foolishness as well.

I offer up my apologies to Catholicism in general. Microsoft, on the other hand, can fend for itself.

 

Hail Microsoft, full of office tools.
Our code is with thee.
Blessed art thou among DEVELOPERS,
and blessed is the fruit of thy IDE: executables.
Holy Microsoft, Mother of C#,
pray for us sinners,
now and at the hour of our broken build.
Compile.

 

Now share this post with 10 people and Bill Gates will donate 99% of his wealth to charity.

Legacy Dependency Kata v2.0

Well, well, well. Look what the samurai dragged in. An updated version of my Legacy Dependency Kata. I’ll have to update the Coding Kata Resources page.

50795_01_kurosawas-classic-seven-samurai-gets-stunning-4k-remaster

I’m not proud to admit that there even was a v1.0 at the moment. Let me explain.

Just over two years ago, I was experimenting with writing katas, presenting at code conventions, and running a coding dojo. It turns out. I wasn’t super fantastic at any of these things. Nevertheless, I wrote a kata, ran it a few times with the kind folks in my dojo, and proceeded to share it with the delightful folks at Utah Code Camp 2014. Reviews were mixed, but overall I felt good about it.

Fast forward to the present. While planning the lunchtime learning schedule for our recent SAFe Program Increment, there was an opening, and I, ever so graciously, decided to run my Legacy Dependency Kata for folks who may not have had the chance to see it before. Upon thoroughly embarrassing myself with some of the crappiest kata slides in existence (slides even I couldn’t completely fathom), I recognized that my life would be forfeit if folks were forced to do the kata again with the same slides the following day.

I dashed to revise the slides and spent many hours on the task. When I presented the kata on the second day, it was a much more successful attempt. I’d go so far as to call it a version 1.7. I spent some more time and enlisted the advice of the ever-gracious and capable Kaleb Pedersen in finalizing v2.0. The source code is still the same. Legacy code problems from 2 years ago are still very similar to what they are today.

coughnounittestabilitycough

I think the new slides do their job. Could this kata still be better? Without a doubt. Please submit your recommendations in the comments or feel free to yell at me on Twitter. I’m sure I deserve it for something.

Without further adieu, I give you Legacy Dependency Kata Version Two.

Seed code is still on GitHub:
https://github.com/KatasForLegacyCode/kCSharp/releases/tag/Step0

Legacy Dependency Killer

As promised, here are the slides for my hands-on coding session at Utah Code Camp. Thanks to everyone who attended the session. I had a lot of fun and I hope you did as well.

Also, the code is on Github: https://github.com/KatasForLegacyCode

I’d love to get it translated into Java, C++, and any other language that would be reasonable. I could probably do either of those myself, given past experience, but it’s been so long I couldn’t guarantee that the code I produced wasn’t legacy as well. If anyone is interested in helping out here I’d be very appreciative.

Hopefully, I’ll be creating other katas for legacy code in C# using other common patterns and publishing them here as well.

SassAndCoffee Is Not A Smutty Romance Novel

SassAndCoffee !=

 Not SassAndCoffee

So what IS SassAndCoffee? From the author’s (Paul Betts) blog post:

SassAndCoffee is a library for ASP.NET (both MVC and old-school WebForms) that adds drop-in support for two new languages: Sass and SCSS, a language that allows you to write reusable, more structured CSS, as well as CoffeeScript, which is a JavaScript dialect that is much more syntactically elegant, but still preserving 100% compatibility with regular JavaScript.

I’ll go into more detail about the features of SassAndCoffee momentarily, but lets start with getting it into your project in Visual Studio.

You could grab the project form GitHub and compile it yourself but the simplest way to include the assemblies needed is through NuGet

SassAndCoffee’s NuGet project also adds some entries in your web.config:

 <system.web>  
     <httpModules>
       <add name="CompilableFileModule" type="SassAndCoffee.AspNet.CompilableFileModule" />
     </httpModules>
 </system.web>

 

<system.webServer>
    <modules runAllManagedModulesForAllRequests="true">
      <remove name="CompilableFileModule" />
      <add name="CompilableFileModule" type="SassAndCoffee.AspNet.CompilableFileModule" />
    </modules>
</system.webServer>

 

Once this is complete, just create a .scss or .coffee extension file in your project and reference it from your HTML as if it were already interpreted as .css or .js respectively. We’ll go into more detail on this.

The main features you get from SassAndCoffee are as follows:

  • Easy setup: No need to install Ruby or node.js or anything else. Everything that is required is included in the NuGet project.
  • Automated compilation: simply add .scss or .coffee files to your project and reference them in HTML as you normally would (as .css or .js files) and SassAndCoffee handles the compilation and output linking at runtime.
  • Automated minification: minify your output files as well as other .js and .css files in your application with a simple naming convention.

Now let’s check out an example with Sass using the file SassAndCoffeeDemo.scss:

@mixin customDivText($size){
    font{
        weight: bold;
        size$size;
    }
    text-align: right;
}
 
div.big{
    @include customDivText(70px);
}

div.bigger{
    @include customDivText(150px);
}

Index.cshtml:

<div class="big">Big</div>
<div class="bigger">BIGGER</div>

_Layout.cshtml:

<link href="@Url.Content("~/Content/Site.css")" rel="stylesheet" 
type="text/css" />

Now our output looks this in the browser:

And SassAndCoffeeDemo.css contains:

 

div.big {
  font-weight: bold;
  font-size: 70px;
  text-align: right; }

div.bigger {
  font-weight: bold;
  font-size: 150px;
  text-align: right; }

Let’s try a “Hello World” in Coffeescipt. I’ll add the following code to a file named SassAndCoffeeDemo.coffee.

helloCoffeeScripters = (name) -> 
alert("Welcome to Coffeescript, "+ name)
 
$ ->
	helloCoffeeScripters ("World")

And refrence it in my _Layout.cshtml master page:

<script src="@Url.Content("~/Scripts/SassAndCoffeeDemo.js")" 
                        type="text/javascript"></script>

When we run our app we should see the following:

When we view the source of our .js file we see that the Coffeescript compiler has emitter the following javascript:

var helloCoffeeScripters;
helloCoffeeScripters = function(name) {
  return alert("Welcome to Coffeescript, " + name);
};
$(function() {
  return helloCoffeeScripters("World");
});

Now lets consider the other SassAndCoffee feature that tends to get overlooked, Minification. If we change the Coffeescript file name in our _Layout.cshtml file to include “.min” like so:

<script src="@Url.Content("~/Scripts/SassAndCoffeeDemo.min.js")" 
type="text/javascript"></script>

Then when we compile and view the source of our file we will see:

var helloCoffeeScripters;helloCoffeeScripters=function(a){return alert("Welcome to Coffeescript, "+a)},$(function(){return helloCoffeeScripters("World")})

The beauty of SassAndCoffee is in the amount of attention that you DON’T have to pay to it. It just works! Import the NuGet project and you can get to the business of learning how to use Sass and Coffeescript right away.

Refrences:
https://github.com/xpaulbettsx/SassAndCoffee
http://nuget.org/List/Packages/SassAndCoffee
http://sass-lang.com/
http://jashkenas.github.com/coffee-script/

Thanks to @alamocoders for letting me present this topic at their last .NET meeting. I had a blast. Here are the materials from the presentation if anyone is interested. It includes the source code and my slide deck.
http://dubmun.com/projects/SassAndCoffeeDemo.zip