Canadian Web Developers' Blog

All the topics you like in one place

Frédéric Harper — Fri, 20 Apr 2012 16:14:00 GMT

If you read this, it’s because you follow this blog for one way or another. In the spirit of simplification, we will merge our MSDN blogs in one place.

That means, that all blog posts that was done and that will be done on topics for Web developers, Mobile developers and solution developers will all be transferred to the general developer one. This will be your one-stop for all development topics going from Web, mobile, cloud and more! We’ll add soon a way for you to easily filter by the topics that interest you, but if you are like me, you’ll love to hear from all topics as even if you have an expertise, it’s critical in our jobs to know what’s happening in another sphere of the IT world.

Enjoy your read, and see you on the Developer Connection Blog. Oh, and for those of you that understand French, follow our French Developer Connection blog: there are some translations, but mostly unique topic for these readers!

Top 10 resources for HTML5 developers

Frédéric Harper — Mon, 19 Mar 2012 19:49:00 GMT

If you tell me you never heard about HTML5, I won’t believe you. It’s everywhere and we like this! As an HTML5 enthusiast, I had to learn this new version of HTML. Like you I had to search the Web, find good resources and sometimes, bad websites that just make me loose my times. I think that a list of my top 10 best resources for HTML5 developers could help shorter the time you’ll take to learn this awesome technology.

Dive into HTML5 by Mark Pilgrim
From all the resources I saw, this online book from Mark Pilgrim is still one of my best resources to learn the basics of HTML5.
HTML5 and CSS3 techniques you can use today
Sometimes videos are a better way to learn. At TechDays 2011, we had some awesome speakers and some of them talked about HTML5 and CSS3 techniques that you can use today. It’s a great way to have a quick one hour overview of what you can build in your next awesome website or Web application.
Application development with HTML5
I love videos and another great presentation we had at TechDays last year was about HTML5. It’s an introduction of the new version of HTML in a simple way for Web developers. Chris and Nathaniel did a great job by presenting on this topic and I hope you’ll like it as much and they had fun to present it.
HTML5 Center by Sourceforge & Microsoft
This is a blog made by some coworker in the U.S. in collaboration with Sourceforge. It’s a great blog with interesting subjects like adoption strategy, canvas, mobility, SVG and more.
HTML5 for Web Designers on A Book Apart
Some people prefer books, so it’s why I added this awesome book on the list. Even if the title said for Web Designers, it’s a good start to learn the most powerful HTML specification ever written.
IE Test Drive
This site is not only about Internet Explorer: it contains a lot of awesome demos to see what HTML5 is capable of. One part of learning is also to look at the source code of cool demonstrations.
HTML5 & Friends by Mozilla
We believe that HTML5 is all about working together. It’s a Web standard and everyone that is doing great stuff with this technology is our friend. Mozilla also did a great job to put a simple documentation for developers that have interest to learn the new elements and features of HTML5.
HTML5 W3C specification
I wasn’t sure if I was going to put the specification on this list. It’s probably the best resource out there since it’s the specification of this standard, but is it really the best place to look? It’s more than 900 pages and not easy to read, but some people want the real stuff, so here it is!
When can I use and Modernizr
I cheat, these are not resources that will help you to learn HTML5, but they will certainly help you put the 5 in HTML. The first one, When can I use, is all about helping you know which features of HTML5 are supported in which browsers. Really helpful has the specification is not final yet. The other one, Modernizr, is a free Open Source library that will help you do features detections in your code. NO, I don’t talk about browser version detection… don’t do that! Also, they have a great list of polyfills that will help you support older browsers. You won’t be able to live without these two…
Cut the rope
What? This is not a resource? I explained to my boss that if I want to be able to showcase how HTML5 is awesome, I need to test some of the most overwhelming examples on the Web. Only for professional purpose!

Trust me, this is the point of the iceberg, There are so many resources on HTML5 on the Web, that I would be able to make the "Top 100 resources for HTML5 developers" blog post. I hope these resources will help you get started or give you a good start to take your expertise to the next level. Did you have any “I can’t believe you didn’t put it on your top 10" resources? Share your secret weapon!

P.S.: For those who wants to know who is the guy in the picture, it’s Christian Heilmann, a Developer Evangelist from Mozilla, with an Internet Explorer 9 “I have standard” T-shirt. I thought it could be funny to use this image for this blog post.

The eradication of Internet Explorer 6 off the planet

Frédéric Harper — Tue, 06 Mar 2012 18:56:00 GMT

I know, you still hear about Internet Explorer 6. This browser was born 10 years ago and some people still use it. We really think it’s time for us to say goodbye to this old version of our browser.

To help us track the usage of IE6, we created a website you probably see a couple of times: IE6 countdown. It tracks the usage of this version of the browser everywhere in the world. If you are a fan of Web standard like myself, you probably want the usage go under the actual 7.1%. Actually, 0% would be awesome!

There are three ways you can help us, and help Web developers, to get Internet Explorer 6 eradication:

Ask your customer to upgrade
If you have a website or a Web application, you can add a tiny piece of code to your website to notify your customer to upgrade to the latest version of the browser. It’s easy to add and it won’t stop your visitors using your site. You can grab the code here. If you want to be more aggressive, you can create your own code to force people to upgrade.
Educate others
It’s not just about ourselves: we need to educate others. Think about your coworker, who are still supporting this version. You need to also think about non technical ones. Vendors that propose to your customer the support. Your father that didn’t upgrade to a newer version. Everybody that use or support IE6 need to know that they are using a browser that is not supported by us anymore, but also, that is more than 10 years old.
Share this blog post or the IE6 Countdown website
Sharing this blog post or the website is a good idea to educate others. Use your social media and share them on Twitter, Facebook, LinkedIn or Google+. The more we will inform people, the less we will have to take care of IE6.

So, will you help us eradicate Internet Explorer 6 off the planet? I mean, of the universe!?

Awesome tools you can use to build your next HTML5 website or application

Frédéric Harper — Tue, 21 Feb 2012 16:00:00 GMT

Even if the actual version of HTML as been discussed for a couple of years now, it is fairly new. We see a lot more enthusiasts around this new version of this Web standard, and trust me; it's just a beginning. If you have already started to give a closer look to the new features and elements, you probably asked yourself where are the tools to help you build your next amazing HTML5 website or application?

We are starting to see more and more IDE (Integrated Development Environment) adding HTML5 support to their existing tool. When we talked about support of HTML5, most of the time we talked about syntax helper. You don’t have to always remember all elements from a programming language so these tools will help you create your code easily. As the usage of HTML5 is growing considerably, we will see soon more IDEs that will help us create the UI without coding. Let me introduce you some of them, that you may or may not know:

WebMatrix

WebMatrix is my IDE of choice when I do HTML5. It’s a simple free tool that let you code some HTML5 magic with some IntelliSense help. The IntelliSense will help me find the right element I was trying to use, but also close the tag for me. Even if you are a HTML5 pro, sometimes your memory needs some help. What is great with this tool too is that I can easily publish, direct from the interface, to my FTP account: no need of a thirs party application.

Expression Web

If you are looking forward to use something with UI preview, Expression Web in the next tool in my Web developer weapon list. It’s a great software that also has IntelliSense for HTML5 and CSS3, but it let you preview directly in the tools your masterpiece with the SuperPreview feature. It’s not just about Internet Explorer 9; you can see the rendering of your website on other browsers like Firefox, Chrome and Safari. You can try it for free.

Visual Studio

If you are a .NET developer, you already know this tool, so it’s easier for you to use a tool you already know. You can choose between more than one version, but we also have a free version for you: Visual Web Developer 2010 Express. With this tool, you can easily build your HTML5 website or application with all the benefits of this amazing software. If you already use another Visual Studio version, you can also install the Web Standards Update for Microsoft Visual Studio 2010 SP1 that adds CSS3 support and updates the HTML5 IntelliSense and validation, including new JavaScript API's.

Notepad

I’m serious. You can even use Notepad. In fact, you can use any text editor as HTML5 is a markup language, so you don’t need any compiler. The applications I showed you before are there to help you code more quickly and easily, but you have the freedom to use anything you want!

I know there are more tools available on the Web, but I wanted to introduce you to the tools we have at Microsoft. I really think that we are doing great stuff with this three IDEs, but let me tell you something that is not a secret: these tools will get better and better with their new releases, so keep on eyes on them! Did you use WebMatrix, Expression Design or Visual Studio for your HTML5 needs? What is your IDE, Microsoft or not, of choice? Share your thoughts!

What the heck is Responsive Web Design?

Frédéric Harper — Wed, 15 Feb 2012 19:31:00 GMT

As a Web developer, we need to think about many devices, screen sizes and orientations. It’s not enough now to build our application or website to target only desktop screens: you need to keep in mind that your visitors will come to your site with their smartphones, their netbooks, their tablets, their slates and even their living room TV. We need to give them a good experience.

Instead of creating a specific version for the most common screen resolution or for specific mobile experience, Responsive Web Design is all about creating an experience that will keep in mind the user’s needs instead of ours. Flexibility is the keyword as we adapt to various devices' capabilities, instead of configurations.

How many times did you tried to see a website that is not mobile-friendly? Everything is too big for the size of the screen. You have to zoom-in, zoom-out, and it’s very frustrating. With a fixed-width design, the owner will have to create a version for each device that their customers use.

So what is really this Responsive Design thing? It’s base on three technical aspects:

Media queries
A flexible grid-based layout
Flexible images and media

Media Queries

Media queries are like having if statement in your CSS. You can define which CSS stylesheet will be loaded depending on different criteria, like the size of the screen. Everything is managed by the browser and there is no need to do like we did in the past with some JavaScript and page reloading. Here are some examples:

<link href="mobile.css" rel="stylesheet" media="screen and (max-width:480px)“ type="text/css" />

(max-width: 1024px)“ type="text/css" />

<link href="laptop.css" rel="stylesheet" media="screen and (min-width:1025px)“ type="text/css" />

A flexible grid-bases layout

Everybody loves pixels. We used pixels for a long time in the Web, and Designer loves them too. The problem is that the screen representation of a pixel is different on every device or screens. The answers in using a flexible grid-bases layout reside in percentage or em for sizing. The idea is to use relative size for text, width and margins.

Flexible images and media

The last part, but not the less important is about your media. The images and videos needs to be flexible too. It’s a basic principle that allows you to scale or shrink your media with CSS. You can also use a technique with alternate version of the media or sometimes, when it makes sense, no media at all.

If you want to see Responsive Web Design in action, you can go to http://mediaqueri.es/ that list some great examples. Use your smarthphone, your tablet or resize your desktop Web browser: you will see the magic of Responsive Web Design. This blog post is a good start to understand the idea behind it, but if you have an interest in this topic, I will be more than happy to make other blog posts to dive deeper into the subject. For those of you that can’t wait, one of the best book out there is the one from A Book Apart. Oh and if you are in Montreal, I’ll do a presentation on Responsive Web Design (in French) at HTML5mtl next week.

Do you think Responsive Web Design is the way to go? Do you already use it? Did you see amazing implementation of this technique on the Web? Share your thoughts.

Creative Commons image: http://www.flickr.com/photos/adactio/5818096043/

How to get up to speed with a new technology

Frédéric Harper — Sun, 12 Feb 2012 16:22:00 GMT

You are in front of your computer, wanting to learn a new technology for your job, or because you have this awesome idea on what will be the next Angry Birds. Whether you are a professional, a student or a hobbyist, learning a technology is sometimes a challenge. Where to start? In this blog post, I will give you my tips around getting up to speed with a new technology.

Before your start

If you are not limited to a specific technology, like someone who has to learn the next programming language for their work, you may ask yourself, which one fit the best my needs. A good way to see what the industry is using or what is the thoughts about this new HTML5 thing you saw on the Web last day, online community is the best place to start. I go often to a place call Stack Overflow. It’s really a good place for technical and sometimes, more high level discussion/questions. You can also go to places like LinkedIn.

I know which programming language I want to learn

Now you know what you want to learn. Personaly, I'm still a fan of book, or in a digital world, eBook. You can buy great books on site like Amazon or directly from the publisher like O’reilly or Microsoft Press. You can also go on a site like the MSDN blog to find great resources. If you are ready to invest some money, you can use website like Lynda.com that gives you a lot of tutorial for a monthly fee. Furthermore, never underestimate good music for the learning process!

I want to go further

If you want to learn more, you can also go to conference or users group. There are so many conferences about technology that you have plenty of choices. Just in the top of my head for the next month, I can suggest you PrairieDevCon for Calgary people, Confoo for Montreal people or Le Web à Québec for French people. OK, I know more conferences from Quebec since I’m living there, but search the Web, and you will find a lot more. Don’t forget user groups: there are so many that offer top quality presentation for free or a minimal fee. Here is a list to start.

Prove your knowledge

What happening after I learn the technology? For sure, you will use it for the project or the work you had in mind, but there are more ways to test your competencies. You can take a certification exam or participate in some competitions, hackfests or even take advantage of things like the Developer Movement. A great way to build your next idea, have some fun, be creative, win some prize and for sure, validate your learning process.

It’s not a big step by step process, but these are my tricks to get up to speed with a new technology, what are yours? How do you start the learning process?

Image Creative Commons: http://www.flickr.com/photos/jitze1942/4292084185/

Javascript and CSS Minifying/Bundling with the Microsoft.Web.Optimization Nuget package

Frédéric Harper — Fri, 20 Jan 2012 18:59:00 GMT

This blog post is a guest post from Maxime Rouiller. If you want to make blog post about Web technology, please contact me at fredh@microsoft.com.

Maxime Rouiller is a passionate .NET technology specialist and ASP.NET MVP, working for 8 years in large software development, advocating Agile and TDD. Aware of the latest technological trends, he intervenes as a specialist in the .NET Montreal usergroup and acts regularly as a speaker for Web Form programmers on the MVC platform.

So I’ve been wanting to write about this since the build and only gotten around to do it now.

When you write C# code, you rather have multiple small files with clear separation of concerns. This allows you to have small and clear classes, and the compiler will never complain about it. However, in Javascript, you want to have smaller files. Most of the time in the .NET environment, there wasn’t any integrated way of doing so. Either it required an EXE call or outputing .min.js files.

This caused problems as we had to alter our Development version of our HTML to fit our Production environment. Microsoft released this tid bit early because it’s probably going to be integrated in the .NET 4.5 framework but is making it available to us now.

Please be aware that “Microsoft.*” DLLs are not part of the official framework and when they do, they will probably be changed namespace to “System.*”.

Pre-requisites

First, you will need NuGet to install the following packages:

Microsoft.Web.Optimization
WebActivator

How it works

Now, the way the JS/CSS minifying works is that it will dynamically inspect all your files, read them, minify them and then cache the result to be served later. This allows us to modify our files and have all the files re-minified. When one of our JS/CSS files get modified again, this process will restart until either the cache expires or a file change.

Setting up the base work

For the minify-er to work, it will require the registration of a HttpModule. It’s not already included in the Microsoft.Web.Optimization package, but it will be necessary for us to add it if we want it to work.

using Microsoft.Web.Infrastructure.DynamicModuleHelper;

using Microsoft.Web.Optimization;

using MvcBackbonePrototype.Bundle;

[assembly: WebActivator.PreApplicationStartMethod(typeof(MvcBackbonePrototype.AppStart.BundleAppStart), "Start")]

namespace MvcBackbonePrototype.AppStart

    public static class BundleAppStart

        public static void Start()

            DynamicModuleUtility.RegisterModule(typeof(BundleModule));

            RegisterFolders();

        private static void RegisterFolders()

            // configure Microsoft.Web.Optimization

The previous code will do the following, when your application start, it will register a dynamic HttpModule.

Now that the base work is done, we’ll jump right ahead to the configuration of the folders.

Configuring the package

Now that the HttpModule is properly registered, we need to tell the Module when to activate itself. In my specific scenario, I wanted to have jQuery, underscore.js and Backbone.js in that specific order.

By default, the Module will load most core frameworks first (jQuery, MooTools, prototype, scriptaculous) and then load the rest of the files that doesn’t match the wildcards after. The filters are done so that jQuery plugins will load after the jQuery core library, and jQuery UI will load after jQuery.

However, there is nothing done for underscore.js and Backbone.js.

private static void RegisterFolders()

    var js = new DynamicFolderBundle("js", typeof(JsMinify), "*.js", false);

    BundleTable.Bundles.Add(js);

The previous code correctly configures the module to minify all files in a folder by just adding the suffix “js” to the folder (eg.: /Scripts/js).

However, it will register the other modules in alphabetical order rather than the proper order.

Let’s fix that.

Custom Orderer

public class BackboneOrderer : DefaultBundleOrderer

    public override IEnumerable<FileInfo> OrderFiles(BundleContext context, IEnumerable<FileInfo> files)

        context.BundleCollection.AddDefaultFileOrderings();

        var backboneOrdering = new BundleFileSetOrdering("backbone");

        backboneOrdering.Files.Add("underscore.*");

        backboneOrdering.Files.Add("backbone.*");

        context.BundleCollection.FileSetOrderList.Add(backboneOrdering);

        return base.OrderFiles(context, files);

We first inherit from the default order. Then, we add the default file ordering, which will take care of the jQuery ordering for us. Then, we add the other files that we require to the list. The only thing left is to alter our RegisterFolders method to fix that.

private static void RegisterFolders()

    var js = new DynamicFolderBundle("js", typeof(JsMinify), "*.js", false);

    js.Orderer = new BackboneOrderer();

    BundleTable.Bundles.Add(js);

That’s it. We are nearly done!

Modifying your _Layout.cshtml / masterpage

My masterpage head section first looked a lot like this:

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

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

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

This was of course replaced by the following:

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

And that’s all! All your files will be minimized, bundled and properly cached.

Bonus

If you want to have your URLs with a “version number” on it, I suggest that you use the following methods to resolve your URLs instead of the MVC way:

<script src="@Microsoft.Web.Optimization.BundleTable.Bundles.ResolveBundleUrl("~/Scripts/Framework/js", true)"></script>

Learn HTML5 at Confoo

Frédéric Harper — Fri, 13 Jan 2012 15:44:00 GMT

Ever wanted to learn more about HTML5, CSS3 and JavaScript? You want to discover what you can accomplish with this new technology, but you don’t know where to start? Do you struggle to find some time to sit down and become a HTML5 ninja?

If you say yes to one of those questions, I have good news for you: Confoo is doing another HTML5 training this year. The ConFoo HTML5 training session will be the ideal place to learn about these technologies during two full days. The web converges towards HTML5 for Web application, Website and now, mobile application too. It is critical to know what are the advantages, the actual limitations and the possibilities offered by this technology.

The training will be held on February 27-28 at the Hilton Montreal Bonaventure hotel by expert of the industry. Note that the training will be in French, but the trainers understands English. The numbers of seats are limited to 16, so hurry up. For more information and register for the training, go to the Confoo website http://confoo.ca/en/2012/session/html5 .

See you there and be ready for an awesome training!

We’ll be right back after this break…

Frédéric Harper — Tue, 29 Nov 2011 18:52:31 GMT

Thanks Pierre for this post…

Hello folks,

Today started very very early, we were leaving the hotel for the conference center a 5:30am… yes, 5:30am. however we had a great view from the hotel window.

we were onsite at the Montreal Palais des Congres, to put the finishing touches on our Keynote presentation. This morning, we tried something a little different. we put together something a little special. not the usual keynote. We put together a role playing experiment with our stars. Our local Microsoft Regional Director, Guy Barrette, our local developer evangelist Frederic Harper, and Rick Claus our IT pro evangelist.

We lived through a simulation of a real world IT problems that a lot of enterprises are facing these days. Old ASP.Net applications, obsolete servers, misconceptions about cloud computing to name a few…

The formula was very well received by the attendees since it provided real, to the point answers and live demos of the Microsoft Azure capabilities from the IT pro perspective, the developer perspective and the solution architect perspective.

TechDays 2011 Montreal is off to a great start. Great attendees, fantastic speakers, awesome content and extraordinary partners.

you can see all the pictures as we upload them on our Flickr group. http://www.flickr.com/groups/techdays/pool

Cheers!!

Is your browser secure?

Frédéric Harper — Sun, 27 Nov 2011 18:04:00 GMT

Choosing a browser is also a choice around security. Most of what we do on the computer today is in the browser: we read some news site, learn a new technology, chat with our friends, watch funny videos… As a big part of our online life in inside the browser, we need one that will protect us, protect our computer and our data.

When you look at the security of your browser, you need to give a closer look to three types of threats:

Attacks on you (socially engineered attacks)
Attacks on your computer, web browser, or add-ons to your web browser.
Attacks on websites (for example, cross-site scripting)

How can I know if my browser is secure?

Here are some questions you need to ask yourself when you choose your browser:

Does the browser have a feature that can help protect you from phishing sites?
Does the browser benefit from Windows Operating System features that randomize the memory layout to make it harder for attackers to find their target?
Does the browser have the ability to restrict an extension or a plugin on a per site basis?
Does the browser process utilize Windows Protected Mode or implement a similar mechanism such that browser processes cannot modify parts of the system that it doesn’t have access to?
Does the browser extend the sandbox such that it cannot read data from parts of the system that it doesn’t have access to?
Does the browser benefit from Windows Operating System features that protect against arbitrary data execution?
Does the browser have a system for auto updating browser extensions?
Does the browser benefit from Windows Operating System features that protect against structured exception handling overwrite attacks?
Does the browser automatically block insecure content from secure (HTTPs) pages?
Does the browser filter out scripts on the client to help protect against XSS attacks?
Does the browser implement content security policy that websites can use to mitigate XSS and CSRF attacks?
Can the browser sanitize HTML to remove potentially problematic code?
Does the browser have features that websites can use to help protect you from "click jacking" attacks?

I don’t want to think about all of this, can you just tell me if Internet Explorer 9 is secure?

I know. These are a lot of questions to ask, and if you are not a security expert of don’t know everything on the list, it’s a lot to check. There are five important things that I can tell you about Internet Explorer 9 that give me an entire trust level about this awesome and secure browser:

Provides a better warning system for potentially dangerous downloads. A new feature, Application Reputation, helps you to make safer decisions when you download content from the Internet.
Filters content that might be dangerous. The ActiveX Filtering feature allows you to choose which websites can run ActiveX controls. By allowing ActiveX controls only on the sites you trust, you can reduce the number of ways cybercriminals can harm you.
Helps you avoid phishing scams and malware. SmartScreen Filter in Internet Explorer 9 helps protect you from websites that are suspected of hosting malicious content. When the SmartScreen Filter detects that a site may be unsafe, you will see an alert that will give you recommended actions.
Protects your privacy from online tracking. Many websites use technology that tracks your activities as you browse the Internet. Internet Explorer 9 introduces Tracking Protection, a feature that helps to protect your privacy from third-party online trackers.
Helps protect against cross-site scripting attacks. Cybercriminals look for vulnerabilities in website code so that they can insert malicious scripts which gather private information about site visitors.

So what can I do to stay safer online?

Use secured connections: make sure you are opening secured connections to the pages; you do this by typing in "HTTPS" at the beginning of a URL. Most of the websites that ask you important information should use this protocol. If not, think about it.
Use your best judgment: When you read email or surf the Internet, you should be wary of scams that try to steal your personal information (identity theft), your money, or both. Many of these scams are known as "phishing scams" because they "fish" for your information. More information here.
Be sure to have the latest update for your operating system. Update your Windows machine here.
Download a modern browser like Internet Explorer 9 here.

Do you have any tips and tricks for browsing safely? Share them with us!

TechDays 2011–Keynote for Montreal

Frédéric Harper — Fri, 25 Nov 2011 21:46:38 GMT

Each big conference attendee who’s signed up for conferences is looking for a Keynote. TechDays Montreal is no exception. After batting around a number of ideas over the last while, the team decided that it would be a GREAT idea to find a local superstar and personality who is well versed in Microsoft technologies to present – ALSO who’s a native of Montreal!

It’s with great pleasure that we can announce that local expert Guy Barrette has agreed to keynote in Montreal!!! He’s a well known developer personality in Montreal who is very active in the local community and has been doing so for a number of years. He’s been the fearless leader of the .NET Community of Montreal for 15 years running and is a well skilled presenter. He’s currently the Regional Director for the greater region of Montreal and is an MVP in Windows Azure. If that wasn’t enough to keep him busy – he’s a host of the Visual Studio Talk Show as well as expert consultant and architect on all things .NET.

But we’re also MIXING THINGS UP a bit. It won’t just be Guy on stage – we’re going to have Myself (Rick) and Frédéric Harper also co-presenting the keynote to get all sorts of perspectives for Developers, Architects AND INFRASTRUCTURE professionals – something for everyone. I don’t want to talk more about it just yet – it would give too much away, so we’ll leave it at that.

If you haven’t yet bought your tickets, HURRY UP – it’s next Tuesday! If you can’t be there in person – the Keynote will be streamed live on the TechDays site. Add it to your agenda so you don’t forget!

Techdays Montreal 2011–Something New, Hands On Labs!

Frédéric Harper — Thu, 24 Nov 2011 18:56:00 GMT

Yes – you can have this feeling of accomplishment these two guys are feeling when we took this picture. Do you want to have that feeling of fulfillment and spontaneous celebration like these two dudes? You can get it after you take the leap of faith and attend one of our Hands On Labs at TechDays Montreal in order to know that you have maximized your time and experience at TechDays!

As we try to improve upon what we have done in the past in order to make a better experience – we added Hands On Labs to the schedule – denoted with an ILL in the session code. These sessions are delivered by the same experts who are delivering the technical sessions. There is at least one Hands On Lab per content area – focusing on current or soon to be released technologies you can walk away with today.

You will have the opportunity to go through one of 9 labs while you are attending the conference. At the start of the session, the instructor / expert will review the different steps, concepts and tasks required to complete the lab. You will then have your turn while they (along with the proctors) can assist you if you have issues. This gives you the most flexible time to complete each lab in the allocated time while understanding all the important concepts.

Oh yeah – this is a BRING YOUR OWN COMPUTER/LAPTOP event. There will be instructions on how to connect up to the network and launch each virtual hands on lab using your own computer. Minimal configuration is Windows Vista SP1, wireless network card, Internet Explorer 7 or higher and a resolution minimum of 1280 x 800. We will supply the internet connection for the lab as well as a desk and power connections. There WILL be a LIMITED NUMBER of computers that are setup in the room – first come first served – for those of you who do not have laptops – but their numbers are limited.

Note: manuals and instructors are English for the hands on lab. There are bilingual proctors to assist as well as bilingual slides and simultaneous english/french translation services in the room.

Here are the different Hands On Labs available:

ARCILL201 Introduction to Test Planning with Microsoft Test Manager 2010
In this lab, you will learn how to create and configure a new Test Plan in Microsoft Test Manager 2010. This test plan can be used, for instance, to test the new release of your software. Next, you will learn how to add test suites and existing test cases to a test plan and finally, you will learn how to create a new requirement and add that requirement to your test plan. You will also learn how to create a new test case for the new requirement.

CLDILL200 Introduction to Windows Azure
In this hands-on lab, you will explore the basic elements of a Windows Azure service by creating a simple GuestBook application that demonstrates many features of the Windows Azure platform, including web and worker roles, blob storage, table storage, and queues.

DATILL301 Bare Metal Business Intelligence
In this Hands-On Lab you will configure the integration of SQL Server Reporting Services in Sharepoint 2010 by enabling Reporting Services and configuring a Report Library. Next you will configure SharePoint 2010 for PowerPivot and test the PowerPivot Client in Excel 2010. Finally you will configure PerformancePoint and enable a Business Intelligence Center.

DATILL402 Bare Metal Mission Critical
This lab discusses the various options available in SQL Server 2008 R2 database mirroring configurations and demonstrates how to configure and maintain a database mirroring solution. By the end of this lab, you will understand:

The benefits of database mirroring.
How to configure database mirroring in high-performance mode.
How to configure database mirroring in high-availability mode.
How to manage database mirroring configurations

DEVILL301 Building a LightSwitch Control Extension
In this Hands-on Lab you will be walked through the creation of a LightSwitch custom control. This control will be used to display an address in a Silverlight BingMap control. Through this process you will learn the solution structure that is required to create LightSwitch extensions, the various interfaces that should be implemented to make the custom control similar to a native control, and how to package this extension as a VSIX installer.

MGTILL305 Getting Started with System Center Orchestrator
The objective of this lab is to provide a basic overview of the Orchestrator architecture and functionality, and an introduction to the process of creating and running runbooks.

By the end of this lab you will:

Understand the basic Orchestrator architecture
Be able to build, test, and monitor simple runbooks

VIRILL300 Getting Started with System Center Virtual Machine Manage 2012
In this lab, you will explore System Center Virtual Machine Manager (SCVMM) 2012 Beta. This lab is designed to walk you through a configured VMM infrastructure to help you understand the new concepts, terms, UI elements, and configuration tasks. You will accomplish this by exploring the three key elements: Clouds and Services, Fabrics, and the Library. Clouds and Services are collections of virtual workloads which provide services on slices of infrastructure. The fabric is a collection of hardware based resources including virtualization hosts, storage, and network devices which provide the physical implementation of clouds and services. The library is a collection of predefined objects which are the building blocks for clouds and services

VIRILL301 iSCSI Software Target 3.3 - Enabling Hyper-V Storage on Windows Server 2008 R2
This lab will help you learn how Windows Server 2008 R2 provides economical, highly-available storage that can scale to meet any business requirements. The exercises in this lab include:

Exercise 1: Managing iSCSI LUNs. In this exercise you will learn how to manage iSCSI LUNs in the Microsoft iSCSI Software Target. You will learn how to manage iSCSI LUNs using the Microsoft iSCSI Software Target console and Windows PowerShell™ cmdlets.

Exercise 2: Using iSCSI LUNs with Virtual Machines. In this exercise you will learn how to connect virtual machines to iSCSI LUNs using three different methods. You will use the Microsoft iSCSI Software Initiator to connect to the iSCSI LUNs you created in the previous exercise.

Exercise 3: Booting Virtual Machines from iSCSI LUNs. In this exercise you will learn how to boot diskless virtual machines directly from iSCSI LUNs. You will use a network boot program to connect to an iSCSI LUN and initiate the boot process for Windows Server 2008 R2 from the iSCSI LUN.

Exercise 4: Deploying a Highly-Available Microsoft iSCSI Software Target. In this exercise you will learn how to make the Microsoft iSCSI Software Target highly-available using Windows Failover Clustering in Windows Server 2008 R2. You will observe how an iSCSI LUN can be accessed continuously without interrupting a script running in the active cluster node.

WINILL201 Using SketchFlow for Windows Phone
In this lab you discover principles of good UX design. You also discover how to start and build your prototype using the SketchFlow Template for Windows Phone. Along the way, you find out how to add sample data, and customize the look and feel of your data. You also find out how to add interactivity with objects that you create right in Expression Blend, or that are imported from other sources, such as Adobe Illustrator.

I you don’t have the time to try or finish off one of these Hands On Labs – don’t worry. They will ALL be available ONLINE from the Techdays.ca website once it switches over to our new “TechDays Online” site. That being said – the HOL opportunity at Techdays is not one to be missed – you get the experts in the room and the dedicated time to focus on the tasks at hand.

TechDays 2011 Montreal – Build your personalized Schedule

Frédéric Harper — Wed, 23 Nov 2011 18:58:00 GMT

After having the pleasure of talking about technology and connecting with people in Toronto and Vancouver – it’s now Montreal’s turn. Techdays Montreal is coming quickly and the whole team is giving 200% effort to finish things up with a Bang.

This year – lots of diverse sessions are on hand to choose from. If you are interested in Agile, Cloud Computing, Application Testing with Visual Studio, HTML5 or Mobility and consumerization of IT – everything is here for you. Yes – there are even 3 tracks dedicated to Infrastructure, Virtualization, management and client deployment – it’s not just for Devs.

You can now access the PDF version of the schedule – or download this iCal format schedule for all the sessions in Montreal.

I don’t know about you – but when I attend conferences like TechDays – there are normally multiple sessions at the same time that I am interested in attending. I need to make a personal schedule. There is an online schedule builder you can use that you can create your own schedule – or you can use the iCal schedule and delete what doesn’t interest you. Take some time to browse around and read the full abstract of each sessions that is in conflict to make the right choices. Once at TechDays – you are free to move about and switch on the fly – but it’s always good to know your options. Don’t forget – you are encouraged to explore the partner fair, connect with attendees and local experts – it’s also about networking, not just the content.

We’ve made up a cool conference with local speakers from Montreal as well as experts from across the country. TechDays Montreal will be quite the event. We’ll see you next week!

New HTML5 user group in Montreal

Frédéric Harper — Tue, 22 Nov 2011 15:32:00 GMT

Do you know HTML5? We heard about this everywhere, and I have to admit that I am a fan. I know that in Montreal, I’m not the only one. After we saw a real enthusiast from people in our hometown, and from places like Toronto and Vancouver, where there is also HTML5 user group, Benoît Piette, Mathieu Chartier and myself decide to create one here.

At this time, the information on the site is only in French, but we will try to do everything bilingual even if in most of the time, presentations will be in French. I think that it could interest you!

We know it. Developers love to get together to learn, discuss and network with people that use, want to use or are just curios about a same technology. It’s why we created this group focus on HTML5. A user group, with people from every horizon, that want to meet, hopefully, once a month to talk about a specific subject around this technology and all his possibilities.

It doesn’t matter if you are a professional, an amateur, a developer, a designer, a student… HTML5mtl is there for you. I invite you to join the group for free on Meetup.com. This will be a good way to initiate yourself to the different aspect of this technology, to network with other passionate like you and for the more advanced people around here, to come share your knowledge with other (don’t hesitate to let us know if you want to present on a subject). The first meetup is tonight at 19:00 at 2000 McGill College suite 450. I know it’s a bit last minute, so if you can join us, it will be awesome. If not, don’t forget that this one is only the first one. There will be a lot more to come. This free event will be a mix between an introduction on HTML5 and some networking. You have to register to participate, because the numbers of places are limited.

Please note that this group is not a Microsoft user group. We sponsor, but other companies in the industry will join us to share the HTML5 love. We already contacted people at Google, Opera and Mozilla. They seem to be very enthusiast to participate in any ways. More details to come!

Looking forward to seeing you tonight.

Awesome resources for Developers Tools, Languages and Framework track at TechDays

Frédéric Harper — Fri, 04 Nov 2011 18:58:00 GMT

I don’t know for you, but each time I go to a conference, I always want to put my hands into the new technology I just learn. I’m sure that it’s the case for you, so I wanted to give you a one-stop place where you’ll be able to get everything you need to do this with the sessions you saw, or you will see in the Developers Tools, Languages and Framework track at TechDays.

In this blog post, I give you some links to download the tools, install the frameworks, learn the languages… everything you need to know or to download to jump in.

HTML5

Sessions: DEV334 - HTML5 and CSS3 Techniques You Can Use Today & DEV302 - Application Development with HTML5

Unleash the power of HTML5 with a good browser - Download Internet Explorer 9

Test some of the newest features of HTML5 - Internet Explorer 9 Test Drive

Tutorial on HTML5 - Dive into HTML5

Use the right tools – Download WebMatrix and/or download Visual Studio Express

WebMatrix

Sessions: DEV201 - WebMatrix: See What the Matrix Can Do For You!!

Code quickly and more efficiently - Download WebMatrix

Learn how to leverage the Matrix – WebMatrix Tutorials

Keep yourself up to date on the next release – Make Web Not War blog

SilverLight

Sessions: DEV303 - A Lap around Microsoft Silverlight 5 & DEVILL301 - Building a LightSwitch Control Extension

Prepare your PC for creating amazing rich internet experiences – Download Silverlight runtime and tools

Put your hands into the code – Silverlight Samples

Get started with SilverLight – Silverlight homepage

LightSwitch

Sessions: DEV271 - LightSwich is Hot! Really Hot!! & DEVILL301 - Building a LightSwitch Control Extension

Download LightSwitch - Try LightSwitch 2011

Learn more on Visual Studio LightSwitch – LightSwitch homepage

Orchard CMS

Sessions: DEV274 - Develop Websites with Orchard CMS

Test Orchard CMS – Download Orchard

What is Orchard – Orchard Project homepage

The easiest way to install all your tools and Open Source software – Microsoft Web Platform Installer

Visual Studio

Sessions: DEV376 - Debugging Hard to Reproduce Production Issues & DEV373 - Testing with Microsoft Visual Studio Test Professional and the new Team Lab 2010

Try Visual Studio 2010 – Visual Studio Homepage

Use Visual Studio Express for free today - Visual Studio Express

Simplify test planning and manual test execution – Visual Studio Test Professional 2010

There are a lot more resources on the Web, but these are the one that I wanted to share with you. If you have any other resources that you found so awesome, please let me know in comments, and I’ll add them in the list. Enjoy!

Everything You Need for TechDays Toronto

Jonathan Rozenblit — Sun, 23 Oct 2011 18:31:18 GMT

There’s always lots to do when it comes to getting ready for a conference (especially if you’re travelling), so I thought I would take this opportunity to review your “everything I need for TechDays Toronto” prep list with you. I won’t be able to help you with your personal prep to-dos, but I can suggest the following:

Review the Session Abstracts and build your schedule

Before the fun begins, you’ll want to make sure that you know what each session is about and then choose a session for each timeslot of the day. To do that, head over to the TechDays Schedule Builder. It will walk you through all of the sessions in the technology areas that you’re interested in and will help you build your schedule. You can then print or email your schedule to yourself (and perhaps your colleagues if they are joining you).

Go >>

Download the TechDays Toronto agenda (and floor plan).

With seven tracks and instructor-led labs, there’s going to be a lot going on at the same time. To make sure that you don’t miss out on the sessions that you want to attend or find yourself in a room listening to a speaker talk about some infrastructure stuff (because you’re in the wrong room), make sure to download the TechDays Toronto agenda to your phone (or print it if necessary). That way you’ll know what session is happening in which room at what time and where the room is located.

Download >>

Prepare your notebook computer for the hands-on labs and bring it with you.

Have a read through Damir Bersinic’s post from 3 days ago – Reason #42 to Attend TechDays 2011: Hands-on Labs. The hands-on labs are something that you definitely don’t want to miss. I know that when I go to conferences, I like attending sessions to hear experts tell me about, or through demos, show me everything I need to know about a technical topic. However, I find myself wanting to try it out on my own. I’m sure you feel the same way, so have a look at the instructor-led lab list in Damir’s post, register for the one/ones that is/are of interest, and make sure to prepare your notebook computer, and of course, bring it with you.

More >>

If you’re planning to attend the Introduction to Windows Azure lab, please note that the exercises in the lab will require to you have a Windows Azure account. If you don’t already have a Windows Azure account, take a moment and sign up for the 90-day FREE trial before the lab so that you will be able to continue your learning beyond the end of the lab. A training account will be provided to you for use during the lab if you don’t want to create an account for your own.

If you’re not attending TechDays Toronto in person

We’re sorry that we won’t get to see you! However, that doesn’t mean that you won’t be able to be part of the TechDays Toronto experience. Make sure you don’t miss the keynote by Jeff Woolsey, Principal Program Manager Lead on the Hyper-V team at Microsoft that will be streamed LIVE starting at 8:30 AM ET on Tuesday, October 25. Jeff will be talking about Microsoft’s virtualization and Private Cloud strategy for organizations of all sizes. This is a not-to-be missed opportunity to hear first-hand how your organization can leverage Microsoft’s virtualization technologies to help streamline your IT infrastructure today and in the future.

Watch LIVE >>
Add to your calendar >>

Get Social. Join the Conversation.

Whether you’re going to be at TechDays Toronto in person or joining online, don’t forget that part of the experience involves you – you sharing your thoughts. Pick your network and tweet, post, or discuss away! We’ll be watching out for your tweets, posts, and discussions, as well as the speakers and community experts, so get social and join the conversations.

	Tweet using the #techdays_ca hashtag and your session code. Here’s an example: #techdays_ca #CLD301 Thinking of moving to the #cloud this way totally makes sense. #Azure

	Post your thoughts in discussions started for each session in the TechDays Canada LinkedIn group.

	Make sure to like the TechDays Canada Facebook page to get updates throughout the day. Post on the TechDays Canada wall or like others’ posts.

Register for More Learning Opportunities

In addition to the TechDays sessions happening during the day, there are also additional activities happening in the evenings that may be of interest.

CloudCamp Toronto Monday, October 24 5:30 PM – 9:00 PM ET	CloudCamp is an unconference where attendees can exchange ideas, knowledge and information in a creative and supporting environment, advancing the current state of cloud computing and related technologies. Register >>

DevCamp Toronto Tuesday, October 25 6:30 PM – 10:00 PM ET	DevCamp is a mix of all the things you love from different events: the less formal environment that you love from BarCamp events; the great content and speakers from conferences; the quick and right-to-the-point innovative and exciting talks seen at TED or TEDx; and the power to meet other technology enthusiasts and network. Register >>

So now that you have the list of everything that you need for TechDays Toronto, the only thing that remains is to show up (or if attending virtually, log on) and have a great time!

The team and I are looking forward to seeing you. Make sure to stop by the Microsoft Showcase at the Partner Pavilion and say hello!

How to Pin a Website And Why to Pin a Website

Frédéric Harper — Mon, 17 Oct 2011 11:31:00 GMT

This is a great blog post from Susan Ibach about the pinning feature in Internet Explorer. I think it could be a good idea to share this valuable information with you. Thanks Susan!

I was just preparing a slide deck to talk about IE9 features at the Microsoft Certified Trainer summit and realized, that although I have blogged about how to update your pinned sites, I really haven’t taken the time to explain what the heck pinned sites are and how they work. Pinned sites are a fantastic feature of IE9, and as more and more users are discovering them, you want to make sure your website makes the most of this feature.

Before I get into the technical aspect, let me take a moment to tell you why you want your web site to support pinning. Users who pin your site will visit your site more often, and will spend more time on your site. In the words of Martha Stewart “That’s a good thing”. Whether its an internal company website you want your users to access easily, or a public site you use to help your business or group we build the site because we want users to spend time there. So if pinning increases the amount of time users spend there, you want pinning.

If you are using IE9 or higher you can quickly try out pinning right now to see how it works. Open a tab in your browser and visit tsn. Now drag the tab down to your taskbar. You will see a TSN icon appear on your taskbar and you will also notice the TSN website now looks different, the forward and back buttons appear in red to match the logo. The icons on your page have changed from the IE logo to the tsn logo. The icon you see is called a favicon, and you can set the of the forward and back buttons based off the favicon or by specifying specific colors.

Now let’s take a closer look at that logo you just added to the task bar. You can close the IE windows with TSN and relaunch the site by clicking on that icon. That’s nice, basically just like you can have icons for launching your desktop applications, you now have an icon to launch a web site. Here’s the really cool part, you can also right click on the icon to go directly to a particular part of the website like the News or TV Schedule. It’s like Browser Favorites but wayyyyy better!

Nice Eh? And it’s really easy to do. Since its implemented with metatags, you can add the functionality for your users who have IE9 without breaking the website for users on other browsers. You can make your pinned site as simple or as fancy you want, it’s just a matter of how much time you want to spend, 10 minutes to set up a favicon? an hour or a day to add more functionality.

You can just add a favicon, quick and easy!

You can add a jumplist to the pinned site just like TSN did, to make it easier for users to navigate the site using a few metatags or JavaScript.

You can get fancy with thumbnail buttons, and notifications by adding a little more JavaScript.

Read on to find out how!

1. Create a favicon

If you are a talented graphic artist, or have someone on your team who knows how to make .ico files good on you! For the rest of us check out xiconeditor.com. You can import a .JPG, .GIF, .BMP, .PNG, or .ICO file, crop it and xiconeditor will generate a .ico file suitable for pinned sites. That was easy

2. Add the favicon to your HTML in the <head> section.

<link rel="shortcut icon" href="favicon.ico"/>

Now you will see your favicon appear in the browser and on the toolbar if you pin your site. Next you should set up your meta data for the pinned site in the <head> section

application-name specifies the name of your pinned application, give it a meaningful name.
msapplication-tooltip specifies what will be displayed when you hover over the pinned application in the start menu (not the taskbar)
msapplication-starturl specifies the URL to be launched when the pinned website is launched
msapplication-window tells IE9 how big to make the browser when it launches the pinned application
msapplication-navbutton-color tells IE9 what color to use for your navigation buttons, if you omit this tag, IE9 will take the color from your favicon. Specify any hex color or CSS3 color name.

<meta name="application-name" content="My Pinned Content" />
<meta name="msapplication-tooltip" content="Launch My pinned site" />
<meta name="msapplication-starturl" content="http://localhost:42942/PinnedSites/index.html"/>
<meta name="msapplication-window" content="width=1024;height=768" />
<meta name="msapplication-navbutton-color" content="#FF3300" />

3. Add a Static Jump List

The Jump List is the context menu that appears when you right click on the pinned site icon on your taskbar. To add a task to the jump list, you need to add a meta tag for msapplication-task. You can add up to 5 static tasks to the jump list. The tasks in the jump list will appear in the same order as you define the tasks in the HTML.

Msapplication-task indicates this is a task you want to add, in the content attribute you specify

name – this is the text that will be displayed in the jump list
action-uri this is the URL to open if someone selects this task from the jump list
icon-uri specifies the icon to display in the jump list for this task.
window-type (optional) specifies if the destination should be opened in a tab (default), self (the current tab) or window (a new pinned site window)

<meta name="msapplication-task" content="name=View Pictures; action-uri=http://localhost:42942/PinnedSites/pictures.html; icon-uri=favicon.ico" />

4. Add a Dynamic Jump List (if you want to)

Use JavaScript to create tasks dynamically on a jumplist, you do not have the 5 task limit with dynamic jump lists. Creating dynamic tasks requires using the following methods

window.external.msSiteModeCreateJumpList() to create the dynamic jump list
window.external.MsSiteModeAddJumpListItem() to add a task to the dynamic jump list
window.external.msSiteModeShowJumpList() to display the jump list

function AddJumpList()
{
    if (window.external.msIsSiteMode())
    {
         window.external.msSiteModeCreateJumplist("My Dynamic List");
         window.external.msSiteModeAddJumpListItem("Added with code","http://www.tsn.ca/","favicon.ico");
         window.external.msSiteModeShowJumplist();
     }
}

So with a few meta tags you can set up your website as a pinned site, with a little JavaScript you can even have a dynamic jump list. If you want to update the jumplists later, no problem! In fact I wrote some blogs explaining How to update a static jumplist, and how to update a dynamic jump list

5. Go all out and add a thumbnail toolbar (if you want to)

If your website plays video or audio, or you have other actions you want users to control from their pinned site, in addition to the jump lists you can use JavaScript to add a toolbar of thumbnail buttons! Use it to advance slides, pause and play a video or song. This will actually take a bit more time and work, but it’s pretty cool!

Use window.external.msSiteModeAddThumbBarButton to add a 16X16 icon to the thumbnail toolbar

Use window.external.msSiteModeShowThumbBar to display the thumbnail toolbar

Create icons for each button you want on the toolbar
Add each button to the thumbnail toolbar
Define the action you want for each thumbnail toolbar

You cannot add buttons to a toolbar after the toolbar is visible! (You can hide or disable buttons, but you can’t add or remove them)

Thumbnail toolbars can hold a maximum of 7 buttons. You can sometimes use one button as a toggle switch between modes e.g. Play and Pause can be one button instead of making a Play and a Stop button

For example to add a button

var btnRed = window.external.msSiteModeAddThumbBarButton('red.ico', 'Red');
var btnBlue = window.external.msSiteModeAddThumbBarButton('blue.ico', 'Blue');
window.external.msSiteModeShowThumbBar();
document.addEventListener('msthumbnailclick', onButtonClicked, false);

Then add a line of code to display the toolbar

window.external.msSiteModeShowThumbBar();

Create event handlers for the thumbnail toobar to define the actions to take when a button is pressed (As an added bonus if you are using IE9 you can use AddEventListener instead of attachEvent).

document.addEventListener('msthumbnailclick', onThumbnailButtonClicked, false);

function onThumbnailButtonClicked(btn) {
          switch (btn.buttonID) {
              case btnRed:
                  document.bgColor = '#990000';
                  break;
              case btnBlue:
                  document.bgColor = '#000099';
                  break;
          }
      }

If you want to have a toggle button, for example a play/pause button, on your toolbar, you use window.external.msSiteModeAddButtonStyle to define a style with an alternative icon image and tooltip for a specified button and use window.external.msSiteModeShowButtonStyle to change the icon image and tooltip for the button in your event handler.

styleColored = 0;  //default style ID, this style was created when you added the button
styleClear = window.external.msSiteModeAddButtonStyle(btnRed, 'white.ico', "Clear");

function onThumbnailButtonClicked(btn) {
          switch (btn.buttonID) { 
             case btnRed:
             if (document.bgColor != '#990000') 
                 {
                  document.bgColor = '#990000';
                  window.external.msSiteModeShowButtonStyle(btnRed, styleClear);
                  break;
                  }
            else {
                  document.bgColor = '#FFFFFF';
                  window.external.msSiteModeShowButtonStyle(btnRed, styleColored);
                  break;
                  }
              case btnBlue:
                  document.bgColor = '#000099';
                  break;
          }
      }

So did you get all that? Don’t worry you don’t have to do everything! I just wanted you to know all your options. Any site can be pinned. If you add a favicon, you make your site look better when its pinned. When you add a jumplist you make it easier for a user to navigate to specific regions in your site. You decide how much functionality makes sense! For more information about pinned sites check out BuildMyPinnedSite.com which has more great information including how to add notifications (those tiny icon overlays, like one in Windows Messenger that shows you if you are signed in), suggestions on how to help users learn how to pin your site, and how to measure the success of your pinned site! Download IE9 and start pinning your site today!

Console.Log : Say Goodbye to JavaScript Alerts for Debugging!

Susan Ibach — Thu, 26 May 2011 17:12:16 GMT

Admit it, you’ve done it. You have a bug somewhere in your web page and you add an alert to popup a useful message like “I am in the if statement” or “varName=Bob” to help you figure out what is wrong with your code. In IE9 we have an alternative: the Console object.

ASP.NET programmers who work in Visual Studio may already be familiar with the debug object. You call methods of the debug class in your .NET code to display messages in the Output window to help you debug your code in Visual Studio. The Console object is the IE9 equivalent.

Hopefully you have already discovered the Developer tools in IE8 and IE9. If not, just open your browser and go to a website, any website will do. Now hit F12. This will bring up the developer tool window. Now go to the Console tab.

Now try typing console.log(“Hello world”) in the console command line at the bottom of the window. Your output should look something like this.

console.log will display the parameter passed to the log method in the console window. Use this method to display a string or variable in the console window.

You can use the console class in your code as well, much like we can use JavaScript alerts.

Keep in mind you will not be able to see the output unless you have the developer tools open. You can see the console output on either the Console or Script tabs. Be careful when using console for debugging. If you leave a call to the console object in your code when you move to production and you do not have the developer tools displayed you will get an error message telling you console is undefined. You will get the same error in Visual Studio if you Start without debugging.

To avoid the error message, you either need to remove all the console method calls from your code, or you need to add a check to make sure console exists before calling any methods. For example:

Now that you understand the the basics, let’s look at the different methods available with the console class.

log(message[,object]) – the Log method accepts one or more parameters and displays them in the output window. It also accepts format strings.

warn(message[,object]) – accepts one or more parameters and format strings just like the log method, but displays the output with a warning icon.

info(message[,object]) – will display an information icon beside the output

error(message[,object]) – will display an error icon beside the output

clear() – will clear the console output window

dir(object) –is an object inspection method that will list all the properties of an object

assert(expression, message[,object]) - will display the message or object contents if the expression is false

var debugging=false;
console.assert(debugging,"You are not debugging");

So there you have it, more tools to help you debug your web pages. No add-ons or extra software required. Just download IE9 and try it for yourself!

Since we are already playing around in the developer tools that brings me to today’s My 5

My 5 Cool Features in the F12 Developer Tools (in no particular order)

Select element by click – Ever had trouble tracking down the HTML code for a particular element on your page. Select Find | Element by Click from the developer tools menu and then you can just click the element on the web page. The corresponding code in your HTML will be highlighted.
Format JavaScript – It’s all about performance, we compress our JavaScript to reduce the number of bytes that are sent across the network, but then the code becomes almost unreadable to the human eye. Select the Script Tab, choose the Toolbox drop down (the little picture of the hammer and wrench) then select Format JavaScript. Bingo now your JavaScript is readable again!
Browser mode - Developing for IE9 but want to know what your website will look like in IE8 or IE7? Just set the Browser Mode in the menu.
Resize – How does your website appear on a smart phone? how about a tablet or slate? Choose Tools | Resize and then select a size or enter a custom size to ensure your website is user friendly on smaller devices.
Change User Agent String – Debugging a web site that doesn’t seem to work in IE9? Could it be the programmer has written their code to use browser detection instead of feature detection so perhaps the code doesn’t know to check for IE9? You can change the user agent string and see if it works when the code thinks it is being displayed in another browser. Choose Tools | Change user agent string and select the desired value.

AzureFest Makes A Surprise Visit to Calgary This Weekend

Jonathan Rozenblit — Wed, 27 Apr 2011 04:06:41 GMT

AzureFest is making a surprise visit to Calgary this weekend! If you haven’t yet heard of AzureFest, check out this post where AzureFest is described in full.

Remember, AzureFest is a hands-on event. This means that you’ll be following along on your own laptop and actually deploying your solution during the event. In order to get the most out of the experience, make sure to bring your laptop, a power cable if you’re going to need to plug in your laptop, and a credit card. Don’t worry, nothing will be charged to your credit card during AzureFest. Your credit card is just required for activating your Windows Azure account.

If you want to see for yourself how easy it is to move your existing application to the cloud, this is an event you don’t want to miss. Register early as space is limited.

Calgary
University of Calgary, Rm 121 ICT Building
2500 University Drive NW, Calgary, AB
Saturday, April 30, 2011
Click here to register

Have plans? No problem! A virtual AzureFest is coming your desktop in May – stay tuned.

AzureFest Meets the East Coast

Jonathan Rozenblit — Mon, 18 Apr 2011 05:18:06 GMT

East Coast, after many hours of logistics discussions and preparations, AzureFest is coming your way! If you haven’t yet heard of AzureFest, check out this post where AzureFest is described in full.

Here’s the information for the cities on the AzureFest East Coast Tour. If you want to see for yourself how easy it is to move your existing application to the cloud, this is an event you don’t want to miss. Register early as space is limited.

Moncton
Greater Moncton Chamber of Commerce Board Room – First Floor
1273 Main Street, Suite 200, Moncton, NB
Friday, May 6, 2011 6:00 PM - 10:00 PM
Click here to register

Presenters: Cory Fowler (@SyntaxC4)

Fredericton
UNB Campus
Room 317, ITC
Saturday, May 7, 2011 9:00 AM – 12:00 PM
Click here to register

Presenters: Cory Fowler (@SyntaxC4)

Halifax
The Hub
1673 Barrington St., 2nd Floor, Halifax, NS
Sunday, May 8, 2011 1:30 PM – 4:30 PM
Click here to register

Presenters: Cory Fowler (@SyntaxC4)

We’re always looking to hear your thoughts and suggestions on the things that we do. If you have any feedback, we’d really appreciate it if you would share it with us here. We’re starting to think of the next wave of AzureFests – what would you like to see us cover in the next hands-on event? Post any and all suggestions you may have here. We’ll take everyone’s input and design AzureFest 2.0 accordingly. Looking forward to hearing from you.

Moncton, Halifax, and Fredericton developers, enjoy AzureFest!

Azure At the Movies: Get In The Cloud

Jonathan Rozenblit — Fri, 15 Apr 2011 17:53:16 GMT

When was the last time you had a chance to go to the movie theatre during the day? More importantly, when was the last time you learned something new at the movie theatre? Well Azure at the Movies will not only get you out to the ScotiaBank Theatre on May 5, 2011 from 9 AM to noon, but it will also guarantee that you walk away having learned how to provide stability and elasticity for your web based solutions using Windows Azure.

Join me and the gang from ObjectSharp, Barry Gervin, Cory Fowler, Dave Lloyd, Bruce Johnson, and Steve Syfuhs for a half day event in Toronto where we’ll explore how Silverlight, ASP.NET MVC, Team Foundation Server, Visual Studio, and Powershell all work together with Windows Azure to give you, the developer, the best development experience and your application the platform to reach infinite scale and success.

Thursday, May 5, 2011
Registration: 8:00 AM – 9:00 AM
Seminar: 9:00 AM – 12:00 PM
ScotiaBank Theatre, 259 Richmond Street West, Toronto

Click here to register.

I look forward to seeing you there and chatting about your journey to the Cloud and how I may be able to help.

Deploying a Ruby App to the Cloud

Jonathan Rozenblit — Sun, 27 Mar 2011 15:22:28 GMT

We’ve discussed interoperability and Windows Azure when we walked through deploying a simple PHP Cloud app. Now let’s continue that conversation as we venture out and explore how to deploy a Ruby based application to Windows Azure.

Thomas Conte (@tomconte), a fellow Architect evangelist from France, has put up a great blog post describing the steps required to deploy a Ruby application that uses the Sinatra framework, the WAZ-Storage library, and a Windows Azure Worker Role.

Start the walkthrough – Deploying Ruby in Windows Azure.

WAZ-Storage is an open source library that allows you to access Windows Azure Blobs, Tables, and Queues from your Ruby code.

Interested in learning how to deploy applications written in .NET or PHP? Check out these walkthroughs:

AzureFest: Taking Your Traditional Web Apps to the Cloud

Jonathan Rozenblit — Tue, 22 Mar 2011 17:30:00 GMT

Last week, we talked about deploying a PHP app to the Cloud and WordPress to the Cloud. But we didn’t really cover the essence of the Cloud, its advantages for your web applications, and how to deploy a .NET based app to the Cloud using Visual Studio. Rather than having that conversation online, why don’t we have it in-person, live, with the experts? I’d like to invite you to check out AzureFest, a hands-on educational event designed by Canada’s own MVPs Cory Fowler (@SyntaxC4) and Barry Gervin (@bgervin) from ObjectSharp. At AzureFest, you’ll see how developing and deploying applications to Windows Azure is fast and easy, leveraging the skills you already have (.NET, Java, PHP, or Ruby) and the tools you already know (Visual Studio, Eclipse, etc.).

AzureFest sessions are delivered with examples using .NET and Visual Studio, but the concepts are the same regardless of the language and tools. You’ll learn everything to you need to know to get up and running with Windows Azure quickly including:

Overview of Cloud Computing and Windows Azure
Setting up the Windows Azure SDK and Windows Azure Tools for Visual Studio
Setting up your Windows Azure account
Migrating a traditional on-premise ASP.NET MVC application to the Cloud
Deploying solutions to Windows Azure

AzureFest is a hands-on event. This means that you’ll be following along in your own development environment and actually deploying your solution during the event. In order to get the most out of the experience, you’ll need to bring a laptop with you that is running Windows Vista SP1 or Windows 7 with the Windows Azure Tools for Visual Studio installed. If you don’t have Visual Studio, or are not working with .NET, that’s OK. Use the language and tools of your choice – help will be on hand to assist you.

You’ll also need to bring a credit card. Windows Azure activations require a credit card even for the trial period, but don’t worry, nothing will be charged to your credit card as the last part of the event shows you how to take down all of your Windows Azure instances.

We’re taking AzureFest across Canada, and will be coming to a city near you. Check out the listings below to get all the information you need about each of the cities. Don’t see a city that’s near you? Keep checking back as we will be adding more cities and dates as we confirm them. If you’d like to help organize an AzureFest in your city or at your user group, please contact me via email, Twitter, or LinkedIn.

Where and When

Downtown Toronto
Microsoft Canada
Ernst & Young Tower
222 Bay Street, 12th floor
Wednesday, March 30, 2011 6:00PM – 9;00PM
Click here to register

Presenters: Cory Fowler (@SyntaxC4), Barry Gervin (@bgervin)

Mississauga
Microsoft Canada
1950 Meadowvale Boulevard
Thursday, March 31, 2011 6:00PM - 9:00PM
Click here to register

Presenters: Cory Fowler (@SyntaxC4), Barry Gervin (@bgervin)

Vancouver
BCIT, Burnaby Campus
3700 Willingdon Avenue
Tuesday, April 5, 2011 6:00PM – 9:00PM
Click here to register

Presenters: Jonathan Rozenblit (@jrozenblit)

Ottawa
Algonquin College Campus
1385 Woodroffe Avenue, Ottawa
Saturday, April 16, 2011 12:45PM – 1:30PM
Click here to register

Presenters: Christian Beauclair (@cbeauclair)

Calgary
University of Calgary, Rm 121 ICT Building
2500 University Drive NW, Calgary, AB
Saturday, April 30, 2011 9:00 AM – 5:00 PM
Click here to register

Presenters: Michael Diehl (@MikeDiehl_Wpg) and Tyler Doerksen (@Tyler_gd)

Moncton
Greater Moncton Chamber of Commerce Board Room – First Floor
1273 Main Street, Suite 200, Moncton, NB
Friday, May 6, 2011 6:00 PM - 10:00 PM
Click here to register

Presenters: Cory Fowler (@SyntaxC4)

Fredericton
UNB Campus
Room 317, ITC
Saturday, May 7, 2011 9:00 AM – 12:00 PM
Click here to register

Presenters: Cory Fowler (@SyntaxC4)

Halifax
The Hub
1673 Barrington St., 2nd Floor, Halifax, NS
Sunday, May 8, 2011 1:30PM – 4:30 PM
Click here to register

Presenters: Cory Fowler (@SyntaxC4)

Quebec City
l'École National d'Administration Publique (ENAP), salle 4114
555, boul.Charest Est, Québec, QC
Thursday, May 12, 2011 5:00 PM – 8:30 PM
Click here to register

Presenters: Frédéric Harper (@fharper)

Montreal
Microsoft Canada
2000 McGill College, Montreal, QC
Tuesday, May 17, 2011 6:00 PM – 9:00 PM
Click here to register

Presenters: Frederic Harper (@fharper)

Winnipeg
Online Business Systems, Assiniboine Room, 2nd Floor
200-115 Bannatyne Ave., Winnipeg, MB
Thursday, May 19, 2011 5:30 PM – 9:00 PM
Click here to register

Presenters: John Bristowe (@jbristowe)

Waterloo
Coming Soon! Save the date!
Tuesday, May 31, 2011 8:30 AM – 12:00 PM

Presenters: Jonathan Rozenblit (@jrozenblit)

Virtual Lunch and Learn Series
Online
Part 1: Thursday, May 19, 2011 12:00 PM – 1:00 PM EST, CST, MST, PST
Part 2: Thursday, May 26, 2011 12:00 PM – 1:00 PM EST, CST, MST, PST
Part 3: Thursday, June 2, 2011 12:00 PM – 1:00 PM EST, CST, MST, PST
Click here to register

Presenters: Jonathan Rozenblit (@jrozenblit)

Make sure you register early as space is limited. Make sure to find me when you’re are the event – it will be an opportunity for us to chat about what you’re working on, possible projects to move to the Cloud, and how I can help extend your skills to the Cloud.

Web junkies, here we come

Frédéric Harper — Fri, 18 Mar 2011 17:21:00 GMT

At Microsoft, we can talk about a lot of things related to the technology and that are helpful for developers: softwares, programming languages, platforms, events... We also know that it's not always easy to find blog posts about your passion, the Web, when a lot of contents are created on our main Canadian developers blog, so it's why we made this new blog that is all about Web technology.

It will be a great place for you to hear about anything that is related to Web. We want you to make this primary source of information and feels like home. I invite you to suggest us some topics you want to hear about it as we will try to make great blog post for you. To be able to do this, we will look at some people that will help Joey and me write for this new online resource.

I hope you'll love this blog as much as we'll have fun to write on it. Now there is not much content, but stay tuned, add the RSS feed to your preferred RSS reader and be ready to read!

Source de l'image: http://www.theimf.com

Deploying a PHP App to the Cloud: WordPress

Jonathan Rozenblit — Fri, 11 Mar 2011 20:32:23 GMT

Your journey to the Cloud started with a walkthrough of deploying a simple PHP app to the Cloud. Now, we’ll continue with exploring how to deploy a more complicated but much more useful application to Windows Azure.

WordPress and Windows Azure go very well together and deploying WordPress to Windows Azure is not much more complicated than the simple “Hello Cloud!” PHP app from the previous walkthrough as you’ll see in this walkthrough.

There are two different approaches to deploying WordPress to Windows Azure. The first is a manual approach where you’ll prepare the PHP environment, build the package in Visual Studio, and then deploy it to Windows Azure through the Windows Azure Management Portal.

The second approach is a more automated installation by using a the Windows Azure Companion. The Windows Azure Companion is a ready-made administrative web site that you run on your account in Azure. The site allows you to install frameworks, like PHP, and other 3rd party applications, like WordPress, Drupal and Joomla!, directly into the same Azure service instance hosting the Companion (a worker role, by the way) If this kind of thing sounds familiar, well it is; think of the Windows Azure Companion as the cloud analogy of the Web Platform Installer.

You may be aware that you can already host PHP, MySQL, Java, and a host of other non-Microsoft frameworks and applications on Windows Azure, and there are a number of solution accelerators (PHP/MySQL, Tomcat, memcached, etc.) available to help you out. The Windows Azure Companion takes things to the next level, providing a single point of administration for hosting and managing frameworks and applications in Windows Azure. Right now it’s focused on PHP-based applications, given the popularity of CMSes like WordPress and Drupal, but it certainly seems like a platform that could be easily extended in the future.

Let’s get started.

Before proceeding, you’ll need to make sure that you have a Windows Azure account. Between now and June 30, 2011, take advantage of this free trial offer that provides you with sufficient resources to run an entire single instance web site, 24 hours a day, for an entire month. Visit Canadian MVP Colin Melia’s blog for instructions on creating your Windows Azure account.

Don’t have a credit card, no problem. As a special offer through our blog, you can sign up for a Windows Azure Pass at windowsazurepass.com. Select Canada as the country and CDNDEVS as the promo code.

To deploy WordPress to Windows Azure

In part 1, you’ll go through the basic process of hosting PHP applications on Windows Azure, which includes creating the deployment package and configuring the PHP CGI Web Role.
You don’t have to follow the last steps of this part where you’re instructed to visit the Windows Azure Management Portal and deploy the sample app.
Now that you know how to create a deployment package, in the next part, you’ll add the WordPress installation to the package. You’ll then make the necessary configuration changes and deploy the final package to Windows Azure via the Windows Azure Management Portal.

If you don’t have Visual Studio, or prefer to work without it, you can also prepare the deployment package using the Windows Azure Command Line Tools for PHP. Use the Deploying a Simple PHP Cloud App walkthrough to learn more about the command line tools. Alternatively, you can use the Windows Azure Companion with the instructions below.

To deploy WordPress by using the Windows Azure Companion

Jim O’Neil, a fellow developer evangelist, walks you through the installation of the Windows Azure Companion, followed by the installation and activation of WordPress in his blog post Windows Azure Companion: PHP and WordPress in Azure.

As I mentioned in our first walkthrough, if at any time during your walkthrough you have any questions or are having trouble, feel free to send me an email (cdnazure@microsoft.com). I’ll be more than happy to help.

Please take a moment to share what you thought of the walkthrough, what you’ve learned, and what next steps you’ll take on your journey to the Cloud in this LinkedIn Cloud Development group discussion. I’ll be reading through your responses and taking your feedback as input for future walkthroughs and events.