A web app in minutes, java and .net

In this post I show you how to generate a shell for a web applications in both Java and .NET, while they are not directly a one to one mapping I think some of you will find this interesting should you have never created a web application on either stack or perhaps just one of the below mentioned.
I’ll let the videos speak for themselves.

Java

 

.Net

 

Follow up

I did promise to dissect both projects however I ran out of time,

I’ll leave it to you to pick your tech stack of choice and if you have any questions just ask below and I’ll explain in more detail if necessary.

WebAPI OData DTO

So I’ve started using OData in anger and pretty much immediately stumbled on a problem when using Data Transfer Objects (DTOs). This post explains that problem and the solution.

 

Problem

The following error is encountered when trying to access the exposed entity by key:

No routing convention was found to select an action for the OData path with template '~/entityset/key'.","type":""

 

image

 

Cause Code

OData configuration

Here I show the simple entity I’m exposing

image

 

Timesheet Controller

Here you can see that the underlying timesheets are just projected using Automapper to their DTO counterparts

image

 

Automapper config

Here I show the automapper configuration (not that it’s makes any difference to the problem encountered)

image

 

Solution

To fix this problem I needed to set the EntityType.Name property on my OData entity type.

image

 

And thereafter, success!

image

IntelliJ Application Servers Greyed Out

If you ever come across the problem of the IntelliJ Application Servers menu greyed out like this:

image

This is simply because you need at least one Run Configuration.

I’m using JBoss just now so here’s what I do to add a run config:

image
image

 

image

Once this is done you can now see your application servers tools window menu item becomes enabled.

image  image

Not accepted here

and it's not because I'm Irish ;-)

ODataController - 406

So I’m working on a project that returns some entities from an OData endpoint, I wanted to remove the unnecessary parts of my entities so I created some DTO’s (which in itself is a good idea btw). The screenshot below shows the changes, I’m now returning a TimeSheetDto list (previously just a TimeSheet list) and I’m just projecting (using automapper) the Timesheets from my database into these DTO’s .

image

 

However when I test said entities I see nothing come back in my browser, nada,zilch,zippo… so what is happening?
Well I fired up fiddler and saw that I was getting a HTTP status code of 406, but why?
It worked before and I changed nothing…. oh wait!….

Configure OData entities

You know that message that gets scaffolded with new OData end points!? We’ll it explicitly tells us what entities are to be considered, so with a quick addition of my Dto Suffix in my OData config I’m back in action.

image

Azure, Sql User invalid from Azure Website

Problem

I was faced with a problem this morning that took me a good 30 minutes to figure out..

I had created a website and associated SQL database. However I changed said database as part of some development work. The problem was that even though my publish profile was overriding the Release Connection String with my new database it was getting ignored!

image

 

I knew that the connection string I was supplying was correct as I could log in with Visual Studio and SSMS.

Cause:

The reason is that the website had already an connection string (under the Configure tab) and this was taking preference. The reason this is here is that one does not have to store the Azure connection string in the publish profile which is quite nice, same goes for a lot of other Azure features.

image

 

Solution

I removed same and then it works. (Fixing it is also another option but this code is in a private git repository so it’s not a concern for me just now).

Tech of the week

Appears to be the story of my life lately, just as I get excited and proficient on one stack I get side tracked with something else. The latest stack I’m playing with is the Ionic2 framework, but first some history.

 

UX Stacks

I’ve written UX applications in many different way in the past

  • java swing (albeit i’d never put this on my resume as I can’t recall a single bit of that application i helped a student friend with so many years ago)
  • MFC – Oh the pain
  • ATL/WTL – Actually i quite like this back in the old C++ days when men were men.
  • C# Windows forms – Spent years on this stack and if you’re happy with battleship grey it’s still quite RAD
  • WPF/Silverlight – Wrote quite a few applications in this, probably wouldn’t call myself an expert but I can xaml like the next guy
  • MVC3+ – Have written and still support a quite a few MVC applications it was the bridge that finally moved me heavily to web client side tech.
  • Objective-C/XCode – A handful of iPhone applications, it’s ok, language is a little weird yes but use it for a week read a few books/material and you’ll make a good stab at it.
  • Xamarin – A nice approach for writing mobile apps in  c#, problem is you still need to use the native designers (yes i know about xamarin forms.. are we really going to talk about that?)
  • Web tech, My transition to the web was a natural progression that leveraged things I’d learned with other frameworks, e.g Knockout was familiar from wpf data binding, angular has somewhat a familiarity to MVC

Ionic2

So what is Ionic2? In short it’s a framework for writing mobile (and progressive) apps. As you’ve seen above I’ve already ways of writing mobile apps, So why something new? Why not! in this world – always be learning!

In my case there were some more compelling reasons,  see for the last year I was an architect and hands on developer for a new web application using angularjs v1 sass, typescript and a tonne of wonderful libraries. Ionic2 is built around the same stacks, applications use angular2, html5, typescript, saas, gulp etc, the list goes on and on. Apparently I’m finding my home in this world, in fact if i was to write a greenfield desktop application I’d seriously consider writing it with html tech and framing with Atom/Electron.

Sample app

image_thumb2 Taking the application on the left as an example,
I was to create this screen in a few hours, sure i’s not the prettiest and contrasts are high, but the point is that from a blank canvas it only took a few hours to design and implement this screen using Ionic2 and web technologies. I’m a little spoiled as I can somewhat ignore the stubborn elephant in the room *CSS*. i’m targeting the latest devices so I’m getting to use flexbox for layout , css3 transitions etc.

I’m seriously convinced that when it comes to writing general purpose mobile applications Ionic2 will be hard to beat.

I know if i was to write the same screen in xcode/android studio it would take me a lot longer to implement this design.

Check out Ionic2 for yourself you won’t regret it.

Angular Form Validation

Hi all,

Ok this is my very first ever screencast, It’s not very polished but hopefully I’ll get into the swing of things with some more practise.

The screen cast shows how to add validation to forms the Angular.JS way.

 

image

 

 

image

image

Angular.js Auth with ASP WebApi2

So in my previous post I show you how to auth with a bearer token against WebApi2 with the OWIN middleware using a HttpClient. Next up I show you how to do the same with AngularJS.

AngularJS

True to form I’m not going to write a big long blog post on this topic, there are many others that are better than mine. There are even a nice few github hosted solutions you can grab for yourself.

I ended up picking the first post I saw, http://www.codeproject.com/Articles/742532/Using-Web-API-Individual-User-Account-plus-CORS-En

Now lets ignore the CORS part for starters (have banged my head against the walls many times over that).  In order to get this working with the latest and greatest web api as of this post you’ll need two little tweaks

1) Relative URL

The author posts the following code

image

You’ll need to change the baseUrl to an empty string, if you leave it this way (even when correcting the port) you’ll end up in a CORS situation and you’ll see the browser send an OPTIONS request which you don’t want. (in fairness the author was showing CORS working so there is nothing wrong with his/her post).

 

2) Token Payload

image

The important part is that i create a new object ‘data’ and this contains the querystring for the POST body, in the $http call, I then pass data rather than userData like the codeproject article shows.

That’s it, you should now be up and running.

NDepend

Hi all, I’d like to introduce you to what appears to be a great tool for the .net platform. http://www.ndepend.com/

image

I’ve promised to write a review on this tool, however, I’ll be perfectly honest and admit, that I’ve just not got the time right now, so I’m going to take a short cut.

Podcasts

I listen to a lot of podcasts mostly when driving or cycling, recently I’ve started listening to a new podcast http://www.codingblocks.net/ it’s a good podcast and I hope it continues to stick around. As it turns out this podcast did a review on NDepends http://www.codingblocks.net/podcast/ndepend-on-how-good-your-code-is/ and I encourage you to check it out. Moreover; in a more recent episode they mention that they’ve received feedback from Patrick Smacchia (Lead Developer and brains behind the tool) and the feedback they’ve received from Patrick on the few little niggles they encountered is quite positive and upbeat.

When I find myself looking for some tooling like this I’ll write a proper review of my own, but until then based on my interactions with Patrick and after listening to the podcast above, I encourage you, that if you’re in the market for such analysis tools to take NDepends for a spin, and let us know how you get on!