A simple introduction to AngularJS, Part 6 – Dependency injection in Angular using $provide

In the last part, we went had a thorough look at scopes, and scope “inheritance”. That means that we have now covered setting up Angular, creating modules and controllers, and how to utilize two-way data binding using the scope object. The next step is to learn how to work with dependency injection in Angular to provide the same dependency injected service structure that Angular uses internally.

Dependency injection isn’t complicated as such, you register a service that another unit of code can request to get access to. That is the extremely simple definition. To support this in Angular we depend on the $provide service. This service is used to locate dependencies that other pieces of code require. Unfortunately, something as simple as this, actually becomes a little complicated and hard to grasp in Angular. Not because it is really complicated, but because there are so many options…

More...

A simple introduction to AngularJS, Part 5 – More scope functionality

In the previous part, I talked fairly detailed about how the scopes use prototypical inheritance, and how we can use this to our advantage by either using simple property types, or by using complex types.

In this part, I want to cover some functionality given to us by Angular when using the scope…

More...

A simple introduction to AngularJS, Part 4 – “Scope inheritance”

In the last part, we talked about how to set up to group different bits and pieces of a solution into units. We also talked about how to create controllers inside those modules. We briefly looked at creating a controller and using it to work with the scope object, and how, by using data binding, could update the UI in a more structured way.

In this part, we will take a deeper look into using controllers and scope. Mostly about how to use the scope to be honest. Controllers are all about functionality, while scope is about data binding. As I don’t have a special solution to build, there isn’t going to be a whole lot of functionality. There will be just enough functionality to show the stuff I am talking about…

More...

A simple introduction to AngularJS, Part 3 – Modules and Controllers

In the previous part, I covered how to get started with Angular, as well as the basics of how it works “internally”. This part will build on that knowledge, and add modules and controllers to the mix.

If you haven’t read the previous part, I suggest at least skimming through it. The first part might not be necessary to understand this part, but the basics covered in the previous will be…

To start off, we need a clean “solution”, containing only an index.htm file, and Angular… The index.htm file should look something like this

More...

A simple introduction to AngularJS, Part 2 – Getting started

Ok, if you have read my first post in this series about getting started with AngularJS, you will know what AngularJS is, as well as why I am creating yet another introduction to it. In this part, I want to focus on getting started. The first baby steps in the road to building SPAs with Angular.

The first step is to set up a new application. In this case, let’s keep it ridiculously simple. It doesn’t have to be a big complicated solution and use big IDEs like Visual Studio. At least not in the beginning. IDEs have their place, but for now, adding a simple folder on the computer is enough to get started. This folder will be the “solution”. And Notepad will be the editor.

You are obviously more than welcome to use another editor. Notepad is in no way the only editor that was built with Angular in mind. But it, or very similar editors, are pre-installed on most development computers in the world.

More...

A simple introduction to AngularJS, Part 1 – What is AngularJS?

AngularJS is honestly one of the best things I have stumbled upon in years. After Silverlight doing its fantastic disappearing act, my interest in developing things on the web took a nosedive. I had no interest in doing it what so ever. HTML/CSS/JavaScript was a massive step back from XAML in my mind. And I still think so. I think we are trying to do things on the web using technologies that weren’t built for it, ending up with a lot of hacky solutions…

However, when I found AngularJS and realized that I could use my MVVM experience, and my “XAML patterns” on the web, it changed a whole lot! I could focus on building applications and leave a lot of the hackyness to the side. I would still have to do the hacks, working with HTML and CSS, but at least I could build the logic side of things in a structured way.

However, Angular might not be the easiest thing to just pick up and learn. For web developers, picking up dependency injection and MVVM can be a daunting task, and being a .NET developer, taking up a dynamic language like JavaScript, and loosely strung together applications built on spread out text files, might seem less the perfect.

Angular isn’t overly complicated, and there are a million resources for learning it out there. But for some reason, I haven’t found one that suited me. So…I decided to do what all simpletons do…we re-invent the wheel and do it all ourselves… The goal is to write an introduction to Angular from my point of view, which means from the point of view of a person who normally works with C# building ASP.NET MVC applications as well as XAML-based applications. I have a background in building web applications, but more from a ASP.NET side of things than from a client-side.

More...

Making X.509 authenticated HTTP requests in Windows 8 apps – a.k.a Calling the Azure Management API from Store apps

Recently I decided that I wanted to see how easy it would be to build a Windows 8 application that consumed the Windows Azure Management API. It seemed like it should be an easy thing, and something that could potentially end up in a nice management/overview/dashboard kind of application. However, it isn’t quite that simple as I thought as Windows Azure uses certificates for authentication of the HTTP requests being used.

Using certificates for HTTP requests isn’t really that hard, at least not when working in .NET. But in Windows 8 apps, we are using WinRT, which is way more sandboxed, and to be honest, a bit more complicated, which makes it a little bit more complex…

More...

Cookie problems when using federated security and SignalR

I recently ran into a problem where the application I was working on didn’t pass the security information as expected to the server. The application in this case is a Silverlight client, with a WebAPI and SignalR backend. For security, we are using WIF…or federated security…I don’t know what to call it anymore. We aren’t really federating it today, but it is based on the same framework…

It has been a while since I was involved in the system, but I got roped back in to solve some issues. And while doing so, I discovered that I wouldn’t get a proper security context for calls made from the client to the server using SignalR. For some reason, those calls where just not being authenticated properly…

More...

Error handling in express

In my last post, I gave an introduction to using express to serve up your HTTP content to users. It walked through most of the features needed to get started, but there was one thing that was missing, but still very important, and that is error handling. However good you are at coding, you will get errors. It will obviously not be your fault, but you never know what the user manages to do… ;)

So it is definitely important for us to handle errors in a graceful way. Luckily, this is pretty simple to do… But first, we need to create a simple express-based webserver to work with…

More...

The code from my SweNug presentation in Linköping

Here is the code from the demos I did yesterday at the SweNug meeting in Linköping. Or at least the pre-made code that I didn’t invent while talking…which I hope wasn’t too much…

Code: Xaml.Demos.zip (69.20 kb)

Anyhow, download it and walk through it, and ask any questions that might pop-up.

The video will be available later on when Pierre has figured out a way to get it “produced”…

Cheers!