Keep Your Copyright Message Fresh

There’s nothing that reeks of staleness and lack of attention, than a footer saying “copyright © 2009” in 2014. Doubly so when it’s a technology site. At best it says no one cares, at worst it suggests no one updated the site, or it’s look and feel, in years. Many times it’s not even the current maintainer’s fault: the stale message resides in a footer file, that gets included automatically with every page by a CMS system.

For my sites and web applications, as well as the ones I develop for my clients, I want to keep the copyright message fresh. It at least keeps up a pretense of someone updating the site once a year . And there’s no easier way to do it then with JavaScript.

All you need to do is locate the line in your footer that looks like:

<footer>copyright © 2009</footer>

and replace the year with a <span>:

<footer>copyright © <span id="year"></span></footer> 

And add this script tag to the end of the page:

<script>
    document.getElementById('year').textContent = (new Date()).getFullYear();
</script>

Even easier: if your site is using jQuery, add this to the ready event:

$('#year').text((new Date()).getFullYear());

This way, your copyright message will always show the current year. Keeping your content fresh? Well, that’s up to you .

Update:
Here's a shorter way to achieve the same effect, with one line:

<footer>copyright © <script>document.write((new Date()).getFullYear());</script></footer>

[This way is also more efficient, since no DOM selection is taking place].

Shrtr

Note: to read the background, and reasons for developing Shrtr for Windows Phone, see my main blog post.

Having decided to take up the DVLUP challenge (see post on my main blog), I sat down to write my URL shortening app, Shrtr.

Development environment

My first set of problems started with installing the development environment itself. WP8 SDK requires Windows 8 and higher (why W8? because Microsoft decided to take a page out of Apple's book of "Douchy tricks to drive sales of new technologies by limiting dev tools to new environments").

I already had a W8 partition on my trusty T400, which I upgraded to W8.1 Pro. (Side note: despite being over 5 years old, the Lenovo T400, with a fast SSD and 8GB of RAM, is a surprisingly snappy, reliable development machine). I installed VS 2013, but then hit the second snag: MS only allows installation of the WP emulator on processors that support a Hyper-V feature called SLAT (why? see "why W8?" above Update: I finally figured out why Hyper-V is used: the WP8 emulator is implemented as a separate virtual machine, which is very smart, and useful. However, I believe it can run on Windows 7 as well). This feature only exists in the 2 recent generation of Intel processors.  So I couldn't use an emulator in the development of the app. Luckily, I have a Lumia 620 on hand, and Visual Studio allows debugging on a device. It's a bit slower, but you get to experience the behavior of the final product earlier.

To complete the dev environment experience, I used Chocolatey (think of it as "apt-get for Windows") to install Git for Windows, and Paint.Net (which imho MS should have acquired and turned into the default Windows Paint app years ago). I also installed the latest version of Node and Node tools for VS (currently in alpha), to allow me to run both server and client.

Architecture

By design, the app allows you to type or paste a proper URL, select one of (currently 6 supported) shortening services, and get back a short URL. You will then be able to email/share/copy-paste the short URL, from within the app.

Most online shortening services have (some sort of) an API. It can be RESTful, or just a URL you GET or POST the long URL to. Some require that the long URL start with a protocol ('http'), some don't. Some require a developer key, some don't care. Some support custom ("vanity") URLs, and some don't.
I built an abstraction round the actual API calls, that externalizes a simple call, specifying service name, and long URL as parameters. This way I could easily add new shortening services with few parameters (URL, API method, how to parse the reply, key, should the URL start with protocol?).

Since I intended to add more features later (if anyone will be interested in the app), I immediately saw the need to break the app to a server and client components.

Client

The first version to Shrtr was a Phonegap cross-platform app, written entirely in JavaScript. It ran well on Android and iOS, so I downloaded the WP8 Phonegap template for VS, and attempted to copy-paste in my app. Despite claims of Phonegap working transparently on WP, I ran into several issues:

1. Phonegap events are not completely supported on WP, breaking my code. Yes, there are workarounds, but I was hoping to having to deal with as few code changes as possible.
2. The design that looks great on iOS and Android (Webkit-based browsers) just breaks on mobile IE.
3. I ran into some cross-domain AJAX call issues.

My second attempt was to try the Javascript WP8 template provided in VS, and just shoe in the app logic. Things ran aground pretty quickly. Around that time I came to the realization (see Architecture) that the logic will be broken out to a server, so my third attempt at the app was to use the default WP8 template. I haven't touched XAML in a long while (since my happy .Net days in 2011), but returning to C# was easy, and VS is a helpful, rewarding dev environment.

Visual Studio now comes with NuGet built in. Think of NuGet like Node's NPM for VS. It easily installs installation external components and libraries from a repository, extending your project and development experience. I used it to install RestSharp - for easy consumption of my REST service, and Windows Phone Toolkit - added several phone controls, such as a versatile list control, and a highly configurable textbox. 

UI

Visual design of UI has never been my strong suite, so my single screen still looks like "My FIRST XAML", but it's functional, and it works (btw, if you think you can help me make it look nicer, please drop me a note or comment). 

Logic

After finishing the UI and tying all the events to their respective handlers, I wrote a couple of classes encapsulating the calls to the backend service, the service request and response, and used RestSharp to serialize/deserialize the request and response. Once you grasp the async calls Lambda syntax, it becomes easy to write and handle the service calls. And RestSharp makes reading/writing JSON a snap.

The app has basically 2 calls to the server:

1. Get a list of shortening services to show in the services list.
2. Shorten a provided URL, using a specified service.

Flow

You type/paste the long URL into the textbox. The length limit is displayed in the bottom right. You can select the service from the list control, or reuse the one you've selected before. You submit the call by hitting the little scissors on the right, or hitting Enter on the keyboard. Selecting a different service will resubmit the existing URL to the new service.

The short URL is displayed in a simple textbox. The app then uses the AppBar to expose the available actions the user can take with the shortened URL, using standard phone tasks.

I then added some local settings to allow saving the last service you've used for the next time. I may add some functionality around saving all the URL history - if anyone asks for it.

Server

My last 2 major projects were written in Node.js, using the Express framework, and I saw no reason to change a winning horse. Furthermore, since the logic for my original Phonegap app was written as Javascript classes, it was fairly easy to move them to server side code, without to many changes.

The server exports a RESTful service, accepting and returning JSON. It exposes 3 methods:

1. A list of services supported.
2. The shortening function, accepting service name and long URL.
3. A ping service - allowing to check if the service is up.

I used the local Node server to test my app and debug on both ends. Chrome developer Tools is your friend here.

To quickly deploy and test a Node server, I use Heroku. After a short installation of their command line tool, provisioning the server is one line, and deploying is a mere git push command. I'm considering trying Microsoft Azure for my next project, but have yet to find out how to use it for free :).

After that, I added an index page, for people who just drop by, with links to the app. And yes, my HTML/CSS can stand some face lifting as well :).

Publishing the app

Publishing the app was rather easy. First, you need a developer account with Microsoft (which I got for free for a year - you can get it pretty easily, from either MS or Nokia). 

Clean your app from unnecessary resources. Fill the manifest XML correctly, making sure you pick up the right permissions - I only needed the ability to connect to network. 

Then, log into your developer account, upload the xap, fill in the data, make the right choices (supported sizes, languages and countries; good description of your app; good category), upload a couple of screen shots (easily taken on the device), and... wait. And wait. And wait for Microsoft to qualify your app. Since my app is quite simple, it went through certification the first time - your milage may vary.

After my app was published in the store, I had to "introduce" it to my Nokia DVLUP account, which took a couple more days. But eventually, I got the XP points for the challenge, and my award device is on its way!

Next steps

Since the logic now completely resides on the server side, I can add more shortening services at will, and I can add more clients. In fact, I did. 

Right now there's a Chrome extension in the Chrome web store, and in my free time (yeah right :)), I'm working on an Android app.

I'm hoping I can solicit some help in the UI department, that will make the app shine. But either way, I learned how to develop and publish a WP8 app the hard way, so the next one would be a snap.

Download links

1. Web site
2. Windows Phone 8 app
3. Chrome extension

What's My IP?

Why do you need/want to know your IP?

The links to all the code and tools used in this article are provided at the bottom.
I travel a lot, and even when I don't, I access the internet from various locations. Other than the varying bandwidths and limitations, there are adverse side effects to having a certain IP over another:

1. Certain countries block access to certain content based on your geolocation - try accessing Hulu abroad, or BBC content in the US.
2. Some information is blocked based on geographical location - even in the US. Some live streaming channels (like CNN) demand that you identify your local cable provider, in order to watch live TV.
3. Some web sites completely change the user experience based on the perceived user location. Try going to Google.com from abroad, and by default you'll get a local version of the search site.

As a developer, it's important to me to know what's my IP, and where does a web site thinks I am. The problem is your laptop/device can only show your internal IP - the one allocated to you by your router or switch. To get your external IP, you need to access an external resource and have it tell you what IP does it see.

There are tons upon tons of web sites and extensions that do this for you today (try http://www.whatismyip.org/, or even try typing "what's my ip" into google), but I, being a great wheel re-inventer, wanted to solve my problem myself, and along the way, learn some more JavaScript and new tools.

The design

In order to get your IP, you need a server side component. I decided to use Node.js, as my entire logic can be easily implemented with several lines of JavaScript code. Also, I can host my solution on Heroku for free, and Git deployment means the entire app can be deployed and updated from command line.

For the geolocation info, I used a free service from IPinfoDB. The free tier gives you access to the 'Lite' service, meaning geolocation is not accurate. Sometimes you get a different zip code, city or even state. But it was good enough for my needs and I can always upgrade to the paid service, to get more accurate results.

For the client, at first I thought I'd just use the browser, but then decided it's a good chance to revisit my Chrome extension projects, and just build an extension that consumes the data returned from the server.

The server

Writing a web server in Node.js involves 3-5 lines of code. My entire app, including calls to the IPinfoDB service, results output, and (very minor) error handling, ended up being 40 lines long, in one file. I put all the other parameters in a separate config file, for easier editing. It was then easy to create a new Heroku site, commit my pages to Git and deploy. 

I then added a 'vanity domain name', so you can check out the site at http://myip.TravelingTechGuy.com. You can just go to this link and you'd get the JSON results (again, not really accurate, since it's free), or install the extension below.

The extension

A Chrome extension is basically a web app (HTML, CSS, JavaScript, and images) + a manifest file tying it all together, into a single .zip file. But the directory structure, and the manifest file are a hassle to write, and tasks get quite repetitive. I decided to use a new tool I learned about recently, called Yeoman. 

Yeoman allows you to bootstrap web development, by using templates (generators) of the desired result, in this case a Chrome extension, and uses Grunt to automate the build process. After installing Yeoman, and the Chrome extension generator, you can kick up the process by issuing a single command line. Few questions later, an you have a skeleton of an extension, that can actually run. All you need then is to fill the JavaScript files with logic, add styles to the CSS file, and add icons/images.

Issuing a grunt command 'builds' the extension - checks the JavaScript correctness (using JSHint), minimizes files, compresses images and zips everything up to an extension ready to be deployed.

All that remains then is to upload the extension to the Chrome web store. Just go to the store, log in, and go to the developer dashboard. You'll be asked for additional information, images, screen captures etc. before you can publish your extension.

To be able to access my server form the extension, I had to add a permission to the manifest file with the exact URL I'd be calling. That allows cross-site AJAX call from the extension's code.

The only challenge I encountered when implementing the extension's logic, was the copy function, that allows copying the IP to the clipboard. Turns out you can only copy text from input elements, so I had to create one. Then, it turns out the input element has to be visible for you to be able to copy from. Since that would have meant sticking an ugly text box in my popup, I just pushed that code to a background page. Finally, you need to add a permission to the manifest for clipboard access - it's called 'clipboardWrite'.

The apps

• Server - can be accessed directly at http://myip.TravelingTechGuy.com.
• Extension - can be downloaded from the Chrome web store.

The code

• Server code can be found on GitHub at https://github.com/TravelingTechGuy/myip
• Extension code can be found at https://github.com/TravelingTechGuy/myipextension

The tools

• Node.js
• Yeoman - install using NPM (Node Package Manager)
• Yeoman Chrome Extension Generator - install using NPM
• Grunt - can be installed by Yeoman or NPM

Report the name of a JavaScript function

I do a LOT of JS development lately: straight up HTML5, PhoneGap for Android and iPhone and Node.JS on the server side. One command line I use in all environments is console.log.
console.log allows you to print out a string, a variable and even a complex object (just use JSON.stringify on it first) to the console view of:

• Developer Tools in IE8 and higher (hit F12)
• Developer Tools in Chrome (different keys for different OSs – nice, Google)
• Firebug in Firefox (install as an extension)

Since advanced JS uses a lot of event calls, anonymous functions and multiple files, it’s hard at times to figure out where things go wrong. So I’ve gotten into the habit of adding an entrance printout at the beginning of each function. But it has gotten cumbersome and annoying after a while, so I searched for a more elegant solution. I found this StackOverflow question, and based on the replies, constructed this code:

var fname = /^function\s+([^(]+)/.exec(arguments.callee.toString())[1];
console.log(fname);

Now, this looks like a cumbersome code to paste into each and every function, so I wanted to write a general funnction I can call anywhere to print the current function name. The problem is, if you put this code into a function, say reportFunctionName() and call it, you get "getFunctionName" printed out. The answer was in the same SO post:

function reportName() {
  var fname = /^function\s+([^(]+)/.exec(reportName.caller.toString())[1];
  console.log(fname);
}

Note the use of caller instead of callee. Also note both methods would not work well for anonymous functions (duh - no name -> nothing to print :)

Finally, I started using Github's Gist feature to collect all my code snippets, so you can find both code pieces mentioned here and here respectively.

Ultraviolet Pig

If you got to this post hoping to read about the “Angry Birds” sequel “Ultraviolent Pigs” – you’re in the wrong place - please go to the Rovio site.
This is just another crazy electronics project I set myself to.

It all started while I was zombie-surfing the DealExtreme site. If you’re not familiar with the concept, it means browsing after 1am, no good reason other then to eke a couple of more minutes of browsing before the brain shuts down completely. Instead of muttering “brrraaaaains!” you mutter “beeedd”. Some of my best (and worst) ideas hit me during zombie surfing. But I digress.

So, as I said, while zs-ing DealExtreme, I came a cross a too-stupid-not-to-buy item: a pig LED flashlight for $0.78. And free shipping to boot! What’s the catch here, I wondered? And what the hell will I do with this useless, clearly non-kosher flashlight?

Here piggy piggy!

So I browsed further, and for $2.93 I got a bag full of ultraviolet LEDs.

Not the best UV LEDs out there - but the cheapest

After 20-25 days (hey, you 'pay' for free shipping, you get it delivered by a lame horse that has to swim across the Pacific blindfolded), I finally got an envelope containing the items.

It took less than 5 minutes to take the pig apart (please don’t ever associate this sentence with me ) and replace the 2 simple LEDs with the UV ones. And that’s when the fun starts.


Other than enabling me to see hidden marks on a $20 bills and a driver’s license, the most useful thing you can do with UV light is protect your stuff.
Do you have a favorite chair that you think gets replaced with a crappy one when you leave your desk? Did someone swipe your beloved Swingline stapler and you can’t prove it? Just mark your stuff with UV ink – completely invisible to the naked eye – but not to good ol’ Mr. UVP. Observe:



This is a simple metal mint box, easily swiped and easy to deny. But when you turn UVP on it, the truth comes to light, in 3 colors (you can also see the UV pens in the photo):



So, yes, not really practical unless you can retrieve the stolen goods, but quite good at identifying your stuff, or secretly communicating under the nose of pig-less people (think about passing notes in a boring meeting).

The stats:

• Usefulness: 3/5 stars – not that amazing, and not too techy. Not a single line of code needed
• Fun factor: 5/5. Oh yeah!
• How easy it is to build: very. Just get your pig, LEDs (you need at least 2) and follow your instincts. Or watch this youtube video where someone demonstrates how to take it apart
• Total project cost: $3.71 – and I still have about 18 LEDs waiting for the next 9 pigs

Warning: DO NOT STARE DIRECTLY INTO UV LIGHT.
Your eyes cannot see it well, hence your pupils will not shrink properly to protect them. Few minutes are OK, more is not recommended.

The 5-minutes Twilio App

This week, I interviewed for a position at Twilio. Twilio sells an API that enables your web applications and mobile app to use voice and SMS messaging capabilities. You are charged a small fee per incoming/outgoing call/message, and you get full backend support, including IVR, call statistics and the ability to reply automatically based on content and context.

The recruiter suggested I build something using the Twilio API. Since I have so many APIs running in my head these days, I was a bit hesitant at first to learn another one, especially if I didn’t see an immediate use for it. I was further less impressed by the use of XML (over JSON) in the API. But I gave it a shot, and within 5 minutes of starting I had my one (and only) Twilio API written: the SMS Calculator (no tm or c need apply). One minute after that and I had it tested. 5 minutes after twitting about it, someone asked me if he can demo my app in a code meetup. Once I said ‘yes’, my app officially became open sourced.

So, without further ado, here’s the code to my app, and the steps you need to take to create your 5-minutes Twilio app in 5 easy steps:

1. Go to twilio.com and create a free account. All you need is an email and a password.
You get free $30 on your account to use for testing. Good for 3000 SMS messages.

2. Paste the following PHP code into a text file and name it calc.php

<?php
 $body = $_REQUEST['Body'];
 $expression = explode(" ", $body, 3);
 $a = intval($expression[0]);
 $b = intval($expression[2]);
 $result = 0;
 switch($expression[1]) {
  case "+":
   $result = $a + $b;
   break;
  case "-":
   $result = $a - $b;
   break;
  case "*":
   $result = $a * $b;
   break;
  case "/":
   if($b != 0)
    $result = $a / $b;
   else
    $result = "Division by 0";
   break;
  default:
   $result = "ERROR";
   break;
 }
 $reply = "You asked: $body. The reply is: $result";
 header("content-type: text/xml");
 echo "<?xml version=\"1.0\" encoding=\"UTF-8\"?>\n";
?>
<Response>
 <Sms><?php echo $reply ?></Sms>
</Response>

Code explanation:
This is a rudimentary, "stoopid", expression calculator. It expects an operand-space-operator-space-operand syntax (i.e. 2 + 2), does not use any regular expressions and does not check for correctness. The only error it checks for explicitly is division by 0 (and that was added only because I had points deducted for a similar exercise years ago by an evil TA).

• We get the SMS body in the $_REQUEST[‘Body’] HTTP variable.
  
• We proceed to split that string, using space as a delimiter. I limit the split to 3 strings.
  
• We parse the 2 expected integers
  
• We attempt to parse the operand (only the main 4 are supported)
  
• We calculate the result and compose the reply. I could probably use more string tricks here, but what’s the use?
  
• Finally, we compose the SMS XML that Twilio expects and output it.
  

3. Put the page on a web server that supports PHP. There are plenty of free hosting choices if you don’t have one ready (off the top of my head, try Zymic)

4. In your Twilio account page, scroll down to the section “Developer Tools”. Input the full path to the calc.php page in the “SMS URL” field, and notice the phone number and PIN you were allocated.



At this point you’re actually done. Step 5 is the testing.

5. Using your phone, send an SMS message to the phone number. Start by putting in your PIN number (only required with test accounts) and then add an expression. It should look like:

xxxx-xxxx
25 / 5

You should receive an immediate reply, echoing the given expression and the result. For the full free experience, test using your Google Voice account. Google provides free SMS texts in the US and Canada, and the Twilio number is a US one.

I will certainly keep Twilio in mind for future uses in my apps, but as for now, I'm just happy that it took me longer to write this post than to write the code.

My next step: slapping an Eliza or an 8-ball app at the end of this :)

Update:

Andrew Watson from Twilio asked to borrow my sample for his presentation. Here's a link to the Google Doc Andrew has published. Thanks Andrew!

Oh, and it seems like I won't be working for Twilio after all, so I'm free to play with other new toys :)

Display JSON results

JSON (JavaScript Object Notation) is a great straight forward way to transfer information from one application/server to another. It's string-based, array-oriented, and does not carry with it the redundancy of XML or (shudder) SOAP. And the best feature in a web application: it's immediately transferable to a JavaScript object, without the need for (an explicit) parsing.

Add to the mix jQuery - a JavaScript framework that makes using JavaScript and writing dynamic web pages a snap. Once I picked it up, I couldn't go back. jQuery is now embraced by many - including Microsoft and Google, who include it in their default web templates, and provide hosted CDN versions of its latest versions.

jQuery shines when it comes to AJAX transactions - you can get a JSON result from a web service using one instruction! Going over the reply is also a snatch. I found myself many times just needing to dump the results on the page - either for debugging purposes, or so I could copy/paste them somewhere.

Here is a short code snippet that I use to get a JSON result from a local web service (a remote request requires JSONP - future post), and dumps the results in a form of a list. It assumes a single-level array reply and that you have a <DIV> element on the page called "result":

Explanation:

1. Line 1 includes version 1.5.2 of jQuery from the Microsoft CDN
2. Line 4 will make sure the function will run when the document has been fully loaded and drawn
3. Line 5 calls the JSON service and sends the results to a function
4. Line 8 iterates over the result object and creates an array of <LI> elements
5. Line 14 creates a new <UL> element, applies a CSS style to it, attaches the <LI> elements and places it inside the result <DIV>

That simple!

Netduino Project 2: Morsey

As discussed in my last post, I've created a small test app called Morsey to practice my LED lighting skills on the Netduino.

The functionality is simple: the application takes a constant English string and turns it into a string of dashes and dots, signaled by the LED. The signaling is started/stopped by clicking the on board button.

The code:
There are 3 code files:

1. The main program file, that runs the main thread and the Morse thread, as well as the button event.
   

   static void button_OnInterrupt(uint data1, uint data2, DateTime time)
   {
    bool isButtonDown = (data2 != 0);
    if (isButtonDown)
    {
     displayMessage = !displayMessage;
    }
    
    if (displayMessage)
    {
     if(morseThread.ThreadState == ThreadState.Unstarted)
      morseThread.Start();
     else
      morseThread.Resume();
    }
    else 
    {
     morseThread.Suspend();
     led.Off(); 
    }
   }
   

2. The MorseCharacters class. I copied the 2 Morse arrays from Scott Hanselman's great Netduino post (sorry Scott, just lazy and it's faster to C&P than to type all those dashes and dots :)).
3. The LED class - the same one I used in the TrafficLight project, with the addition of a single function:
   

   public void WriteMorse(String message) 
   {
    MorseCharacters converter = new MorseCharacters();
    String morseMessage = converter.ConvertMessageToMorse(message);
    if (morseMessage != String.Empty)
    {
     foreach (char c in morseMessage)
     {
      switch (c)
      {
       case '.':
        Dot();
        break;
       case '-':
        Dash();
        break;
       case ' ':
        //delay for twice the character gap between words
        Thread.Sleep(delay * 2); 
        break;
       default:    //handle errors here
        break;
      }
     }
    }
   }
   

To get the full code, clone the git at https://github.com/TravelingTechGuy/Morsey

1st Netduino Project: Traffic Light

While I'm dabbling in HTML5, iPhone and Android projects at this particular point in time, I chose to open this blog with a project I'm passionate about. I've been following the Arduino revolution for years now, but always from a far. Although I have some electronics background in my ancient past (try: middle school electronics kits), I see myself a s a software professional. Having had the distinct "pleasure" of working in assembler, I decided that's as close I'd ever get to speaking to real hardware.

And then I found out about the Microsoft .Net micro framework. It seems I can take my .Net skills and transfer them to the hardware world! I can make LED lights turn on and off! I can react to button clicks rather than keyboard and mouse events! But on a more serious note, I can implement a standalone web server that allows me to perform operations remotely. I can read/write to an SD card. I can control a vast collection of electronic components and analyze information from a myriad of sensors. All this with a very small upfront investment. I'm in.

What do you need:

1. An arduino board that supports the .Net micro framework. There are several out there, but I chose the Netduino Plus. At $60 it provides an Ethernet port and a microSD card reader on board, saving you the need to wire those later. I got it off Amazon, along with the breadboard (see 3).
2. Free software: SDK and drivers (most software associated with Arduino is open source, even (shock!) the .Net micro framework from Microsoft. This page has a full list of what you'll need, including a good installation guide that will take you through installing, writing your first program and debugging it. 
3. To develop software you use Visual Studio (you can use the free Visual C# Express version). 
4. Some cheap components. I got a mini breadboard for $3. A breadboard allows you to play with circuits and components without the need to solder anything. There are no mistakes and most components are tolerant with the involved voltages. Heck, I found out that one of the LEDs I got was dual-colored - you get a different color if you plug it in the other way. That was a nice surprise.
   I also got a couple of wires and color LEDs from my local FRY's (at $0.49 each - you can get them at $5/40 - I just didn't need that many).
5. Plenty of internet reading: instructions, projects, suggestions. I enrolled in the Netduino forums and have been so far assisted with some issues. Every one there is enthusiastic and helpful. All are hobbyists - none are trolls.
6. A free weekend.

Later on you may want to buy more components, like shields (Arduino add-on boards) sensors (light, touch, accelerometers), wireless network adapter (like XBee), LCD screens, joysticks - whatever.
My recommendation is: even though the components are relatively cheap (with the exception of XBee and a GPS shield, they are almost always below $20, most are even cheaper), avoid buying them until you feel sure you've grasped the basics and are ready to proceed.

Programming:
The "Hello, World" project of  the Arduino world is called "Blinky". You get to blink the on-board LED, and later read the on-board button to control the LED.

Visual Studio automates the deployment of  allows you to do a step-by-step debugging on the device. This is an amazing way to develop for hardware. Of course, you get the assortment of tools you're already used to as a .Net developer.

I asked myself what can I do with an LED, and came out with the done-to-death idea of a Morse code Signal Emitter (I called it "Morsey"). You feed it an English string and it yields a string of dashes and dots using the LED. The next step was to use the button to start/stop the signaling. And then came the notion of using a separate thread to be able to pause and resume the signaling - in short, I spent time honing my skills, such as they are, preparing for more complex projects.

Traffic Light project:
But before I was ready to move on to my next project, which will involve an LCD display ($10 on Amazon), I decided to test my breadboard skills and developed this small project called "Traffic Light".

Made of one tiny breadboard, 3 colored LEDs, 7 wires and about 40 lines of code, it simulates a traffic light's color change, using a separate thread, and the LED class I carried over from "Morsey".

You can see the end result in this video and I should really start to remember not to talk while zooming with this camera - it records the zoom noise over your voice):



I found a nice (free) application called Fritzing that allowed me to design my circuit design and share it with other hobbyists. Here's what the above circuit looks as a Fritzing design:

And Fritzing automatically turns it into a schema you can use to share with electronics professionals, using standard conventions. Just in case you'd like to mass-produce your project one day:

If you want to get the full code, including these images and the Fritzing file, just git it here: https://github.com/TravelingTechGuy/TrafficLight.

And yes, I wrote "Git", not "get". If you don't know what Git is, or how to use it, the page also provides a zip download, but you better get used to it, as I'm going to use github to share all my code on this blog (and thanks to Jason for introducing me to git in the first place).

Well, this is done, on to the next project.