DarksideCookie

This post was supposed to be an introduction to Azure WebJobs, but it took a weird turn somewhere and became a guide to building a simple PicPaste replacement using just a wimple Azure Web App and a WebJob.

As such, it might not be a really useful app, but it does show how simple it is to build quite powerful things using Azure.

So, what is the goal? Well, the goal is to build a website that you can upload images to, and then get a simple Url to use when sharing the image. This is not complicated, but as I want to resize the image, and add a little overlay to it as well before giving the user the Url, I might run into performance issues if it becomes popular. So, instead I want the web app to upload the image to blob storage, and then have a WebJob process it in the background. Doing it like this, I can limit the number of images that are processed at the time, and use a queue to handle any peaks.

More...

For some reason I got the urge to have a look at webhooks when using GitHub. Since it is a feature that is used extensively by build servers and other applications to do things when code is pushed to GitHub etc, I thought it might be cool to have a look at how it works under the hood. And maybe build some interesting integration in the future…

The basic idea behind it is that you tell GitHub that you want to get notified when things happen in your GitHub repo, and GitHub makes sure to do so. It does so using a regular HTTP call to an endpoint of your choice.

More...

[UPDATE] If you clone the dev branch’s samples instead of the master branch, it should be easier. You will still need to update the Startup.cs file for now though. Pull-request made… (That was a long blog post to no use…still gives some insight into how it works though…) [END UPDATE]

[UPDATE 2] Now updated to beta-5 if anyone still wants it considering the update above… [END UPDATE 2]

Yesterday I finally had time to sit down and play with the new ASP.NET 5 runtime, which is something I have wanted to do for quite some time. However, it kind of annoyed me that I couldn’t just install the ASP.NET 5 runtime, clone the samples from GitHub and get started, as it generated a whole heap of errors. After an hour or so of Googling and trying things out, I finally got it working, so I thought I would write down what I did to get it to work.

Note: This codebase is moving ridiculously fast, so this post is going to be old within a very short while. Everything is based on the code as of today, March 20th 2015.

More...

In the previous post, we looked at how we can use Gulp to run tasks for us. And in that post we used it to create tasks for transpiling LESS and TypeScript into CSS and JavaScript. But the example was very small and simple. It only contained 1 LESS file and 1 JavaScript file. But what if we have more than 1? Well, that’s when we need to start bundling the files together, and potentially minify them so that they are faster to download. Luckily, this is a piece of cake to do using Gulp. So in this post, we will have a look at how to do that, as well as how to get some TypeScript/JavaScript tests thrown in there as well.

Dislaimer: The solution will still be VERY small and simple. But at least it will be made big enough to be able to use bundling and minification. Which to be honest just means that we need more than one file of each type…

I assume that you have read the last post, and that if you are following along on your machine, you will need to be done with everything that was done in that post…

More...

I started building web-based software professionally around year 2000, just before the big IT crash in Sweden. It started out being just hacing together HTML, mostly using tables, and a little JavaScript. But slowly evolved into building ASP applications with VB Script and COM-components in VB. Since then, I have been in and out of the webdevelopment scene a whole bunch of times, and very little has changed. It is still HTML/CSS/JavaScript over HTTP…

Yes, on server-side there have been some changes. First an abstraction into WebForms, and then back to MVC. And to me, ASP.NET MVC is pretty similar to classical ASP in many ways. But the front end has pretty much stayed the same. It is still good ol’ HTML and JavaScript…and CSS of course. However, having been away from it for a little while now, coming back I realize that the scene has changed. A lot… Yes, the languages are unfortunately the same, but the methods have changed a lot.

The thing that has changed the most is that we are using MUCH more JavaScript and CSS. MUCH more. And that creates new requirements. Requirements like bundling and minifying, as well as testing even our front-end code. And in a lot of cases, we are authoring our code in other languages and have them “compiled”, or “transpiled”, into JavaScript and CSS, to make up for their “shortcomings”. Whether it be using CoffeScript or Dart for you JavaScript, or LESS or SASS for your CSS, it needs processing before we can use it… And this new way of building things has created the need for a front-end build pipeline… At least if you want to be really productive.

More...

Ok, so this post sprung out of an idea that I have had in my head for a while. I know it will probably be solved better in ASP.NET v.Next, and can probably be solved in a bunch of other ways using only Web API or only MVC, but I wanted to see if I could use both to do it…

So what is IT? Well… In Web API, we have the ability to use content negotiation out of the box. Unfortunately, that content negotiation is, at least by default, based around serializing to XML or JSON. It doesn’t include all the view goodness that MVC has. There is no simple way to ask Web API to return a Razor view… So if I want to have content negotiation to handle both serialized data and views, we need to do some work…

On top of that, my solution would work nicely together with an existing MVC application, making it “easy” to add API features and content negotiation to the existing MVC URLs.

More...

In my previous post about OWIN, I talked a bit about what OWIN is, and why it is important. This time, I want to take a little more of a dive into how we can use it, and how we code things using it.

var http = require('http');
var server = http.createServer(function(req,res) {
    res.end('Hello World');
});
server.listen(8080);
console.log('Server running...listening on port 8080');

The above code snippet has nothing at all to do with OWIN. It is actually Node.js code for creating a web server and responding to HTTP requests. However, the above code is the main reason I like Node. The simplicity and tiny amount of code needed to get going is awesome!

It doesn’t do much, but it gives as a very crude, but powerful starting point in just a couple of lines of code. It is then up to us to take it from there and do what we want. Something we often do by turning to our package manager and asking for some cool functionality that someone else has already built.

More...

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

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