AngularJS File Upload

May 3, 2013


Recently I had some time to play around with AngularJS. More specifically I had to implement a jQuery based file upload widget.

The widget’s demo site already contains an AngularJS demo, but I wanted a minimum setup, so I started from scratch and figured out the necessary parts to implement the file upload using ASP.NET MVC as the server-side platform.

Let’s see which steps we need to take to implement a basic version.

Read the rest of this entry »



The last 7 posts discussed how you can create a single-page application using GitHub, Twitter Bootstrap, MongoDB and Knockout.js.

One last thing I touched briefly during my session in September is continuous deployment using AppHarbor. If you are not familiar with AppHarbor, it’s basically .NET as a service where you can deploy a .NET application to the cloud.

In this tutorial let’s create a small web application, use GitHub for source control and automatically deploy any commits directly to our AppHarbor hosted site.

Read the rest of this entry »


Let’s wrap up our little Knockout powered single-page application. We already covered 3 out of 4 parts of the timesheets application.

Time to finish up with the fourth and final part, deleting timesheets. Using some Twitter Bootstrap and Knockout magic it shouldn’t take that long.

Read the rest of this entry »


In part 3 of this series we’ll implement another feature of our little Knockout.js powered CRUD application. We already talked about read and create in the first two articles, skim through them if you want to get up to speed.

The next logical step after enabling users to add timesheets is to allow them to edit the new records. Time to implement some update functionality.

Read the rest of this entry »


Let’s start where we left off. Go ahead and download the source code of the previous part, unzip it and open it up in Visual Studio.

Last time we retrieved a list of timesheets, pushed it into an observable array and used declarative bindings (data-bind) to associate DOM elements with our view model. In other words we databound it to a table. Knockout then automagically rendered a row for each timesheet in the array.

Let’s proceed with the next step in our little CRUD application and add support for creating new timesheets.

Read the rest of this entry »


The last two posts were introductory posts to Twitter Bootstrap and MongoDB. Let’s combine these two technologies with ASP.NET MVC 4, Web API and Knockout.js to create a simple Single-page Application.

The goal is to fit all the necessary code – HTML, JavaScript and CSS on one single page, hence the name. This results in a more fluid user experience. We will not be doing any full page reloads or transfer control to another page. All interaction with the server will consist solely out lightweight JSON communication.

Read the rest of this entry »

An Introduction To MongoDB

September 29, 2012


Next up, after GitHub and Bootstrap, in the session I presented last month during a company trip, is MongoDB.

MongoDB is a NoSQL database, instead of storing data in tables, it stores structured data in JSON-like documents, also known as BSON (Binary JSON).

This article isn’t about NoSQL, it just shows you how you can quickly set up MongoDB and work with it in a .NET environment. Let’s walk through the necessary steps to get MongoDB up and running.

Read the rest of this entry »