Sample Browser App for the All-In-One Code Framework

As I’m taking a break to wind down a bit before tonight’s adventures, I figured I should tell you guys about the Sample Browser app in the Windows Store.  (Sorry, guys – no Windows Phone app yet.)

This was the app you mentioned briefly at the end of your last post, right?

Yep!  Once you install the “Sample Browser” app from the Windows Store to your Windows 8 device, you can access the All-In-One Code repository browser data.  Here’s the opening screen:

OneCodeRTMain

 

 

Ooh!  Shiny! Wait… that looks similar to the app from the last post.

Very observant!  Sometimes, the Microsofties understand this concept called consistency.  It’ll work wonders here.

Okay…. let’s go on an adventure. Let’s say I want to see some ASP.NET stuff.

See that ASP.NET tile under Web Samples?  Click that tile, and you should see something like this:

OneCodeRTASPNET

 

There are plenty of ASP.NET code samples to peek at.  I’m going to click on the web chat program that the All-In-One Code Framework team wrote.  This will take us into the project view:

OneCodeRTWebChat

 

All the data… what do I see?

This details page shows a lot of details, including:

  • Name of the project
  • Link to the project
  • The ability to browse the project document
  • The ability to download the code
  • Relevant technologies
  • License
  • Visual Studio support
  • Author/last updated/ratings/download count metadata

Okay… so I clicked the Download button, as I want to have the C# sample on hand.

Did you notice that the button changed to browse?  Now, you have this helpful code browser at your finger tips.  Navigate through the C# code and check out the syntax highlighting.

OneCodeRTBrowseCode

You can also select code and copy it to the clipboard, much like copy and paste in a lot of Metro Windows Store apps.

What if I don’t want to download the code but want to bookmark this code for later?

Come on, now!  This is a Microsoft product, which means “bookmarks” are out and “favorites” are in!  Right click in the code area to bring up the context menu bar at the bottom.  Then, click the Add Favorite button.

Okay… I downloaded this code.  I favorited this code. I like the syntax highlighting.  But how can I easily find my downloaded code or even my favorited samples?

If you go to the search screen, you’ll notice some categories at the top, including Downloaded Samples and Favorite Samples.

OneCodeRTFavoriteSamples

 

You’ve shown us what happens when there are results.  What if there aren’t any results?  

These guys have a very helpful “not found” message.  Here you go:

 

 

OneCodeRTNoResults

 

So… how did you hear about this again?

The benefits of being an MVP and finding out cool things that we’re actually allowed to talk about!

Now, if you’re on Windows 8 – go get the Sample Browser app!

If you’re on Windows 7, see my last post on how to get their app!

The One Code to Rule Them All

I’m at the Microsoft MVP Summit this week, which means that there are a lot of things I won’t be able to share due to all sorts of non-disclosure agreements, lawyers, etc.  However, there may be some cool non-NDA stuff that I’ll be able to share as well, and you can bet that if it’s that cool, then I’m telling you guys about it.

While checking out some work that MVPs and Microsoft has done, I came across this gem: Microsoft All-In-One Code Framework.

So, Sarah, what’s so cool about this?

Have you ever had a moment while coding when you wondered “How do I do {xyz}?”  Sure, you may have looked up that in your search engine of choice.  However, if you have Visual Studio 2010 or Visual Studio 2012, there’s an add-in for you that lets you search a code repository of various samples.  If you’re more of a “Let’s look at code samples and maybe get inspired” kind of person, their Sample Code Browser is a great app for that.  The VSIX for the Visual Studio extension and the ClickOnce for the app are both available from their download page.

Let me get this straight. Someone did something cool with a code repository?

Yes! Here’s a look at what I downloaded just this morning from their site:

OneCode

 

While the menu and layout remind me of my nemesis – the Zune software, the content is helpful.  Also, I have a good feeling that there’ll be even more features, as talking with these guys, I gathered that they are open to feedback and would love to see this take off.

That’s pretty… but where’s my Visual Studio Add-In? I know I installed it here somewhere…

Once it’s installed and Visual Studio has been restarted, you’ll see a toolbar that looks like this (minus the search criteria):

OneCodeAddIn

 

Okay… not so confused anymore.  Show me how you find stuff for graphs, since you hinted at it above.

 

Now, let’s say you’re working on a project that uses graphs.  Business people like seeing data in charts and graphs, so we better do an app for them.  In my add-in, I typed graph and pressed Enter, which opened the following results:

OneCodeGraphSearch

 

180 results is a lot to sift through!  Let’s filter these so that I’m only looking at HTML5 stuff, as this client is trying to target multiple platforms and thinks HTML5 might be the way to do it.  Click in the box, and the filtering selections appear.  I’m changing my Technology to HTML5.  Much smaller!

OneCodeGraphSearchHTML5Filter

 

 

Let’s take a look at a sample and what it has to offer.  I’ve chosen the top one.

What are the details, documentation, and social about?

I’m getting there!  First off, the details section:

OneCodeGraphSearchHTML5FilterDetails

 

This section contains a link to where I can find the app.  You can see what technologies are supposedly used, the license, the supported Visual Studio edition(s), the author, ratings, last update, and download count.  If you click that download button, it’ll download the sample and change to an open button.  Clicking that button will open the sample in Visual Studio.

The documentation panel shows any documentation that is associated with the project.

OneCodeGraphSearchHTML5FilterDocumentation

 

This shows any important information the creator included for their project.  In this particular case, we see the software that’s required plus a note on unblocking the ZIP file.  Helpful information indeed!

The social panel shows any social media activity for that project – currently tracking Twitter, Delicious, Digg, and Facebook.

OneCodeGraphSearchHTML5FilterSocial

 

As you can see, I Tweeted about this, as it need a little love.

Okay… I don’t care about graphs. I went back to the pretty home screen and was seeking some inspiration.

Me too!  I’ve been getting rusty on my SQL skills and figured I could use some inspiring in that department, so I clicked on the SQL Server button on that page.  That in turn took me to these results:

OneCodeSQLServer

 

So now I have samples to help inspire me.

You mentioned they’re open to feedback.

Yep!  Click the Sample Request Service link at the top, and then click the bright red Submit a Request button.  This will take you over to their Codeplex Issue Tracker, where you can submit your suggestions.

Okay… this is nifty! But… Zune software style seems old school.  I’m running Windows 8. Can I use this on my tablet?

Ah yes… if you do a search for “All-In-One Code Browser” on the Windows Store, there’s a beautiful version for the Windows 8 {Metro UI/Windows UI/”fancy tiles that need a better branding name” UI}.

OneCodeFrameworkWindowsStore

This Sample Browser app has a nice user experience, inline with the new tablet-esque/tablety user experience.

More on that in a future blog post…  did I mention I’m at the MVP Summit?  Gotta eat breakfast for the big day ahead!  Hopefully will blog about Sample Browser later.