Friday, July 20, 2012

JayData–The cross-platform HTML5 data-management library for JavaScript

Last week, I wanted to call an oData service from my HTML5 metro app. First I was planning to use datajs until I discovered JayData which offers similar functionality to datajs and much more!
image
What’s JayData?
JayData is a standards-based, cross-platform Javascript library and a set of practices to access and manipulate data from various online and offline sources.
JayData provides JavaScript Language Query (JSLQ) as a tool to query local (in-browser and mobile) and remote data sources with a simple, unified query syntax: JavaScript itself. Much like Microsoft .NET developers can utilize LINQ to perform operations on data from different databases.
The aim of JayData library is to give a similar level of abstraction with the help of the $data.Expressions API and the JavaScript language itself.
JayData is cross-platform (runs on HTML5 desktop and mobile browsers, can be hosted in PhoneGap environment on iPhone, iPad and Android) and cross-layer as it works on client-side and server-side (Node.JS).
It provides support for
  • WebSQL
  • SQLite
  • IndexedDB
  • OData
  • Facebook
  • YQL
How to start using it(in ASP.NET)?
  • Create a new web application
  • Add the JayData nuget package.
  • A command line utility is copied into the web folder. With that you can create a JayData client context from any oData metadata document.
  • C:\NorthWindSample>JaySvcUtil.exe -m http://services.odata.org/Northwind/Northwind.svc/$metadata
    –n northwind -o northwind.js


  • A northwind.js file is generated.
  • Include this file into your web page together with jaydata.js and jQuery.
  • Now you can write some Javascript that uses this northwind odata service:
  •  
    <!DOCTYPE html>
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <title></title>
        <script type="text/javascript" src="/scripts/jquery-1.7.1.min.js"></script>
        <script type="text/javascript" src="/scripts/JayData.js"></script>
        <script type="text/javascript" src="northwind.js"></script>
        <script>
            var nwcontext = new northwind.NorthwindEntities({
                name: 'oData',
                oDataServiceHost: 'http://services.odata.org/Northwind/Northwind.svc'
            });
    
            function createItemLI(name, id, css) {
                var li = $('<li></li>').append(name).addClass(css).data('id', id);
                return li;
            }
    
            $(function () {
                nwcontext.Categories.toArray(function (categories) {
                    categories.forEach(function (category) {
                        $('#categories').append(
                            createItemLI(category.Category_Name, category.Category_ID, 'category'));
                    });
                });
            });
        </script>
    </head>
    <body>
        <ul id="categories">
        </ul>
    </body>
     
  • That’s all!

Thursday, July 19, 2012

Free ebook: Building Hybrid Applications in the Cloud on Windows Azure

The Microsoft Patterns and Practices team released a new version of the ‘Building Hybrid Application in the Cloud on Windows Azure’ ebook.

image

“This book is the third volume in a series on Windows Azure. Volume 1, Moving Applications to the Cloud on Windows Azure, provides an introduction to Windows Azure, discusses the cost model and application life cycle management for cloud-based applications, and describes how to migrate an existing ASP.NET application to the cloud. Volume 2, Developing Applications for the Cloud on Windows Azure, discusses the design considerations and implementation details of applications that are designed from the beginning to run in the cloud. It also extends many of the areas covered in Volume 1 to provide information about more advanced techniques that you can apply in Windows Azure applications.

This third volume in the series demonstrates how you can use the powerful infrastructure services that are part of Windows Azure to simplify development; integrate the component parts of a hybrid application across the cloud, on-premises, and third-party boundaries; and maximize security, performance scalability, and availability.

This guide is intended for architects, developers, and information technology (IT) professionals who design, build, or operate applications and services that run on or interact with the cloud. Although applications do not need to be based on the Microsoft® Windows® operating system to operate in Windows Azure, this book is written for people who work with Windows-based systems. You should be familiar with the Microsoft .NET Framework, the Microsoft Visual Studio® development system, ASP.NET MVC, and the Microsoft Visual C#® development language.”

Perfect holiday lecture Glimlach.

Wednesday, July 18, 2012

Minification and bundling in ASP.NET: WebGrease

When installing the latest version of the Microsoft.AspNet.Web.Optimization package(before the Microsoft.Web.Optimization package)  I noticed a dependency on an assembly called WebGrease.

So I started to look around what it is and found the following 2 blog posts:

What is WebGrease?

WebGrease is a suite of tools focused on assisting web developers with optimizing the "static" asset files (JavaScript, CSS) of a web application. The features the initial version includes are:

  • Minification of JavaScript & CSS files
  • Validation of JavaScript files
  • Creation of image sprites from images reference in CSS files.
  • Bundling of CSS & JavaScript files.
  • Auto-version naming of files.

The Web Optimization library uses some of the features WebGrease offers(currently only the Minification features for CSS and JavaScript). In order to use all of the features in WebGrease, there is a command line tool included with the nuget package(WG.exe).

wg.exe <operation switch> -in:<input file/folder> -out:<output file/folder>

The valid operation switches of WG.exe are:

  • -m : Invokes the minification operation on the file(s).
  • -v : Runs a validation pass on javascript file(s) and output the results to the console.
  • -s : Processes css file(s) for images and will attempt to create a image sprite out of them, and create updated copies of the css file(s).
  • -b : Bundles files together into a single output file.
  • -a : This switch will rename files based on their content (hash), and generate a lookup xml file for mapping between the original name and new name.

Tuesday, July 17, 2012

MSTest: use subfolders for your deployment items

Out-of-the-box when you have deployment enabled inside your .testsettings file, all files are put directly under the TestResults/Out folder. But what if you want to put your test files in a subfolder? This is something that isn’t possible through the testsettings editor, however it can be accomplished by changing the .testsettings file directly.
TestSettingsEditorDeploymentTab
Right click on the .testsettings file in your solution explorer. 
  1. Select Open With and select XML editor.
  2. Add a deployment item, specifying the relative path as the file name and an outputdirectory value of the directory name.
    <Deployment> 
     <DeploymentItem filename="BuildCustomizations\TestFiles\" outputDirectory="TestFiles\" /> 
    </Deployment>
Now when you execute your tests, MSTest will copy the content of the ‘TestFiles’ folder to 'TestResults/Out/TestFiles before your tests are executed.


Remark: MSTest didn’t pick up this change immediately. I had to restart Visual Studio before it worked.

aspConf: the free Live ASP.NET Conference

Today and tomorrow it’s aspConf, a free, virtual conference dedicated to ASP.NET. It's the sequel to the popular mvcConf series, expanded to two full days of great content on the entire ASP.NET platform. It offers over 60 presentations from amazing speakers, including a who's who of ASP.NET community speakers, lots of ASP.NET product team members, and keynotes from Scott Guthrie and Scott Hanselman.

The first day (July 17) features live streamed video from Channel 9 Studios, a keynote from Scott Guthrie, and breakout sessions via Live Meeting presented by ASP.NET community speakers from around the world. July 18 continues the fun with a keynote by Scott Hanselman and dozens more breakout sessions.

fbe8251b-84a9-479f-af86-36bdd6f882e4[1]

Monday, July 16, 2012

TFS Build: using the built-in editors

By default when editing parameters inside a Team Foundation Build process template you get a very simple editor.(Except for some out-of-the-box available parameters).  But wouldn’t it be nice if you could give your users a much better experience by providing a custom editor?

TFS allows you to this by changing the Editor Parameter in the Metadata argument.

image

You could build  your own editor or you could start by using one of the built-in ones(available in the Microsoft.TeamFoundation.Build.Controls assembly). So just enter Microsoft.TeamFoundation.Build.Controls.{ControlName}, Microsoft.TeamFoundation.Build.Controls in the Editor parameter and everything is set.

image

A list of the available designers
Editor Description Screenshot
BuildAgentSelectionEditor Select a build agent. BuildAgentSelectorEditor
BuildProjectListEditor Select a project (typically a .sln or .csproj) from source control. BuildProjectListEditor
ServerFileBrowserEditor Select a file in source control ServerFileBrowserEditor
TestSpecEditor Select a spec of tests to run TestSpecEditor
WorkItemTypeSelectionEditor Select a work item type WorkItemTypeSelectionEditor
ServerFolderBrowserEditor Select a folder in source control ServerFolderBrowserEditor
StringListEditor Edition of a list of string. StringListEditor
EnumPropertyEditor Shows the list of possible enum values EnumPropertyEditor

Friday, July 13, 2012

TFS Build: output build results to separate folders

By default TFS Build will redirect the output of your projects to one location(specified by the BinariesDirectory parameter). This means that all DLL’s, executables and so on are available at one place. However the Sharepoint team asked me to change this so that TFS build put each project output into its own folder, instead of dropping all of the files into one flat structure. They wanted the same behavior as in Visual Studio so that the files are available under e.g. Bin\Release, Bin\Debug, etc… This makes it easier for them to run WSPBuilder and create deployment packages.

So how can we do this?
  • Open the Build Process template you are using.
  • Drill down until you find the “Run MSBuild for Project” task used to execute the MSBuild process.

image

  • Set the OutDir property to an empty string. The OutDir property over writes the default output path on each project. By clearing the OutDir property for the MsBuild Activity, Team build will use the Output Path defined in the project.

image

  • That’s it!

Remark 1:

If you want to have a reference to the default TFS outputdirectory, you can pass an extra property to MSBuild by setting your CommandLineArguments to something like the following. String.Format

("/p:SkipInvalidConfigurations=true /p:TeamBuildOutDir=""{0}"" {1}", BinariesDirectory, MSBuildArguments)

Inside your MSBuild files, you now have an extra property that you can use: $(TeamBuildOutDir).

Remark 2:

If you also want to copy the build output to the binariesdirectory, you’ll have to create some extra activities. For some help how to do this, check out this blog post.

Thursday, July 12, 2012

Could not find a base address that matches scheme net.tcp for the endpoint with binding NetTcpBinding.

Last week I finally got some good news from our server team, the new Windows Server 2008 R2 production server is ready. So I started by installing the first application, but no success. I ended up with the following error message:

“Could not find a base address that matches scheme net.tcp for the endpoint with binding NetTcpBinding. Registered base address schemes are [http].”

And the related yellow screen of death:

image

The first thing I checked was if non-http activation was enabled. So I went to the Control Panel, clicked on Turn Windows features on or off. There I browsed to the  Microsoft .NET Framework 3.x part and validated if both Windows Communication Foundation HTTP Activation and Windows Communication Foundation Non-HTTP Activation were checked. This was the case so the investigation continued…

On the MSDN website I saw that one extra step is required. To support net.tcp activation, the default Web site must first be bound to a net.tcp port. You can do this by using Appcmd.exe, which is installed with the IIS 7.0 management toolset. In an administrator-level Command Prompt window, run the following command.

%windir%\system32\inetsrv\appcmd.exe set site "Default Web Site" -+bindings.[protocol='net.tcp',bindingInformation='808:*']

Wednesday, July 11, 2012

Responsive web design: Mediaqueri.es

Looking for a collection of websites using media queries and responsive web design?

Go to http://mediaqueri.es/ and browse through the long list of available examples…

image

Tuesday, July 10, 2012

Web Deploy publish/package validating error: Missing or Invalid property value for $(MsDeployServiceUrl)

After installing the new Windows Azure SDK for Visual Studio 2010, I wanted to try the new Web Deploy features. But when I tried to publish my web application it failed with the following error message:

“Web Deploy publish/package validating error: Missing or Invalid property value for $(MsDeployServiceUrl)”

On the IIS forums someone mentioned that uninstalling the "Microsoft Web Publishing for Visual Studio 2010" feature should fix the issue. So I went to Add/Remove Programs, selected the "Microsoft Web Publishing for Visual Studio 2010" feature and uninstalled it.

After restarting Visual Studio I was finally able to publish using the new Web Deploy.

Monday, July 9, 2012

X-ray goggles

Last week I discovered this nice tool:X-ray goggles.

“The X-Ray Goggles make it easy to see and mess around with the building blocks that make up the web. Activate the Goggles to inspect the code behind any web page, from the New York Times to your own blog. Then remix elements with a single click, swapping in your own text, images and more.”

 

The X-Ray Goggles are a bookmarklet—a special kind of tool that can augment any web page.

How to use it?

image

  • Click on the x-ray goggles button in your bookmarks.

image

  • You can now hover over any element and see what’s it made off.

image

  • Just click on it to see the markup and change it anyway you want.

image