Angular, Windows Store apps, WinJs

Angular in a Windows Store app – Servicing

Today I’m adding an AngularJS service to the Windows Store project in Visual Studio. This service is making a call to an external webservice which returns some JSON data. This controller uses a promise to handle the call to the service and when it’s fulfilled the data is shown on the screen. You can find the code: https://github.com/sorskoot/AngularWinjsDemo

Angular, Windows Store apps

Angular in a Windows Store app – Taking Control

Hi everyone! Just uploaded a new video on working with AngularJS in a Windows Store app. In this episode I show you how to bootstrap Angular, add a very simple controller and bind it to the view. Follow the whole series on http://youtube.com/c/winjsninja

Angular, Windows Store apps

Angular in a Windows Store app

I was trying to use Angular JS in a Windows store app and had some issues with Angular being “unsafe”. Using Angular JS in a JavaScript Windows Store app turned out to be pretty easy. Here’s how to do it: First create a new app. Install Angular JS though NuGet. Add a scripts tag to your default.html. <script src=”Scripts/angular.js”></script> Running the app at this point will result in the following error: The trick to get around this error is to enable CSP (Content Security Policy) and the most convenient part is that Angular has a directive to set that. All…

Windows Store apps

Adding ASP.NET to your universal JavaScript Store apps project

While exploring the possibilities of using frameworks like KnockoutJS and Backbone in my store apps I started wondering if it would be possible to share my JavaScript code between Windows Store app, Windows Phone app and an ASP.NET website. After some exploration and fiddling with various options I figured it out. Here’s how to do it. If you have a solution with an ASP.NET website, add a universal project to the solution. Or add a MVC project to the solution with you universal projects. Unload the web application and add to the following line to the file right before the…

TypeScript, Windows Store apps

Windows Store app with TypeScript and Knockout

In this tutorial we’re going to make a very simple Windows Store app that uses TypeScript. The app is going to use Knockout to handle user input to search patterns on http://colourlovers.com. I assume you have read my previous tutorial on how to set up TypeScript compilation in a Windows Store app. We’ll start with an empty project after adding TypeScript compilation. Packages First we’ll start by adding our dependencies through NuGet. We have a dependency on KnockoutJS, because this is what we need for our bindings. To make the request to colourlovers we are going to use jQuery. First…

TypeScript, Windows Store apps

Enabling TypeScript Compilation in Windows Store apps

TypeScript compiles to JavaScript, thus it can be used in Windows Store apps. Other than with Web applications, where you can configure the way typescript compiles on the project’s property page, with Windows Store apps you’ll have to edit the project file by hand. Which is not that hard. Edit the project file To do this, unload your Windows Store JavaScript application project by right clicking and selecting unload. Right click the project again and select edit. What we need to do is tell MSBuild what it has to do when it encounters a TypeScript file. The whole XML file…

Windows Store apps

Using Grunt to compile .less in Windows Store apps

I was playing with Grunt. Grunt is a JavaScript task runner. It automates a lot of repetitive tasks like minification, unittesting, linting and more. I’ve used it to compile templates and compile .less files to .css. In this tutorial I’ll show you how to do the latter. Before we dive into Grunt you need Node.js. Just go to http://nodejs.org and install it. NodeJS can serve websites, but can also run tools. Like Grunt. Node.js uses a package manager (a bit like NuGet), npm. You’ll be using npm a lot when using Node.js. Getting started First let’s create a new project…

HTML5, JSON, TypeScript, Windows Store apps, WinJs

Combining WinJS, TypeScript, jQuery and KnockOut

In this tutorial we’re going to build a very simple Windows Store application that uses jQuery and Knockout to get some data from the internet and show this in a GridView. I’ll show you how you create a new project, get all the the TypeScript definitions you need, get data from a web service and bind that to the GridView control. I’m assuming you have at least a little TypeScript knowledge. If you don’t you should have a look at the tutorials on http://TypeScriptLang.org first. File – New Start by creating a new project using the template Store apps with…

TypeScript, Visual Studio, Windows Store apps

Store app Typescript Project Template

Recently I’ve been writing Windows Store apps using TypeScript. Because TypeScript compiles to JavaScript this can be done without any problems. The hardest part at the moment is getting the project up and running. One of the things is that there’s no official Project Template to start a new project. So I made one myself. Feel free to use it and if you run into any issues please let me know. You can download the template here or get it from GitHub. To use it, first extract the file in the ProjectTemplates folder of Visual Studio 2013. You can find…