ASP.NET, OWIN and Katana

by Oliver 12. November 2014 13:42

This is a short overview post on OWIN, which (I quote from its homepage)

[…] defines a standard interface between .NET web servers and web applications. The goal of the OWIN interface is to decouple server and application, encourage the development of simple modules for .NET web development, and, by being an open standard, stimulate the open source ecosystem of .NET web development tools.

In other words, the OWIN specification aims to put an end to monolithic solutions like ASP.NET WebForms or even ASP.NET MVC in favor of creating smaller, more lightweight application components that can be chained together to configure an application that does exactly what the author intends it to do – and nothing more. In addition, OWIN simplifies development of alternative web servers that can substitute IIS, e.g. Nowin, or Helios, a promising .NET server alternative on top of IIS but without the heavy, 15-year old System.Web monolith (here's a good review of Helios by Rick Strahl).

Katana is a Microsoft project that contains OWIN-compatible components…

[…] for building and hosting OWIN-based web applications.

For an overview of Katana look here. The Katana architecture can be found on the right and promotes exchangeability of components on each layer. It turns out that ASP.NET vNEXT (github repo here) continues the work that has been done by Microsoft in that direction. Here's an enlightening quote by David Fowler, development lead on the ASP.NET team:

vNext is the successor to Katana (which is why they look so similar). Katana was the beginning of the break away from System.Web and to more modular components for the web stack. You can see vNext as a continuation of that work but going much further (new CLR, new Project System, new http abstractions).

The future of ASP.NET looks bright – especially for developers!

Check out my last post on ASP.NET vNEXT and Docker, too.

Interesting Introduction to SignalR

by Anton 11. November 2014 20:10

Two weeks ago Robin Sedlaczek held an introductory presentation to SignalR at the ALT.NET group in Berlin.

The Framework has a pretty simple setup. After talking a little about the specifics, Robin showed us how to program a simple console application with clients and server, where both can push data to each other, and call functions. If you do not want to delve into specifics, the SignalR framework has a powerful API. It uses different techniques to connect server and client – it chooses the best available, for instance WebSockets.

One simple application where SignalR is useful is a chat. Robin also showed us a real-time collaboration tool (similar to Google drawings in docs). Of course I thought about our new (yet unreleased) time tracking application. It may be feasible to use SignalR if we want to update the clients often. That is not a scenario yet, but could be, if we want to show data from others users.

It was a nice experience to once again attend a meeting at the ALT.NET User Group Berlin group.

enjoyed the post?

Tags:

Creating PDFs of HTML

by Anton 7. November 2014 15:47

For our new time tracking web application (which not yet live) we need the functionality to create a PDF report.

Since we use AngularJS to generate the HTML for the reports, I thought it would be nice to just convert that HTML via JavaScript into a PDF. The search for a solution pointed me to jsPDF – a pretty good tool for creating PDF via JavaScript. But its capabilites to convert HTML into PDF are limited (as of late 2014). We needed to convert a HTML table with all its styles into a PDF. I added jsPdfTablePlugin into the mix, but it still did not look good.

So we abandonded the JavaScript way, and let the backend generate the PDF. I added an MVC view that displays the report, which is then captured via wkhtmltopdf. We already knew this process since we use it in our platform tool discoverize generating invoices. It works smoothly.

enjoyed the post?

Tags:

JavaScript | .NET | C# | PDF

ASP.NET vNEXT, Docker, and the Future of Application Development and Deployment

by Oliver 3. November 2014 09:16

It's been an impressive year so far in the realms of software development and deployment, especially with

Now, it took me a while to understand that we're witnesses of nothing less than a revolution in software development.

The Vision: Build Your App Anywhere, Bundle It, and Run It Anywhere (Else)

The clouds have been with us for a couple of years now and have started to provide real benefit beyond "moving your stuff to somewhere else". What's emerging now, with Docker and also the new ASP.NET runtime bundling, is something completely new: Application Containers. They don't have either specific OS requirements – Docker will be supported natively on Windows Server soon, ASP.NET runs on Linux today – nor need they a specific technology stack installed on the target machine (as with PaaS) because they bring all of the necessary runtime along. But they're also not large VMs bundled with your application, which carry a significant maintenance overhead (when using IaaS). Virtualized application containers are the sweet spot between IaaS and PaaS. Go ahead and read that post – it's eye-opening.

Visual Studio 2013 Hidden Gems

by Oliver 17. October 2014 23:13

This post is one of several summarizing some of the sessions I attended during the .NET Developer Days conference in October 2014. Check out the rest of them.

Here are my notes from a whole day of sessions diving deep into Visual Studio and its possibilities, lead by Kate Gregory:

Window positioning

When drag'n'dropping windows you can drop them in any place you like, even in a place where VS suggests to dock it to another window group, by holding down the CTRL key and then releasing the mouse button.

Using the Start Page

image Probably 3% of all developers use it but it's gotten better over the years. You can now pin projects to it so they won't fall of the most recently used list, you can remove unneeded projects by right clicking or open its folder if you forgot where you keep it.

Also, the start age hides itself once you open a project or a file so you don't have to close it by hand anymore.

Navigating Code

If you want to go to the definition of a symbol just get your cursor on it and press F12 which is the shortcut for Go To Definition. That will open the file that contains the definition of given symbol. Now, if you want to drill down into a deeper hierarchy and don't care for the intermediate definitions, give Alt+F12 a try – it's the shortcut for Peek Definition and it will open the definition of the given symbol in an iframe type of window right inside the code you're looking at. You can then use that window to follow further definitions without leaving the current point of interest. [Can't find that menu item in the Express edition, though.]

Also, give bookmarks a try! There's a bookmark manager where you can give your bookmarks a name, group them into folders and the like. Quite helpful to quickly find your way around a large codebase or for presentations.

Finding things

imageThere's great inline find window by now in VS that you can control from your keyboard in no time. Use Ctrl+F to open it with the word prefilled that your cursor is currently on or use Ctrl+F3 to search for the next occurrence of the word your cursor is on. This little tool is really worth getting to know well because it can save you a lot of time when looking for stuff or replacing it.

imageHave you noticed the search text box at the top of the Solution Explorer? There's even a shortcut to get there so you don't have to take your hand off the keyboard.

Be prepared to find even more search boxes here and there, e.g. the Error List has one, too!

Application Lifecycle Management (ALM)

Visual Studio Online is a new one-stop solution for hosting projects and collaborating on them in the cloud. It basically offers cloud-based TFS instances. The basic plan is free for up to 5 users in a project with an unlimited number of stakeholders, who are allowed view burndown charts, backlogs, Kanban, and task boards, and may even create new Work Items. It supports, of course, TFVC but also Git for source control.

In Visual Studio, use the Team Explorer window to work with your remote TFS, e.g. your Visual Studio Online account, but you can choose to manage your project through a web browser just as well. There's powerful work item editor available online, have a look and take a minute to grasp what all it offers:

image

I'd call it impressive.

There's really a ton of features here, and no doubt there are other tools out there to do the same thing. What really cuts it for me:

  1. Visual Studio Online is free for up to 5 users and an unlimited number of stakeholders.
  2. The integration with Visual Studio is seamless. [You can do pretty much all of the management work either in VS or online.]

Sign out of VisualStudio.com

image If you're logged into VisualStudio.com you can log out by opening the drop-down menu next to your login name, choosing "Account settings…" and there clicking "Sign out". Beware that you have to be logged in with a Microsoft account if you want to use the Express version for longer than 30 days.

Debugging

I'll just put stuff into a list here for better readability:

  1. Have you  met the Autos window? Seems not to be included in the Express version but when hitting a breakpoint it offers insight into all variables used on the current line, the previous line and after exiting a function, shows its return value even if you didn't assign to any variable!
  2. The Locals window captures the values of all variables defined in the current scope without the need to add them to the Watch window.
  3. Press the CTRL key to temporarily hide the variable inspector popup window: image -> hidden-in-vs-debug
  4. Pin values from the above window so you'll keep their values in view – even during the next debugging session!
  5. Set your cursor on a line of code and choose Run To Cursor from the context menu to continue running your code up until the line with the cursor. Wow!
  6. Or choose Set Next Statement to skip all code from the current breakpoint onwards and jump to the selected line. Wow²!
  7. Edit + Continue is also great but works only in 32-bit mode :-|
  8. IntelliTrace (in the Ultimate edition) allows you to capture execution traces of your software on a client machine and debug (through replaying) the same set of instructions inside your local VS – Kate Gregory called it Time Travel Debugging ;-)

That's it from the first day. Happy developing!

.NET Developer Days in Wroclaw

by Oliver 15. October 2014 19:39

I'm currently attending the first .NET Developer Days conference in Wrocław, Poland, and will put up a few posts with my notes from some of the sessions I was able to attend.
The conference took place from 14.10. to 16.10.2014 in the Wrocław Stadium.

Here's a list of all posts (I'll update the links as soon as I finish a given post):

There's already been a lot of input and the third day is still ahead of me! I hope I'll be able to update the above list soon.

Happy Coding!

Getting Started With Meteor On Windows – Or Not

by Oliver 2. October 2014 18:30

Recently, we at teamaton decided to take a break from Camping.Info and discoverize to dive into something new. We wanted to breathe some fresh air, open our eyes and minds for a world outside of our day-to-day development stack of ASP.NET.

During the process we also wanted to check out some tools, frameworks, environments that we'd heard of or read about but hadn't found the time to really take a closer look at.

One of these was Meteor.

What's Meteor about

The elevator pitch on meteor.com reads like this:

Meteor is an open-source platform for building top-quality web apps in a fraction of the time, whether you're an expert developer or just getting started.

I really encourage you, dear Reader, to check out the Meteor site and take a look at what's waiting for you. I really liked what I found there: Pure JavaScript. Live page updates. Hot Code Pushes. Fully self-contained application bundles. And more. That's stuff, .NET developers aren't used to.

Setting up Meteor on Windows

[Note: Before proceeding, please have a look at Meteor's Supported Platforms page just to make sure you're not missing out on anything new.]

This part took me about 2h to get right, so I took notes to save my colleagues or anyone else interested some precious time. I basically followed this comprehensive guide (and I encourage you to do the same) but made a few adjustments.

[A word of warning: Running my first out of the box sample failed and that's where I stopped.]

  1. Install Git and add C:\Program Files (x86)\Git\bin to your PATH variable
  2. Download and install VirtualBox > 4.3.12 from here: https://www.virtualbox.org/wiki/Downloads
  3. Download and install Vagrant >= 1.6.3 from here: http://www.vagrantup.com/downloads.html
  4. Install the ChefDK from here: http://downloads.getchef.com/chef-dk/windows/
  5. Now start a command line and run:
    vagrant plugin install vagrant-berkshelf --plugin-version ">= 2.0.1"
    vagrant plugin install vagrant-vbguest
    vagrant plugin install vagrant-omnibus
  6. Create C:\vagrant and cd into it, then call:
    git clone git://github.com/shoebappa/vagrant-meteor-windows.git meteor
  7. Edit C:\vagrant\meteor\Vagrantfile to use a new virtual machine image (the old one wouldn't work with Meteor's current version): 
    1. In line 8, set: config.vm.box = "trusty64"
    2. In line 10, set: config.vm.box_url = "http://cloud-images.ubuntu.com/vagrant/trusty/current/trusty-server-cloudimg-amd64-vagrant-disk1.box"
    3. In Iine 36, use a different name for your first app
  8. Go to C:\vagrant\meteor and initiate Vagrant (will take a while):
    vagrant up
  9. Now start your app by:
    cd C:\vagrant\meteor
    vagrant ssh
    cd /vagrant/mymeteorapp
    mrt run

Running the app threw a NullReferenceException (or something alike) at me that was triggered from somewhere inside a javascript file – I don't remember exactly where. I tried fiddling around with it for another hour or so, especially when I read that Meteorite (mrt) is no longer needed with Meteor versions >= 0.9.0. But without success.

What to do now?

I shied away from it but you might just feel like setting up a dev environment on a Linux OS and simply running the few lines from the Meteor home page:

 $ curl https://install.meteor.com/ | sh

It seems to simple to be true.

But wait! Official Windows support is coming to Meteor – sometime in the near or farther future. So please check if the future isn't already here!

What we did

We went to grab Angular.js and haven't looked back.

Happy coding!

Sending DateTime Instances From a .NET Server to a JavaScript Client and vice-versa

by Oliver 20. September 2014 21:47

At teamaton we're currently developing our own Time Tracking tool that we'll be using instead of KeepTempo as soon as it's good enough. We even plan on making it accessible to the public later but that's a different story.

We chose Angular.js to develop the frontend and now want to synchronize our time tracking records with our ASP.NET WebAPI backend. One property of such a record is the date and time it was created at, createdUtc. Let's look at how we can send those date-time values to the server and back again.

Some Background on Date and DateTime

JavaScript Date instances are seeded at 01/01/1970 00:00:00 and can be instantiated by passing to the Date() constructor the number of milliseconds that have passed since that moment in time. Date.now() will directly output this number, at the moment of writing these words it returned the value 1 411 240 284 042. This value is what all other representations of a given Date instance will be based on.

In .NET we have the DateTime type and its seed value is 01/01/0001 00:00:00. Internally, DateTime instances count time in Ticks, where one tick equals 100 nanoseconds, i.e. 0.000 000 1 seconds, thus delivering a theoretical precision of 10000 times that of the JavaScript equivalent. When writing these words, the current number of Ticks of DateTime.Now was 635 468 449 058 588 764 (I use LINQPad to execute C# code snippets).

How to Convert JavaScript Date to .NET DateTime

So how do we convert those values into each other?

If we decide to send the number of milliseconds in a given JavaScript Date instance to our .NET server we can reconstruct an equivalent DateTime instance by seeding it with 01/01/1970 and just adding the milliseconds we got from the client to it:

  1. Record.CreatedUtc = new DateTime(1970, 1, 1, 0, 0, 0, DateTimeKind.Utc).AddMilliseconds(milliseconds);

Going the other way, we actually need to get hold of a TimeSpan instance which has the property TotalMilliseconds that gives us what we want. We'll do that by substracting a DateTime instance representing the 01/01/1970 from the DateTime instance we want to send to the client:

  1. (Record.CreatedUtc - new DateTime(1970, 1, 1, 0, 0, 0, DateTimeKind.Utc)).TotalMilliseconds

The code looks a bit ugly because we take care to work with UTC dates so that our code will run the same for clients and servers around the world. It's a very good idea to work with UTC dates internally and only convert them to local dates when you want to display them somewhere.

… or Just Use Date Strings

There's another way to transfer date objects between JavaScript and your server: using a standardized string representation that both sides will be able to generate and parse.

In JavaScript you would use Date.toISOString() and in .NET DateTime.ToString("O") (see the MSDN for the O format string).

Happy coding!

SSL Certificate Jungle – Multiple Domains, Wildcards, and Both

by Oliver 10. September 2014 22:05

Recently, we've decided to add https:// support to Camping.Info. Since we've been running our application servers behind an NGINX reverse proxy for a while now, the natural choice in our setup was to terminate the secured connections at the NGINX server which has CPU usage values somewhere between 1% and 5%. This is also call SSL offloading and will allow us to keep all the SSL setup and potential runtime overhead off of our application servers.

Certificate Options

On Camping.Info, we serve almost all static content from the domain images-camping.info. Since we want to secure the whole site, we need to have valid ssl certificates for images-camping.info and all subdomains of camping.info.

Using Separate Certificates

The first solution to the problem would be using one SSL certificate for images-camping.info and one (wildcard) certificate for *.camping.info that would secure all subdomains of camping.info. If we wanted to secure camping.info itself as well, we would need a third certificate just for that one domain, because wildcard certificates do not cover the parent domain without a subdomain.

Using a SAN (or UCC) Certificate

Subject Alternative Names (SAN) can help in this situation. The subjectAltName field of an SSL certificate can contain many domain names that will be secured by that certificate. In our scenario we could have put images-camping.info, camping.info, www.camping.info, en.camping.info, and the other over 25 subdomains in there. Unfortunately, that would complicate things for the use of new subdomains in the future which would be missing from the list. A wildcard certificate really seems like the natural choice when you have more than 5 subdomains to secure or are expecting to have more of them in the near future.

Using a Wildcard Certificate with SANs

It turns out that wildcard certificates can well be combined with the usage of the subjectAltName field. Most CAs make you pay quite a lot for this combination, but we've also found a quite affordable offer on www.startssl.com.

Multiple SSL Certificates on a Single NGINX Instance – Beware

Choosing the first certificate option, i.e. using at least two certificates we now need to install both of them on our NGINX reverse proxy server.

This blog post on how to install multiple SSL certificates on NGINX is a very good read – but be sure to read the comments as well. It turns out that the Server Name Indication (SNI) extension to the TLS protocol that allows you to do so will lock out clients that don't support SNI. The most prominent example of such a client is any version of Internet Explorer running on Windows XP, and even though Microsoft has ended support of XP almost half a year ago, we're still seeing 11% of our Windows users running XP accounting for 6% of our total traffic – a number we cannot ignore.

Wanting to use separate SSL certificates on one NGINX instance we would need two different IP addresses pointing to that same server so that each certificate could respond to requests on one of those addresses. This would both complicate our setup and incur higher monthly infrastructural costs that we'd gladly avoid.

Installing a Single SSL Certificate on NGINX

The option we finally chose is to use a wildcard SAN certificate where we'd enter images-camping.info, camping.info and *.camping.info as the different subject alternative names. Installing that into NGINX is straight-forward if you know how.

Happy SSL'ing!

Turn Off / Remove Ads in Skype's Chat Window On a Windows OS

by Oliver 19. August 2014 21:37

I've got quite annoyed by seeing the same ad in my Skype chat window and today I simply had enough of it. Going to Google lead me to this Youtube video which shows how to block ads in Skype by denying access to https://apps.skype.com/ in Internet Explorer. Here's a screen shot, just follow the steps below and you're done:

  1. Open Internet Options
  2. Switch to the Security tab
  3. Select Restricted Sites
  4. Click the Sites button
  5. Type https://apps.skype.com/ into the text box
  6. Click Add
  7. Click Close
  8. Click OK

For those changes to take effect in Skype you need to leave your chat window e.g. by clicking on your profile in the upper left corner. Now, when you open a chat window no ads will show.

disable-skype-ads-on-windows

There are other ways to stop Skype from showing ads, and here's a really thorough post on that topic.

Happy Skype'ing!

About Oliver

shades-of-orange.com code blog logo I build web applications using ASP.NET and have a passion for jQuery. Enjoy MVC 4 and Orchard CMS, and I do TDD whenever I can. I like clean code. Love to spend time with my wife and our daughter.

About Anton

shades-of-orange.com code blog logo I'm a software developer at teamaton. I code in C# and work with MVC, Orchard, SpecFlow, Coypu and NHibernate. I enjoy beach volleyball, board games and Coke.