Silverlight - A new Technology

What is Silverlight ?

have just passed up my first chance to build a silverlight component into a website. It was a tough choice, since everyone involved generally agreed that Silverlight was a great technology and would add a ton of bling to the site.

That being said, it has to be noted that Silverlight does not have a good layout system in place, as it only uses the Canvas layout from WPF - no flow layouts, here folks! This means that you have to position every single element absolutely. And you have to code it in javascript. And there is not built-in project template for it in VS 2008 yet, so you have to jump through some hoops to get intellisense working for you.

That's not a good way to introduce yourself to a technology, in my opinion.

Here where I think Silverlight is actually a good technology to use:

Streaming video.
This is one of the main commercial uses of this technology at the moment, and it sure beats the pants of other streaming formats.
It would greatly benefit by better tools for encoding, but Expression 2.0 looks pretty decent so far (in beta).
Displaying vector graphics with small amounts of interactivity
Lets face it, you can code any amount of logic yourself into a Canvas framework, but the power of Silverlight is in its ability to reproduce WPF, which in turn is really only useful with its vector graphics capabilities, combined with the layour frameworks.
Until we get more of WPF to work with, getting more experience with XAML's in terms of more static vector objects is a good idea.


The purpose of this tutorial is to show how simple it is to Silverlight-enhance a web page. Everything necessary to do so with the exception of the bits from the SDK are included on this page, and a link to the SDK is given along with instructions, so within just a few minutes, you should have your first Silverlight web page running!

It is normally my intent to explain everything in detail, but I'm breaking with that tradition on this page. Because I want you to be able to get a page up quickly, I'm going to bypass delving into some of the syntax this time in favor of product-to-browser.


The Bottom Line

The 'Bottom Line' on putting up your first web page containing a Silverlight canvas is that you don't need AJAX, and you don't need Visual Studio! Worst-case scenario is notepad... if you have a good color-coded templated code editor, that's great as well, but also not necessary.

The minimum need for a Silverlight-enhanced web page is 3 things:
The html file for your page data
The Silverlight.js file provided in the SDK (described below)
An XML file in the form of Silverlight XAML to specify the canvas
Of course, if you're using external css, or have any graphic elements, those would need to be included, but for now, lets ignore those.

To get the hard part out of the way first, go to the Silverlight.net Getting Started Page, scroll down to the section heading "Software Development Kit", and take the link to download "Microsoft Silverlight 1.0 Beta Software Development Kit (SDK)".

Unzip all that to someplace that you'll find easily. There's lots of good stuff in there to look at, but the one thing we're interested in right now is Silverlight.js

You'll need to have Silverlight.js somewhere in your development area that can be easily reached by your code, and easily updated when a new release is made. I think it's fairly standard to have a js folder that contains this and other Java Scripts you may use. I'm going to assume that this is the case for the following discussions.