Thanks to everyone who came out to my session today on developing single page apps in ASP.NET MVC. I've posted the slides and source code in this blog post. Please feel free to contact us if you have any questions.

Building Single Page Apps in ASP.NET MVC (PDF Slides)
Building Single Page Apps in ASP.NET MVC (GitHub Code)

Thanks to everyone who came out to my session today on developing mobile apps in HTML5 and JavaScript with Icenium. I've posted the slides in this blog post. Please feel free to contact us if you have any questions.

Cross-Platform Mobile Apps with HTML5 using Icenium

Thanks to everyone who came out to Rachel and my session today on introducing.NET developers to Objective-C and iOS development. I've posted our slides in this post. Please feel free to contact us if you have any questions.

iOS for .NET Devs Slides

Here's a quick tip to speed up binding a Kendo TreeView to a remote dataset. I noticed this difference while experimenting with different strategies for accessing data for an application that was binding a large dataset to a TreeView. I only wanted the TreeView to read from the remote datasource once all of the parameters had values, so I initially wrote something like this:

We are excited to introduce a new feature in Falafel Tornado: control designers for your HTML5 / JavaScript widgets!! Take a fresh look at the control properties for widget blocks:


There's a lot more going on here than meets the eye. You still select the HTML5 / JavaScript widget to use as before, but what's interesting is that you now get a whole bunch of other selectors. These selectors will feed the property values to your widget block to consume!

For example, say you have an image carousel. It needs an album ID right? That way, it can ...

When creating a new ASP.NET MVC 4 project in Visual Studio, the "Internet Application" template provides a jumpstart for using SimpleMembership and OAuth2 providers.  But you may quickly find that it some providers (Windows Live, Facebook, Twitter) require a redirect or source domain.  Most will not allow you to use a localhost address for this redirect domain which can make testing in a development environment difficult. (Note that OpenID providers, such as Google, do not require a redirect URL and these steps are not necessary to test from a localhost site.)

One solution is to come up with a unique ...

Today I am going to show you how to have your cake, and eat it too.

Sitefinity's layout system is great most of the time, but what if you want to use a custom grid system like Bootstrap along with it, while still using Sitefinity's drag and drop layouts?

Well you can, Sitefinity allows you to add to, or replace their existing classes.

For example if you used the 4 column system, Sitefinity would automatically add classes like below:

If we wanted to use a common 4 column Bootstrap layout, we would use the code below:

 <div class="row-fluid">  
   ...

Writing modern JavaScript typically means using JQuery and the miriad libraries that are built on top of it. If you transition to this new paradigm  from the old one of programming directly against the DOM (document object model) objects, it can be especially confusing.

In this blog post, I'd like to show you some different types of objects you may encounter while doing modern JavaScript development. This will include DOM objects and a couple of modern JS libraries--JQuery and Kendo UI.

The DOM

The Document Object Model (DOM) is a cross-platform convention for interacting with objects in HTML documents. (adapted ...

As I write this, there is a lot of unclear and contradictory information on how to do this. Here is the best way that I've found to do it. The steps below will add SimpleMembership to a WebForms project as well as enable you to use the WebSecurity class in code-behind, without any weirdness such as adding a .cshtml to your WebForms project (which will work but won't let you use WebSecurity anywhere but in that file)

1. Create a brand-new ASP.NET WebForms project

2. Open the Package Manager Console and run this command: install-package Microsoft.AspNet.WebPages.WebData

3. Open web.config

1. Add a connection string ...

I came across this inconvenient inconsistency while implementing a client-side CSV export from a filterable Kendo Grid. In short, when a DataSource is not filtered and/or sorted, the view() method returns an ObservableArray, which has a toJSON() method to convert its contents back to the raw data objects without the ObservableObject wrapper. However, when the DataSource is either filtered or sorted, the view() method returns a standard JavaScript Array of Kendo ObservableObjects. Each individual item in the array has a toJSON() method, but of course the array itself does not. When I asked Telerik support about this, they said that ...

You will probably agree that having 2+ monitors is one of the most productive enhancements you can do to your PC setup. It is not so easy when traveling or if you are embracing the post-PC era. This is why it is vital to have "multiple desktops" instead. This is not a new concept if you are coming from the Mac or Linux world. Why Windows still has not jumped on this is beyond me. Until this light hits them, let me introduce you to Dexpot.

First thing you will notice is a quick view in the taskbar. This ...

Today we are going to create a nice animated hover over to display information over an image.

You can download the source code here.

To start, let's look at the code below:

 <div class="wrapper">  
  <ul>  
   <li>  
    <div class="image-wrapper"> <a href="#"><img src="images/1.jpg" />  
     <h2>Image Title</h2>  
     <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspen</p>  
     </a> </div>  
   </li>  
   <li>  
    <div class="image-wrapper"><a href="#"><img src="images/2.jpg" />  
     <h2>Image Title</h2>  
     <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspen</p>  
     </a></div>  
   </li>  
   <li>  
    <div class="image-wrapper"><a href="#"><img src="images/3.jpg" />  
     <h2>Image Title</h2>  
     ...

How many times has this happened to you: you cut or copy a snippet of code, select where you want it to go, then whoops! you accidentally press ctrl-c instead of ctrl-v and copy a blank line or the selection you meant to replace. This is normally just a mild inconvenience requiring you to go back and copy the snippet again, but sometimes going back to that snippet isn't so easy. Maybe you carelessly cut the snippet and then closed the file so you can't undo it back, or maybe you copied from a remote location that you've been disconnected ...

Cross-browser compatibility can be a major pain. The philosophy for most web developers is to code against a standard-complaint browser (Chrome), then apply CSS hacks later for other browsers that need to play catch up (Internet Explorer). In other words, it is better to make your code forward-compatible and apply backward-compatible hacks instead of the other way around.

One technique for cross-browser compatibility is using conditional comments in the HTML like this:

This works great, but it is very awkward and ...

If you are upgrading your blog site from 3.7 or if you have worked with that version of Sitefinity before, you must be missing the good old-fashioned blog archive control. Believe it or not it is still one of the poorly designed controls in Sitefinity 5.x or 6.x. Hopefully that will change in the future, but meanwhile I created an exact copy of the 3.7 version of that control and made it compatible with the latest Sitefinity 5 or 6
 


And of course, not to forget the (missing) control designer



The code might seem pretty straightforward to you, but ...

This post is an extension of a previous post I wrote on responsive layouts,
you can read that post here.

Today we are going to create a responsive table using unordered lists and divs. I am going to use an example from our site, it is the agenda for FalafelCon 2013.

You can download the source files here.

To start we are going to use an unordered list for the rows:

Then we will use divs inside the lists for the columns:

We want to set the main container width, and then override it for the specific devices ...

To make your JavaScript more manageable, you should have a template engine of choice. I have been using Mustache.js for quite some time and love it. Instead of doing this:


You really should be doing this:


Sure it looks like more lines of code, but throw ...

Last time, I summarized Scott Guthrie's keynote session. This time, I'll summarize some of the following sessions.

Azure Websites - Things they don't teach the kids in school

This talk was actually not so much about Azure Websites as it was about the build system that Azure Websites uses to publish web projects from Git. The product is called "Project Kudu" and is an open-source project available on GitHub. The speaker demonstrated a number of  "power user" features of Kudu:

Streaming the application log to the console

This demo actually didn't work, but this could be immensely useful to assist ...

I recently had the pleasure of attending the global AzureConf 2013 event broadcast live on Microsoft's Channel 9. If you didn't get a chance to attend and don't want to spend the time to watch all of the sessions, I plan to summarize each of them over the next few posts. This is my summary of the keynote address.

Keynote

In the keynote, Scott Guthrie gave an overview of the current state of available Azure services, starting with the infrastructure itself. Windows Azure is flexible, supporting a variety of development languages and client platforms; open, with client SDK ...

Here is a nice little feature that allows you to download a resource by simply adding a download attribute to an a element, as shown below.

In this case, since the download is added, the file will be downloaded instead of navigating to the href.

Keep in mind this only currently works in Chrome, but will hopefully be added to other modern browsers in the near future.