ASP.NET Web API, Angularjs and MongoDb part 5

This is the sequel to this.

You can find the finished application here: https://github.com/jacqinthebox/AddressBook

angular

When I was creating this I was really confused about ‘the double MVC’ setup. The one that comes with ASP.NET and the one that comes with Angularjs.

It felt like what I was doing was bloathed and wrong.

I decided to start again from scratch, but this time with Node as the backend.

node

Getting started with ASP.NET API with MongoLab part 3

This is the sequel to this post
We will be using MongoLab as a backend for our Web Api.

We are using the AddressBook again in this example, but for clarity we’re building it from scratch.

Creating the MongoLab database

Head over to MongoLab and create an account!

  • First create a new database. Make sure you choose the free plan. Name the database ‘addressbook’.
  • Click to create a new user.
  • Add a new collection (equivalent for a table) named persons.

Please take note of the connectionstring:

2013-11-01 08_12_03-MongoLab_ MongoDB-as-a-Service

Setting up the Web Api project in Visual Studio

Fire up Visual Studio 2013 and hit File -> New -> Project.
Choose Empty ASP.NET Web Application with a Web API and name the project AddressBook.

2013-11-01 08_07_48-New ASP.NET Project - AddressBook

We must install the Mongo Csharp Driver:

Now open App_Start\WebApiConfig.cs and add json formatting to it (see my previous post why):

Connecting to the MongoLab

Let’s not reinvent the wheel if you don’t have to. This article is a great introduction to Mongo and C#. I borrowed their MongoConnectionHandler.

The Person class

I want the Person_Id to be the same as the document id, so I can retrieve documents easily. I’m not sure though if this is best practice. But it works.

And here’s the POST method:

You can use the API with Fiddler.

2013-11-01 14_33_36-Fiddler Web Debugger

Look at the results it has returned:

2013-11-01 14_35_25-Fiddler Web Debugger

It returned the new URI with the new Id as you can see.

Now let’s check MongoLab, and lo and behold:

2013-11-01 14_39_53-MongoLab_ MongoDB-as-a-Service

Here’s the remainder of the CRUD methods:

So, that works.
Next time, let’s consume this WebApi with Angularjs.

And here’s all the code: here

I have changed ‘Person’ to ‘Contact’ in the sourcecode