DotNetDevDude

dotnetConf

DotNetDevDude — Mon, 29 Apr 2013 21:24:00 GMT

Last week was the first dotnetconf, a virtual conference put on by Javier Lozano and Scott Hanselman. The event was live streamed via Google Hangout and included a bunch of really cool content. I was given the honor of presenting on test driven development in .NET during the two day conference. If you weren’t able to catch my session live or did make the live event and are looking for the slides and demos the links are below.

Session Recording: http://www.youtube.com/watch?v=_m41mTIPLIE
Slides and Demos: https://github.com/kburnell/TestDriving.NET

This weblog is sponsored by newtelligence AG. Happy fan of

Setting up LESS File Watcher in WebStorm 6

DotNetDevDude — Thu, 28 Mar 2013 13:16:09 GMT

This morning I decided to try out JetBrain’s WebStorm. I am a huge fan of ReSharper and RubyMine and have been hearing some good things about WebStorm so I thought I would give it a try. It’s very early on in that process so I haven’t formed my opinion completely yet but I have a sour taste in my mouth after spending over an hour setting up automatic compilation of LESS in the tool. I was unable to find any documentation on the JetBrain’s site or otherwise on how to do it, so in the hopes of saving at least one person the headache I thought it would be wise to blog it.

Step 1: Find a LESS Compiler

You need to have a less compiler that you can tell the File Watcher to run and compiles the LESS to CSS. Fortunately I have been using LESS for awhile and have had need for the standalone compiler so I knew where to find one - https://github.com/duncansmart/less.js-windows. You can either clone the repo or download and extract the zip.

Step 2: Setup the File Watcher in WebStorm

File –> Settings or Ctrl + Alt + S
Click on File Watchers
If you have a LESS watcher listed double click it otherwise click the green “+” in the upper right and select “LESS”
In the New Watcher window
1. Check “Track only root files”
2. In the “Program” field click the ellipsis(“…”) and select the LESS compiler you downloaded in Step 1. If you used less.js-windows select “lessc.cmd”.
3. In the “Arguments” filed enter $FileName$ $FileNameWithoutExtension$.css
4. Uncheck “Create output file from stdout”
5. Click “OK”…twice

Step 3: Watch it Work

Add a new file…give it the “.less” extension.
Add a style to the new file and you’ll see the corresponding .css file created under the .less file.

Hopefully this helps you out and if I missed something and this process could have been easier let me know.

This weblog is sponsored by newtelligence AG. Happy fan of

Asynchronous Operations Come To Entity Framework 6

DotNetDevDude — Wed, 19 Dec 2012 17:08:48 GMT

At BUILD, during this session by Entity Framework Program Manager Rowan Miller, Entity Framework 6 beta was announced and made publicly available. You can get the Entity Framework 6 beta bits via NuGet. Currently they are only available via the Package Manager Console, more info can be found on the EF NuGet page.

Entity Framework 6 is the first new version of EF since the announcement earlier this year that the product would be Open Sourced. This means that not only is the source available but the builds of EF6 beta are available as soon as the code is checked in. Entity Framework is hosted on CodePlex.

The EF 6 roadmap defines in detail what is currently in the works and what is still on the board as far as features and improvements for EF 6. In this post I want to focus on one new addition to Entity Framework that I find very compelling.

One of the great features introduced in .NET 4.5 was the task-based asynchronous functionality using the async and await keywords. Now with EF 6 comes support for asynchronous querying and saving using the same async and await coding convention. Let’s first look at asynchronous querying.

The following asynchronous extension methods have been implemented for querying your data context and as you’d expect they are the asynchronous versions of their synchronous namesakes:

AllAsync
AnyAsync
AverageAsync
ContainsAsync
CountAsync
FindAsync
FirstAsync
FirstOrDefaultAsync
LoadAsync
LongCountAsync
MaxAsync
MinAsync
SingleAsync
SingleOrDefaultAsync
SumAsync
ToArrayAsync
ToDictionaryAsync
ToListAsync

In the code snippet below you can see an example of using the ForEachAsync method to asynchronously loop through all the manufacturers in my data context and print them to the console.

private static async
Task PrintAllManufacturers() {

    using (DataContext
context = new DataContext()) {

        await context.Manufacturers.ForEachAsync(m => Console.WriteLine("{0}
: {1}", m.Name, m.Country));

Another piece of Entity Framework functionality that the asynchronous goodness has been added too is saving. Below is an example of adding a manufacturer and asynchronously saving the changes.

private static async
Task AddManufacturer(string name, string country)
{

    using (DataContext
context = new DataContext()) {

        context.Manufacturers.Add(new Manufacturer
{Name = name, Country = country});

        await context.SaveChangesAsync();

Using the asynchronous pattern is a great way to provide a more responsive user experience and now loading data asynchronously with Entity Framework has become much easier.

This weblog is sponsored by newtelligence AG. Happy fan of

devLINK 2012

DotNetDevDude — Sat, 01 Sep 2012 23:45:00 GMT

This week I had the pleasure of speaking at devLINK. I did 5 sessions over the 3 day conference and had a blast networking with the other speakers and attendees. Kudos to the devLINK staff on a job well done.

Here are the 5 sessions I did at devLINK 2012 and links to the associated slides and demos.

This weblog is sponsored by newtelligence AG. Happy fan of

2012 Midwest Give Camp - Katharine’s Wish

DotNetDevDude — Thu, 23 Aug 2012 21:22:00 GMT

As most of you know I am very active in the development community and one piece of that is my involvement with the Midwest Give Camp organization. The Midwest Give Camp organization is a small group of dedicated community leaders that plan and carry out yearly Give Camps in the Midwest. This year I had the honor of organizing/leading the Midwest Give Camp. The event was held the weekend leading in to That Conference at the same venue. I wanted to share details on the charity that we worked with and what the Give Campers were able to provide for them.

For the 2012 installment of the Midwest Give Camp we worked with the charity Katharine’s Wish. Katharine’s Wish was founded by Katharine Rhoten of Eau Claire, WI. Katharine’s father Doug is also an active member of the developer community who runs the Chippewa Valley .NET User Group. Doug also happens to be a personal friend of mind.

While on the family’s first trip to Disney World in 2008 Katharine became seriously ill and was rushed to the hospital. The Rhoten family spent 3 long days in the hospital watching Katharine undergo numerous tests, most involving painful prods and pokes. Through all of those procedures Doug and his wife Kristin where amazed at the positive attitude Katharine was able to keep. This was due, in large part, to a small gesture of the hospital staff. Prior to any painful procedure, the hospital staff gave Katharine a small stuffed animal. This always put a smile on Katharine’s face and let her know that it may hurt for a bit but in the end everything was going to be alright. To get an idea of the number of procedures Katharine was subjected to during her stay at the hospital…Doug had to ship 2 boxes of stuffed animals back to WI J

The experience provided two major life-changing events for Katharine. The first was that she was diagnosed with Type I Diabetes and the second that she vowed to “pay it forward” by doing everything she could do to make sure that children in the hospital have the same positive experience she had. Upon returning home Katharine got to work on making this happen by using her allowance, birthday money, and funds from a lucrative lemonade stand to purchase stuffed animals to donate to local hospitals that she donates each year, on the anniversary of her diagnosis, to local hospitals.

Katharine’s Wish has grown to now include multiple drop off locations where the community can drop off stuffed animals and books to be donated. In the five years since her diagnosis, Katharine, with the help of her younger brother Spencer, has donated thousands of stuffed animals and books to the hospitals in her community.

It was an honor to be able to use my skills, along with the skills of 12 other talented geeks, to provide Katharine with a platform to grow her cause. The result of our work is the official Katharine’s Wish web site. The site was coded in MVC 4/HTML5/Kendo UI on the front end and EF Code First/SQL on the back end.

I ask that you please check out http://www.KatharinesWish.org to learn more about this awesome girl and please consider donating to her cause.

This weblog is sponsored by newtelligence AG. Happy fan of

aspConf Sessions Available on Channel 9

DotNetDevDude — Wed, 01 Aug 2012 11:28:16 GMT

Last month I had the awesome opportunity to be part of the aspConf virtual conference. aspConf evolved from the very popular mvcConf, but instead of being focused solely on ASP.NET MVC aspConf is focused on the entire ASP.NET stack of goodness. The great thing about aspConf is that it is a virtual conference allowing for a much broader audience.

I presented two sessions at aspConf:

The aspConf staff also put in the immense effort of editing every session and making them available on Channel 9 for everyone to watch.

If you missed aspConf this year, well you can always watch it on Channel 9, but also make sure you follow them on Twitter and keep on eye on the aspConf site so you don’t miss next year’s event!

This weblog is sponsored by newtelligence AG. Happy fan of

Kendo UI for ASP.NET MVC: Part 3: Creating a Bundle for the Kendo UI Scripts and Content

DotNetDevDude — Fri, 29 Jun 2012 20:38:27 GMT

A great new feature in ASP.NET MVC is the ability to bundle scripts and CSS files and register them as a group. More detail on this functionality can be found here. Because by default all the scripts and CSS classes in a new MVC 4 project are registered using bundles I felt a little dirty in my previous posts referencing my Kendo UI scripts and CSS files each individually. I rectified that.

So I started the rectification process by adding entries to the BundleConfig.cs. In this file is where you create and configure your bundles. Out of the box there are a number of bundles configured so all I needed to was follow the same conventions when creating my bundles.

bundles.Add(new ScriptBundle("~/bundles/kendojs").Include(
            "~/Scripts/jquery.min.js",
            "~/Scripts/kendo.all.min.js"));
 
bundles.Add(new StyleBundle("~/Content/kendocss").Include(
            "~/Content/kendo.common.min.css",
            "~/Content/kendo.default.min.css"));

Obviously I took the least amount of scripts I needed to get my contrived sample created, but you can add whatever scripts you need.

After creating the bundles I need to register or “Render” them as the method is called. Have to admit I am not a fan of “Render” as the method name. In the past “Render” has always had a visual connotation. The registering of the bundles for this example is taking place in the _layout.cs, but you could do the same thing directly in your ASP.NET MVC View.

@Styles.Render([...other CSS bundles], "~/Content/kendocss")
@Scripts.Render([...other Script bundles],"~/bundles/kendojs")

And that’s it. Now I have my Kendo UI scripts and CSS files registered/referenced/rendered using the new bundling features of ASP.NET MVC

Code is available on GitHub.

This weblog is sponsored by newtelligence AG. Happy fan of

Kendo UI for ASP.NET MVC: Part 2–AutoComplete

DotNetDevDude — Mon, 25 Jun 2012 12:37:36 GMT

Note: If you are following along at home you may have noticed that the number of the series posts has changed. I have taken some *poetic license* and decided that the previous post introducing Kendo UI for ASP.NET MVC was actually part part 3 of the original series on Kendo UI in ASP.NET MVC as well as part 1 of a new series on Kendo UI for ASP.NET MVC. Clear as mud, right?

To stay in line, and catch up, with the pre-Kendo UI for ASP.NET MVC series this post is going to show you how to implement the Kendo UI AutoComplete control using the HtmlHelper extension. In case you didn’t catch the original post on implementing the AutoComplete using Kendo UI (core/non-mvc) in ASP.NET MVC, the Kendo UI AutoComplete control is a text box that has an associated list of items that when text is entered into it a suggestion list is displayed allowing the user to select an item.

To get started follow steps 1 - 6 in the previous post to prep a new solution.

Next I created a server side model: Manufacturer.cs

namespace Part2_AutoComplete.Web.Models
{
    public class Manufacturer
    {
        public int Id
{ get; set; }
        public string Name
{ get; set; }
    }
}

As you can see the view the model is a very simple class that contains only an Id and a Name field.

After that I created my view: Index.cshtml

@using Kendo.Mvc.UI
@model IEnumerable<Part2_AutoComplete.Web.Models.Manufacturer>
@{
    ViewBag.Title = "Kendo
UI for ASP.NET MVC: Part 2 - AutoComplete";
}
 
<h2>@ViewBag.Title</h2>
 
@(Html.Kendo().AutoComplete()
    .Name("manufacturerAutoComplete")
    .DataTextField("Name")
    .BindTo(Model)
    .Suggest(true)
    .Filter(FilterType.StartsWith)
    .Placeholder("Manufacturer...")
    .DataSource(source => {
            source.Read(read =>
               {
                        read.Action("GetManufacturers", "Home");
               }).ServerFiltering(true);
    })
)

Lastly we can code our controller: HomeController.cs

namespace Part2_AutoComplete.Web.Controllers
{
 
    public class HomeController
: Controller {
 
        public ActionResult
Index() {
            return View(new List<Manufacturer>
{new Manufacturer {Id = 1, Name = "Aston
Martin"}});
        }
 
        [HttpGet]
        public JsonResult
GetManufacturers() {
            string searchValue
= Request.Params["filter[filters][0][value]"];
            IList<Manufacturer> manufacturers = BuildManufacturersList().Where(x => x.Name.StartsWith(searchValue, StringComparison.InvariantCultureIgnoreCase)).ToList();
            return Json(manufacturers,
JsonRequestBehavior.AllowGet);
        }
 
        private IEnumerable<Manufacturer>
BuildManufacturersList() {
            IList<Manufacturer> manufacturers = new List<Manufacturer>();
            manufacturers.Add(new Manufacturer
{Id = 1, Name = "Aston Martin"});
            manufacturers.Add(new Manufacturer
{Id = 2, Name = "Audi"});
            manufacturers.Add(new Manufacturer
{Id = 3, Name = "Buggati"});
            manufacturers.Add(new Manufacturer
{Id = 4, Name = "BMW"});
            manufacturers.Add(new Manufacturer
{Id = 5, Name = "Chevrolet"});
            manufacturers.Add(new Manufacturer
{Id = 6, Name = "Ferrari"});
            manufacturers.Add(new Manufacturer
{Id = 7, Name = "Ford"});
            manufacturers.Add(new Manufacturer
{Id = 8, Name = "Lamborghini"});
            manufacturers.Add(new Manufacturer
{Id = 9, Name = "Mazda"});
            manufacturers.Add(new Manufacturer
{Id = 10, Name = "McLaren"});
            manufacturers.Add(new Manufacturer
{Id = 11, Name = "Mercedes Benz"});
            manufacturers.Add(new Manufacturer
{Id = 12, Name = "Porsche"});
            return manufacturers;
        }
    }
}

That’s it. Now that we are caught up with the transition to Kendo UI for ASP.NET MVC in the next post we can move on to something fresh and new…and Kendo UI certainly has a lot to offer in that area!

The code is available on GitHub.

This weblog is sponsored by newtelligence AG. Happy fan of

Kendo UI in ASP.NET MVC: Part 3–Introducing Kendo UI for ASP.NET MVC

DotNetDevDude — Tue, 19 Jun 2012 16:15:53 GMT

Back in April I started a series of posts related to using Kendo UI in ASP.NET MVC. Last month the Kendo team released the first beta of Kendo UI for ASP.NET MVC. So, long story short the blog posts on Kendo UI will continue but from this point forward they will move from implementing Kendo UI proper in ASP.NET MVC to using Kendo UI for ASP.NET MVC.

Kendo UI for ASP.NET MVC includes the complete Kendo UI suite (Web, Mobile, DataViz) plus a set .NET wrappers to be used with ASP.NET MVC that leverage exciting features of MVC such as data annotations, editor/display templates and validation. Those of you still using the WebForms view engine are safe, the wrappers work in both the Razor view engine and the WebForms view engine.

To get started download the Kendo UI for ASP.NET MVC bits and install them. The bits include, what I would call, the Kendo UI core features plus all the ASP.NET MVC specific features so there is no need install both Kendo UI and Kendo UI for ASP.NET MVC. If you already have Kendo UI core installed, don’t worry, the installer will adjust accordingly.

Once installed pull up the install location, for me it is “C:\Program Files (x86)\Telerik\Kendo UI for ASP.NET MVC Q2 2012 BETA”, and play around with the example projects by running “\Examples\StartExamples.exe”.

Now…let’s get it up and running in an ASP.NET MVC project.

NOTE: The Kendo UI for ASP.NET MVC documentation states that both MVC 3 and MVC 4 are supported even though the actual Kendo.MVC.dll resides in the “Mvc3” directory.

Create a new ASP.NET MVC 3 or 4 project
Add a reference to: [Kendo UI Directory]\Binaries\Mvc3\Kendo.Mvc.dll
Copy the contents of [Kendo UI Directory]\Scripts to the Scripts folder of your MVC project
Copy the contents of [Kendo UI Directory]\Content to the Content folder of your MVC project

Reference the Kendo UI scripts and and CSS files in your layout page.
*Note: If your using ASP.NET MVC 4 I suggest creating a bundler package

<link rel="stylesheet" href="@Url.Content("~/Content/kendo.common.min.css")">

<link rel="stylesheet" href="@Url.Content("~/Content/kendo.default.min.css")">

<script src="@Url.Content("~/Scripts/jquery.min.js")"></script>

<script src="@Url.Content("~/Scripts/kendo.web.min.js")"></script>

<script src="@Url.Content("~/Scripts/kendo.aspnetmvc.min.js")"></script>

Add a reference to the Kendu.Mvc.UI namespace to the <namespaces> section of the web.config to allow your views to know about the Kendo HTML Helper extensions.
```
<add namespace="Kendo.Mvc.UI"/>
```
Let’s test it out. Open up Index.cshtml and create a Kendo UI control using the new HTML Helpers.
```
@(Html.Kendo().DatePicker().Name("MyTestDatePicker"))
```

As with the previous parts of the series the code is available on GitHub.

This weblog is sponsored by newtelligence AG. Happy fan of

Kendo UI in ASP.NET MVC: Part 2–AutoComplete

DotNetDevDude — Mon, 21 May 2012 20:18:54 GMT

Continuing from my previous post Getting Started with Kendo UI in ASP.NET MVC, let’s dive in to Kendo UI’s AutoComplete control. The Kendo UI AutoComplete control is a text box that has an associated list of items that when text is entered into it a suggestion list is displayed allowing the user to select an item.

To get started I created a blank MVC project and wired up Kendo UI per the instructions in my Getting Started post.

Next I created a server side model: Manufacturer.cs

 1: namespace Part2_AutoComplete.Web.Models
{

2:

 3: public class Manufacturer
{

 4: public int Id
{ get; set; }

 5: public string Name
{ get; set; }

 6: }

 7: }

As you can see the view the model is a very simple class that contains only an Id and a Name field.

After that I created my view: Index.cshtml

 1: @model
Part2_AutoComplete.Web.Models.Manufacturer

 2: @{

 3: ViewBag.Title
= "Getting Started With KendoUI - Part 2: Auto Complete";

 4: }

5:

 6: <script
type="text/javascript">

 7: $(document).ready(function
() {

 8: $("#Name").kendoAutoComplete({

 9: minLength:
1,

 10: dataTextField: "Name",

 11: suggest: true,

 12: filter: "startswith",

 13: dataSource:
{ serverFiltering: true, transport: {read: {url: "/Home/GetManufacturers/",dataType: "json",
type: "POST"}}}

 14: });

 15: });

 16: </script>

17:

 18: <h2>@ViewBag.Title</h2>

19:

 20: @using(Html.BeginForm())
{

 21: <div
id="root">

 22: <div
id="manufacturers">

 23: @Html.HiddenFor(x
=> x.Id)

 24: <label for="input" class="info">Choose
a car manufacturer:</label>

 25: @Html.TextBoxFor(m
=> m.Name)

 26: <div class="hint">Start
typing the name of a car manufacturer <br/>(Aston Martin, Bugatti, Ferrari,
Lamborghini, Porsche) </div>

 27: </div>

 28: </div>

 29: <input
type="submit" value="Send
Back To Server"/>

 30: <h3>@ViewBag.Message</h3>

 31: }

Assuming you are an ASP.NET MVC developer that uses Razor, the majority of the view code above should look familiar. The lines to focus on are 8 – 14, which are the actual implementation of the Kendo UI AutoComplete. Let’s break down the configuration options that I am passing to kendoAutoComplete:

minLength: number of characters to be entered before filtering the data
dataTextField: field in the data source that represents the content of the list items
suggest: controls if the rest of the text for the item that matches is automatically displayed in the text box
filter: type of filtering to apply the data (“startswith”, “contains”, etc.)
dataSource: data that the control is bound to, can either be a JavaScript object or a Kendo UI DataSource

As you can see I am using a Kendo UI DataSource that makes an AJAX call to the GetManufactures method on the Home controller.

That is the complete client side implementation of the Kendo UI AutoComplete. More details on what configuration is available for the AutoComplete can be found here.

Lastly we can code our controller: HomeController.cs

 1: using System;

 2: using System.Collections.Generic;

 3: using System.Linq;

 4: using System.Web.Mvc;

 5: using Part2_AutoComplete.Web.Models;

6:

 7: namespace Part2_AutoComplete.Web.Controllers
{

8:

 9: public class HomeController
: Controller {

10:

 11: [HttpGet]

 12: public ActionResult
Index() {

 13: return View(new Manufacturer{Id
= 1, Name = "Aston Martin"});

 14: }

15:

 16: [HttpPost]

 17: public ActionResult
Index(Manufacturer manufacturer) {

 18: ViewBag.Message
= string.Format("You
selected \"{0}\" and sent it to the server!", manufacturer.Name);

 19: return View();

 20: }

21:

 22: [HttpPost]

 23: public JsonResult
GetManufacturers() {

 24: string searchValue
= Request.Params["filter[filters][0][value]"];

 25: IList<Manufacturer>
manufacturers = BuildManufacturersList()

 26: .Where(x
=> x.Name.StartsWith(searchValue, StringComparison.InvariantCultureIgnoreCase)).ToList();

 27: return Json(manufacturers);

 28: }

29:

 30: private IList<Manufacturer>
BuildManufacturersList() {

 31: IList<Manufacturer>
manufacturers = new List<Manufacturer>();

 32: manufacturers.Add(new Manufacturer
{Id = 1, Name = "Aston Martin"});

 33: manufacturers.Add(new Manufacturer
{Id = 2, Name = "Audi"});

 34: manufacturers.Add(new Manufacturer
{Id = 3, Name = "Buggati"});

 35: manufacturers.Add(new Manufacturer
{Id = 4, Name = "BMW"});

 36: manufacturers.Add(new Manufacturer
{Id = 5, Name = "Chevrolet"});

 37: manufacturers.Add(new Manufacturer
{Id = 6, Name = "Ferrari"});

 38: manufacturers.Add(new Manufacturer
{Id = 7, Name = "Ford"});

 39: manufacturers.Add(new Manufacturer
{Id = 8, Name = "Lamborghini"});

 40: manufacturers.Add(new Manufacturer
{Id = 9, Name = "Mazda"});

 41: manufacturers.Add(new Manufacturer
{Id = 10, Name = "McLaren"});

 42: manufacturers.Add(new Manufacturer
{Id = 11, Name = "Mercedes Benz"});

 43: manufacturers.Add(new Manufacturer
{Id = 12, Name = "Porsche"});

 44: return manufacturers;

 45: }

 46: }

 47: }

The controller code is very straightforward. Notice the GetManufacturers method that starts on line 30, it handles the AJAX request from the client and returns the JSON that is used to build the Kendo UI DataSource that drives that Kendo UI AutoComplete.

The code is available on GitHub.

If you haven’t checked out the recently released GitHub for Windows client, I highly suggest you check it out!

This weblog is sponsored by newtelligence AG. Happy fan of