Scott Hanselman

Jeff had a blog post yesterday (seems everything he writes in his retirement gets on Hacker News as well) about reading source code. While Jeff's post is largely a pull-quote of a post on Hacker News by Brandon Bloom, one bit stuck out to me as I'm sure it did to others.

"The idea that you'd settle down in a deep leather chair with your smoking jacket and a snifter of brandy for a fine evening of reading through someone else's code is absurd." - Jeff Atwood.

Absurd? Hardly. Nearly every programmer I've ever spoken to enjoys reading and discovering new code. I've been advocating that Developers need to read as much code as they write for at least half the time I've been blogging (10 years now, as of yesterday.) How could you not be excited about reading source with all the wonderful open source that's available in the world today?

In fact I have an entire category of my blog called the "Weekly Source Code" with 58 different specific entries at last code. That's 58 different great opportunities to read and learn from another programmer, some good some bad.

The idea that reading source code is absurd is really the wrong message to send. Here's a list of interesting books about source and source code that I'd recommend you settle down in your leather chair, stoke the fire and read.

• Beautiful Code: Leading Programmers Explain How They Think (Theory in Practice (O'Reilly)) - The new classic. One chapter, one developer, and one famous program or problem. The chapter on a tiny regular expression parser is worth the price of the book.
• Computers & Typesetting, Volume B: TeX: The Program - I've only read about 1/3 of this in uni in the library. It's pretty heady stuff but a fascinating look into the algorithms that a practical genius uses to set type.
• Design Patterns: Elements of Reusable Object-Oriented Software - A classic of the 90's, this book includes stories and examples from four professional programmers presented as a series of 23 patterns for creating Object Oriented software.
• Operating Systems Design and Implementation (3rd Edition) - The original "Minix" book that taught me all about *nix systems in a tiny way in college. Much easier to jump into than the full Linux source code and even easier today with the advent of Virtual Machines. One of our homework assignments was to write a new file system driver. The version I had even had the complete system source code in the back of the book!
• Programming Pearls (2nd Edition) - Love love love this book. Practical low level discrete and brilliant examples of how smart people solve hard programs. This book is actually in my bathroom which is high praise, in fact.
• Case Studies in Common Lisp - Free and online, this 1992 book includes not only an intro to Common Lisp but also great examples and lots of code.
• Artificial Intelligence: A Modern Approach - I try to read this book (lots available online) every two or three years but I'm not smart enough to handle it. But I'm going to keep trying.

Of course, you don't need to buy any of these books or pay for anything. Just read code. Read your coworkers code, your company's code, your favorite open source library's code. Don't stop reading code.

The Weekly Source Code was weekly but then become "whenever I get the time." Because of Jeff's article I'm going to get a smoking jacket and brandy snifter and start doing new Weekly Source Code posts every week. Ok, it will be a Code Zero snifter but you get the idea. Because you can't be a good writer coder if you aren't a good reader.

About Scott

Scott Hanselman is a former professor, former Chief Architect in finance, now speaker, consultant, father, diabetic, and Microsoft employee. He is a failed stand-up comic, a cornrower, and a book author.

About   Newsletter

Hosting By

I wanted to work through a new tutorial by former Microsoftie, now Googler Pete LePage along with Chris Wilson. They have a great lab called "WReader" that uses Ember, HTML5 Boilerplate, Moment.js, Bootstrap CSS and LawnChair.js that builds a single page JavaScript application over 12 exercises.

A few weeks ago a non-Microsoft developer saw a post I did on some new HTML5, CSS3 and JavaScript features in VS11 and mentioned he might want to use it over Dreamweaver. I thought that was cool because some client-side developers think VS is all server-side and too "industrial strength."

I wanted to see if VS11 Express Web (the free version) would work well for "front end" web development. This lab that Pete made is all client-side. It doesn't use ASP.NET or anything server-side that Visual Studio is typically built for. However, a lot of work has been done in Visual Studio lately to make web development easier and I wanted to see if it stood up, even when doing all client-side HTML/CSS/JS.

I downloaded Pete's Lab, opened Visual Studio and when Open Web Site and opened the first Exercise's folder.

I right-clicked on Index.html and set it as the Startup Page for my project. You can set any page you like a the startup page and they Ctrl-F5 (or a button in the toolbar) will launch the browser without server-side debugging.

At the end of Exercise 2 you will have dynamically created feed items and bound them with a client-side template. Here's a screenshot of what that looks like.

While I was typing up this exercise there were a few nice things about VS that made the experience pleasant. The JavaScript editor in VS11 is greatly improved and is actually running the JavaScript in the background as you are running it, so the intellisense autocomplete help is very useful, especially for a JavaScript newbie. It doesn't get everything, but it's VERY smart.

There are times when you're working in a JavaScript file that needs to know about objects in another file but the editor can't figure it out. You can add a "hint" or reference so Visual Studio can be smarter for you.

For example, I was using this Ember.js object and wasn't getting any help so intellisense just added all the info that it had.

You can drag a file from the Solution Explorer into your JavaScript file to make a comment that acts as a reference/hint to Visual Studio like this: /// <reference path="libs/ember-0.9.5.js" />. You can see the results below.

If adding that line bugs you, you can put all your references in a _references.js file and never look at it.

This was helpful to me when I got to adding moment.js as I could see what methods my Date had available:

Later in Exercise 2 I make a client-side JavaScript template like this with "mustache/handlebar style" expressions like {{ }}:

<section class="mainContent">
  <section class="summaries">
      <script type="text/x-handlebars">
      {{#each WReader.dataController}}
          {{#view WReader.SummaryListView contentBinding="this"}}
              {{content.title}} from {{content.pub_name}} on {{content.pub_date}}
          {{/view}}
      {{/each}}
      </script>
  </section>
</section>

However, Visual Studio syntax highlighting didn't look useful/pretty to me. This seemed like an opportunity to make it better.

I mentioned in an earlier post that we have the ability now to update the web editors (HTML, CSS, and JS) easier and more often now as the editors bits are implemented as extensions themselves. I asked the owner Mads Kristensen to prototype what "mustache" template syntax highlighting could/might/would look like if we did it. We'd want all the general templating libraries to work, like Mustache, HandleBars, JsRender, and others, even if templating as a concept changes or disappears.

Here's some of the prototype work he did tonight. This would make my client-side experience just a little nicer. These are screenshots of the private build he is messing with and he's trying different colors.

I like this one the best. I'm not digging the yellow. I like this more subtle approach.

I was testing this lab on multiple browsers and switching back and forth between the Chrome Developer Tools and the Internet Explorer Developers Tools (F12). There's a nice feature in Visual Studio 11 that lets you quickly run your project in different browsers with this dropdown:

But sometimes you want to run multiple browsers at the same time. There's a little known feature (I'm working with the team on making this more discoverable) where you can right-click on an HTML file and click Browse With, then "Ctrl-Select" multiple browsers:

If you click Set as Default while there are multiple browsers selected it will change your toolbar and menu to say "Multiple Browsers." CTRL-F5 will then launch more than one browser at the same time.

The UI is a little rough now but it's being improved. It's a really nice little feature and a time saver!

Later in the tutorial Pete includes the Twitter Bootstrap CSS and I wanted to change some of the default colors. You can click a color in the CSS editor and edit it interactively like this. It even does opacity.

I encourage you to go check out Pete's tutorial if you're interested in learning more about JavaScript, HTML5, Ember.js (and frameworks like it) and this emerging style of web development.

Related Links

• Download VS11 Express for Web Beta Free
• Pete LePage's Web App Code Lab
• HTML5 Boiler Plate
• Ember.js
• Moment.js
• Bootstrap CSS Framework
• LawnChair.js

About Scott

Scott Hanselman is a former professor, former Chief Architect in finance, now speaker, consultant, father, diabetic, and Microsoft employee. He is a failed stand-up comic, a cornrower, and a book author.

About   Newsletter

Hosting By

My wife is quite a bit smarter than I am. She is also more educated that I am. Frankly, I'm happy she talks to me at all.

She put a photo on Facebook last week of she and a friend and was careful to double-check that the photo was set to "Friends only."

A few days later she rushed in and told me that she thought the photo was public even though it was set as Friends only.

"Why?"

"Because random people that I don't know are commented on this photo! Like, who is this guy? I don't want him to see this - I don't know him! Why did they let non-friends see it?"

I looked for a minute and noticed that she had "tagged" her other friend in the photo as in this example photo below:

In this photo there are four people tagged. When you tag someone they are notified that they've been tagged and they can remove the tag which removes it from their "photos of me" list. The photo above is totally public but let's say it was posted by me and I tagged my three friends and marked as "friends only."

Who can see the photo of me and my 3 friends? Who can see the photo of my wife and her friend when the photo is marked Friends?

Answer: The union of all the friends of everyone tagged in the photo. If someone else sees the photo and tags some more people, the circle of visibility for that photo or post expands.

This may seem obvious to a software engineer or someone with a background in set theory but it's not obvious even to smart regular folks. It certainly surprised my wife although she gets it now. Here's the thing, though. Now she says she really is less likely to put photos on Facebook and certainly less likely to tag folks in photos.

Confused a little? There's more. Recently my programmer man crush and favorite Canadian Reginald Braithwaite wrote a post called When you share personal data with Facebook friends, you're sharing your personal data with every app your friends use. Read that title again.

Remember that when you aren't paying for something (like Facebook), someone is paying. The advertisers are paying and you, your friends and all your info are the product.

Reginald points out that when you grant an application (Farmville, etc) in Facebook access to your profile you are often granting that application access to your friends personal information. That means that your annoying friend who is always pushing the Mob Wars invites has likely granted an application access to your information by proxy.

UPDATE: When you are sharing something note that you can pull down the privacy dropdown, select custom and make changes then hover your mouse over the gear to get a plain English tooltip showing the resulting visibility of this update:

Your Homework - and pass it on

Go log into Facebook and in the upper right corner click Privacy Settings:

Then, spend some time in these two areas of Settings. Timeline and Tagging and Apps and Websites.

Under tagging you can choose what happens when someone tags you and tags that friends add to your own posts or photos. You can also control tag suggestions. You can lock this down as much as you want.

Next, click on Apps and Websites and freak out when you see how many you (or your teen) has added. You can remove them as you like. Most importantly, click on "How people bring your info into apps they use."

How much of this info to you want your friends sharing with their applications? Turn this stuff off.

And finally, check out the Public Search option. Do you want Facebook and your public timeline to show up when someone Googles for you  or your child? If not, turn this OFF.

You can also go back in time and "limit old posts." This will take posts from years ago when you didn't know this information and make them visible to friends only.

Facebook will likely try to talk you out of it. Use your judgment.

Now, for a fun over-dinner exercise try explaining this to your 14 year old and why everyone should be careful about information leakage. Seriously. At least try.

About Scott

Scott Hanselman is a former professor, former Chief Architect in finance, now speaker, consultant, father, diabetic, and Microsoft employee. He is a failed stand-up comic, a cornrower, and a book author.

About   Newsletter

Hosting By

It's getting to the point where there are so many cool open source projects that I can't keep up. When you add in the currently battle royale of JavaScript projects that are basically just hip sounding words with ".js" added to the end, it's a little overwhelming. Seriously, just pick a word out of the dictionary at random and that's the name of an up and coming JavaScript library.

JavaScript MVC Frameworks and Libraries

This is an area that is very interesting but also very not-yet-baked. In the DOM manipulation and CSS selector space, jQuery won. That fight is over. The next big question is client side MVC frameworks. It seems everyone wants to make the next "Rails" framework on JavaScript and while there are some contenders, there's still lots of room for someone to "win."

DOM manipulation libraries like jQuery are important, but it's clear that making large and rich web applications requires more than just jQuery. More and more applications want smart asynchrony and dynamic loading.

(Reminder: All this IS overwhelming. That doesn't mean you need to know all these frameworks or feel bad that you don't know them all. Just accept that you DON'T know them all. Be OK with that.)

Here's the major players and ones you might want to be familiar with. Remember, these are client side libraries and while they often mention server-side frameworks like node or rails, these are things written in JavaScript that anyone can use.

• Ember.js - Attempts to remove tedious boilerplate code. Includes a templating engine (no one will agree on just one), encourages an architecture where the browser does most of the work, supports state-management out of the box. Focus on computed properties, and templates that update themselves.
• Underscore .js - A library of more than 60 functions to make JavaScript more fun and easier to use. Provides a layer that will use a modern browser's native implementation of a method while still supporting older browsers. Has iterators like each, map, reduce, etc. In a way, it's like LINQ for JavaScript.
• JavaScriptMVC - A jQuery-friendly framework that adds functional testing, MVC plugins, documentation generation, dependancy management and build tools.
• Spine.js - Seems like less than a Backbone (these libraries all play with each other's names). Introduces models and controllers, but for views, requires you use your own template engine. Intends to be super lightweight.
• Backbone.js - Everyone loves Backbone. It's the one you'll hear about the most. There's a large community supporting it. Folks have said that large applications can get a little hairy and difficult to manage, though. Lots of great docs and examples.
• Knockout.js - MVVM on the client rather than MVC. Lots of interesting client-side data-bind expressions. Rich documentation.
  • And, wait for it, Knockback.js, a library that bridges the gaps between Knockout and Backbone and encourages you to use both effectively.
• Sammy.js - A very small core library that brings in other adapters and plugins to give you just the parts you need. Focused on developer happiness. Works well with apps that are sitting on top of RESTful JSON server sides.
• Angular.js - Includes templates, two-way data-binding and MVC, again, all on the client. Very small and starting to make a splash.
• SproutCore - SproutCore seems to be very complete and more prescriptive than other frameworks. It also has a focus on making apps on tablets and other devices. The NPR for Chrome app used them.
• Cappuccino - If you like and think in Objective-C, you'll like Cappuccino and Objective-J. Cappuccino is kinda of Cocoa (Mac APIs) for the web.
• Google Closure - Almost doesn't belong in the list as it's a very complete toolkit with a whole worldview, rich library, templates, and lots of extras. You can choose how much you want to embrace, though.
• ExtJS4 - This is a Sencha product and now on its fourth major release. It includes not only a framework and architecture but also widgets and charts.
• PureMVC - Another MVC on the client side implementation, but this one was ported from ActionScript. It was originally used on Adobe Air and the like.
• Batman.js - Bonus points for the best name. Explicitly embraces CoffeeScript as well as JavaScript. Only 2000 lines and very few extras. Very Rails friendly, prescriptive without being oppressive.
• Require.js - A JavaScript file and module loader.
• PrefixFree.js - A nice library that expands all your CSS to use the explosion of vendor prefixes correctly.
• Lawnchair.js - Client-side storage and persistence. Less than a couch, but smaller and outside.
• Mustache - Templates for views, explicitly without logic.

var view = {
  title: "Joe",
  calc: function () {
    return 2 + 4;
  }
};

var output = Mustache.render("{{title}} spends {{calc}}", view);

• Handlebars.js - An superset of the Mustache template concept with extra features. A fancier mustache. Ahem, "Handlebar Mustache."

Also checkout Gordon Hempton's excellent "consumer reports" table on his blog that covers which JavaScript frameworks support which features.

ASP.NET Libraries, Frameworks and Open Source Projects

You may have heard that ASP.NET MVC 4, ASP.NET Web API and ASP.NET Web Pages v2 (Razor) are all now open source with contributions. They are up on CodePlex using Git. I thought I'd mention some interesting ASP.NET/CLR server side libraries here also as that's the area I work in.  There are thousands of Open Source projects in the .NET space, but I wanted to take a moment and feature these as they are all related and all emerging.

Just like the JavaScript projects above, these .NET projects are all trying to innovate...trying to make something new and modern and compelling without sacrificing the good things about the past.

• OWIN - This is the "open web interface for .net." It represents the "spec" of the web app function signature. It serves the same purpose as Rack spec on Ruby or WSGI on Python. "The goal of the OWIN interface is to decouple server and application, encourage the development of simple modules for .NET web development, and, by being an open standard, stimulate the open source ecosystem of .NET web development tools."
• Gate - An OWIN Reference implementation of utilities, host handlers, and web framework adapters for OWIN. This is essentially glue code, with things like Gate.Hosts.Kayak.dll on one hand, and Gate.Adapters.Nancy.dll on the other, to fit together your stack, e.g. "Kayak->Owin->Nancy"
• Nancy - A "Sinatra" inspired framework. "Nancy is a lightweight, low-ceremony, framework for building HTTP based services on .Net and Mono. The goal of the framework is to stay out of the way as much as possible and provide a super-duper-happy-path to all interactions."
• Kayak - A 100% C# HTTP Server assembly that can be embedded in your project. "Kayak is an asynchronous HTTP server written in C#. It has been designed to be easy to embed into a variety of applications. Kayak natively supports the OWIN 1.0 Draft specification."
• Firefly - Another 100% C# HTTP server assembly.
• Manos - A 100% C# HTTP server in an assembly that is a part of a larger Manos web server + web framework bundle.
  (web frameworks with owin adapters:)
• AspNetWebApi - A framework optimized for HTTP APIs and services. Part of the open source ASP.NET Web Stack.
• SignalR -  A socket.io-like message bus that supports realtime communication over Web Sockets, long polling, forever frame, or server sent events. JavaScript and Server-side components.
• Fubu - A MVC-inspired framework with the beginnings of some OWIN support.
• OpenRasta - A development framework for building web-based applications and services. Focused on being RESTful.

There is no question that I've missed some. Leave them in the comments and I'll keep this post updated. Projects for this list should be of some renown and be pushing the envelope in some notable way.

Big thanks to Louis DeJardin for his help and bootstrapping the list.

About Scott

Scott Hanselman is a former professor, former Chief Architect in finance, now speaker, consultant, father, diabetic, and Microsoft employee. He is a failed stand-up comic, a cornrower, and a book author.

About   Newsletter

Hosting By

There are few things sadder than the software that ships with your car's in dash computer. it's 2012 and we have hybrids that can regenerate power from inertia but the car manufacturers haven't figured out that we just want the in-dash car screen to be powered by our smartphone. Sure, there's a few products in the space like the hobbyist-grade "Mimics" from MP3Car and some weird hybrids like AppRadio from Pioneer but they are all aftermarket and a little Frankenstein's Monster.

The Toyota Prius V that we just bought comes with a system called Entune. This is a little computer in the dash itself that includes Applications (yes, applications) like Bing Search, Pandora, Traffic and others. I've got a dual-core internet connected super-computer in my pocket and you can get one yourself for $99 at AT&T but my new car includes an underpowered, low-resolution, low-memory tiny computer of its own. It would have made far too much sense for them to spend the money on an awesome 6" or 7" screen that mirrored the phone.

Think about this. My car has Pandora. Yay, right?

To use Pandora on my new car I have to:

• Register for an Entune account at http://myentune.com - This is a required step.
• Link my existing Pandora account with my Entune account. Note that this can't be done on your phone. Gotta use a PC. Didn't work on the iPad either.
• Pair my phone with my car using Bluetooth.
• Have a phone that supports Tethering via Bluetooth
• Pay for a tethering account from my phone provider (Personal Hotspot from AT&T, for example)
• Perform a second pairing to authorize the car to use my phone for Internet
• Enter my Entune password into my car using their touch screen. It then uses my phone to talk to Entune (I hope it's using SSL!)
• Run Pandora on my car which uses Bluetooth to my phone over tethering which uses 3G/4G to talk to the internet.
• Send a check to Rube Goldberg to pay for royalties given this is a complete rip-off of his best contraptions.

Seriously friends, drink that in for a moment. My car has a crappy computer that runs a version of Pandora that talks to my phone to use its internet to get music from Pandora.

Here's a thought. Why don't I just run Pandora on my phone?

Do you think that my car will ever get a new version of Pandora? Do I need to get on the app update treadmill with my car's appstore?

Well, let's see. The Entune FAQ says that I should "check back often for updates."

Anytme a website says "check back often for updates" you're GUARANTEED it's a dead website and a dead product.

— Scott Hanselman (@shanselman) April 10, 2012

Check back often for updates? Ok, so the answer is NO. This Pandora application will never be updated, ever. I have a pale shadow of a tablet PC in my new car that requires tethering from my super-powered and often updated internet connected phone with a thriving app store. It would have made far too much sense to use the phone as the heart of this system.

In ten years my car will still be running. AOL was hot 10 years ago. Will Pandora even exist in 10 years?

Will Toyota put out a user-serviceable update to my car's system to remove the Pandora icon or will it remain on my dash for eternity, a lonely symbol of a dead company reminding me each ignition of a bubble long past?

The phone connectivity ecosystem is so messy right now that there are actually wizards to walk you through the complexities. Toyota's Connect site will show you which of the 150 features their in-dash Entune system will support given your phone and car and phone carrier. We're doing Cartesian products here to find out if I can listen to streaming audio?

Here's the final irony. I have the latest and greatest and fanciest fruit-based smartphone with the latest hardware and software. It doesn't support 30% of the things my car does. In fact, no phone does. I was thrilled to see that the car supports text messaging, a sync'ed calendar and more (when stopped.) Does my phone support that? No. A Blackberry does though. And I'm sure they'll be around in the future.

May I just point out, as a final hilarious indignity that this system has won awards?

I know this is ranty and if you worked on this system and show up in the comments, forgive me. I'm not trying to pick on the trench developers of these things but rather the architects/designers/planners. I wish they'd show some foresight and create future-proofed systems that use and embrace open specs and protocols. VNC anyone? The fact that I can place calls and stream Bluetooth audio in this car is great. But it'd be nice if with all this dancing back and forth and tethering and pairing that the maps and navigation would just use Google or Bing maps for always updated high-res, high quality maps. Do they? Nope, that would make too much sense.

About Scott

Scott Hanselman is a former professor, former Chief Architect in finance, now speaker, consultant, father, diabetic, and Microsoft employee. He is a failed stand-up comic, a cornrower, and a book author.

About   Newsletter

Hosting By