DarksideCookie

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...

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...

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...

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...

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...

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...

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...

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...

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!

My last post covered module loading in node…or at least try to cover the basics in an understandable way… This time, it is time to create something a bit more useful, a proper web application, using a module called “express”. And instead of me talking a whole lot about what I am about to talk about, let’s just get into it…

The first step is to install express. This is done using the NPM as always. The only thing to really decide is whether or not you want to install it globally using the -g parameter, or just locally. Me, I am just going to do it locally, so I use the following command

npm install express

If you install it globally, you can use express to create a “skeleton” application by running the following command

express -s -J <folder name>

This will give you a fullblown express app to start working with. But as I intend to explain the basics, I will start from scratch, and thus just install express to begin with.

More...