<?xml version="1.0" encoding="utf-8"?>
<feed xmlns="http://www.w3.org/2005/Atom">

  <title><![CDATA[baking websites]]></title>
  <link href="https://bakingwebsites.co.uk/atom.xml" rel="self"/>
  <link href="https://bakingwebsites.co.uk/"/>
  <updated>2016-06-20T15:07:59+01:00</updated>
  <id>https://bakingwebsites.co.uk/</id>
  <author>
    <name><![CDATA[Hook Technologies Ltd]]></name>
    
  </author>
  <generator uri="http://octopress.org/">Octopress</generator>

  
  <entry>
    <title type="html"><![CDATA[Installing node modules in a TeamCity build]]></title>
    <link href="https://bakingwebsites.co.uk/2016/06/20/Installing-node-from-TeamCity/"/>
    <updated>2016-06-20T00:00:00+01:00</updated>
    <id>https://bakingwebsites.co.uk/2016/06/20/Installing-node-from-TeamCity</id>
    <content type="html"><![CDATA[<p><a href="https://nodejs.org"><img src="https://googledrive.com/host/0Bx-8nw9dhAQcN1lWbU1SLW91bEk/nodejs-logo.jpg" class="alignleft" title="node js" /></a></p>

<p>Keeping up with the inexorable rise of front end frameworks is a big challenge in modern web development is. My pathway is probably fairly common, starting out with <a href="https://jquery.com/">jQuery</a> and the humble selector, progressing onto <a href="http://knockoutjs.com/">Knockout</a> and embracing the joy of binding then finally onto the full on framework smorgasbord of <a href="https://angularjs.org/">Angular JS</a>. Now there is a new project on the horizon and Angular 2 has reached a good level of maturity, so &ldquo;Once more unto the breach, dear friends&rdquo; it is time to embrace the new all over again!</p>

<p>Our project stack is a fairly standard .net picture, an ASP.NET MVC application on the front end talking to a REST API server side based on Web Api. Angular 2 sits firmly in the front end application and can be installed through node. I won&rsquo;t go into details of that setup here as Deborah Kurata has already covered that off in her excellent <a href="http://blogs.msmvps.com/deborahk/angular-2-getting-started-with-a-visual-studio-2015-asp-net-4-x-project/">Angular 2 Getting started with Visual Studio post</a>, however the point where I hit trouble was getting the application to build on our TeamCity build server.</p>

<h2>Its Javascript Jim, but not as we know it</h2>

<p>A big benefit of Angular 2 is its built in support for coding in TypeScript, a strongly typed  superset of JavaScript that can be transpiled into JavaScript before it is executed. While TypeScript has been around for quite a while now (compared to Angular 2 anyway!) and is baked into Visual Studio I still needed to get the newest version to enable visual studio to build the scripts. This was simply a case of downloading the latest version of <a href="https://www.microsoft.com/en-us/download/details.aspx?id=48593">TypeScript for Visual Studio 2015</a> and installing.</p>

<p>Once the installation step had been repeated on our build server the compiler also ran through TeamCity. So far so good, however we didn&rsquo;t have the node_modules folder checked into source control (as they are external dependencies containing a crazy number of files!) so the Angular 2 source libraries were not present. Naturally this was a sticking point in getting our javascript code to compile or indeed run as Angular 2 didn&rsquo;t exist in the application on the build server! To fix this we needed to download all the dependencies in the node_modules folder during the build and save them into the expected location in the build servers workspace.</p>

<h2>Hey node, give me the dependencies</h2>

<p>TeamCity has a great plugin model which allows it capabilities to be easily extended and a quick google revealed that a <a href="https://github.com/jonnyzzz/TeamCity.Node">TeamCity Node plugin</a> already existed. After installing the plugin, along with Node on the build server, I was able to add a build step to execute the following command:</p>

<p><code>npm install</code></p>

<p>When this command is executed from the directory of our MVC application it interrogates the <strong>package.json</strong> file and installs all the dependencies listed in the json file. Well, that&rsquo;s what it <strong>should</strong> do, in my case all I got was a long pause followed by a network timeout, doh!</p>

<p>I was prepared for this as we are working behind a corporate firewall and I&rsquo;d already spent quite some time finding out how to get a connection from my development machine. The solution, using the Cntlm Authentication proxy, is handily documented on StackOverflow in this <a href="https://stackoverflow.com/questions/18569054/npm-behind-ntlm-proxy/18570201#18570201">NPM behind NTLM proxy article</a>. However after following all the steps on the build server the network connections were still failing. I tried running the npm install locally on the build server and it worked fine so it seemed that the npm proxy settings were not being used when the program ran through TeamCity. After quite a bit of head scratching I resorted to reading the <a href="https://docs.npmjs.com/files/npmrc">npm manual</a> and there were some clues as to why the config might be ignored. When I looked in my C:\Users\{MyUsername}\ folder I could see a .npmrc file with the proxy settings, however there was no such file in the C:\Users\{TeamCityAgentUser}\ folder. So I copied my .npmrc file into here then bingo, it all worked through TeamCity!</p>

<p>I&rsquo;m sure this won&rsquo;t be the last challenge Angular 2 throws at our Dev Ops efforts but we are in a good place now with the build running inside TeamCity.</p>
]]></content>
  </entry>
  
  <entry>
    <title type="html"><![CDATA[Continuous Delivery to Azure with AppVeyor]]></title>
    <link href="https://bakingwebsites.co.uk/2015/12/22/CI-with-appveyor/"/>
    <updated>2015-12-22T17:07:49+00:00</updated>
    <id>https://bakingwebsites.co.uk/2015/12/22/CI-with-appveyor</id>
    <content type="html"><![CDATA[<p><a href="http://www.appveyor.com/"><img src="https://googledrive.com/host/0Bx-8nw9dhAQcN1lWbU1SLW91bEk/AppVeyorLogo.png" class="alignleft" title="AppVeyor" /></a></p>

<p>I&rsquo;ve been using <a href="https://bakingwebsites.co.uk/2014/07/02/automated-azure-deployments/">Kudu to automate my website deployments</a> from Github to Azure for quite a while and its worked out great. But there are some limitations with it, primarily a lack of control over whether changes are deployed, its very much an all or nothing tool.</p>

<p>The complexity of the web application I&rsquo;m maintaining reached a level where I wanted to ensure that the code builds and passes some automated tests before it is deployed. I couldn&rsquo;t see any way to incorporate those steps into a deployment pipeline with Kudu so decided to try AppVeyor. I&rsquo;d heard about it on <a href="http://www.hanselman.com/blog/AppVeyorAGoodContinuousIntegrationSystemIsAJoyToBehold.aspx">Scott Hanselmans blog</a> and as it is free for open source projects I&rsquo;d been itching to give it a go!</p>

<h2>Build it, build it</h2>

<p>The first step was to get the website to build. Surprising as it may seem the website had never successfully built in Visual Studio as it used an old version of Umbraco which had some compile errors. My options were to either upgrade to a newer version or try and fix the compile errors. The upgrade route looked like it could take some time and fortunately Umbraco is open source so I could download the source code for the version with the issues and patch some fixes. It proved fairly straightforward, basically they has just missed out some files during the packaging of the version.</p>

<p>So now the website built locally in Visual Studio, however MSBuild still refused to build the site, not great as AppVeyor uses MSBuild to compile the website!  After some research I found that the problem was to do with MSBuild attempting to not just build the website but also publish it. As the project is an old style <a href="https://msdn.microsoft.com/en-us/library/dd547590.aspx">Visual Studio <em>website</em> as opposed to a <em>web application</em></a> the options through MSBuild were somewhat limited as it only exposed a subset of the options for the <a href="https://msdn.microsoft.com/en-us/library/ms229863.aspx">aspnet compiler</a>. However I found that the publish option could be disabled by manually tweaking the solution file to remove the settings controlling the publish of the website, if your interested in the details you can see the change for this in <a href="https://github.com/MikeHook/MSTC/commit/7f352956d21ef7fb3b153fbdf756048a6849a310">this commit</a>. The only drawback with this technique is that Visual Studio trys to helpfully replace these settings each time you save a change to the solution file, another option I may investigate would be to use a custom build script in App Veyor.</p>

<p>The only additional setup I needed to take to get AppVeyor to build the projects was to tell it to restore the nuget packages, as I hadn&rsquo;t checked them into source control. This was simply achieved by adding the following &lsquo;Before build script&rsquo; to the AppVeyor project settings:</p>

<p><code>nuget restore</code></p>

<h2>Tasty Tests</h2>

<p>With all the solution projects building the next step was to configure the tests to run. With AppVeyor this is a zero configuration step as it auto detects any projects containing unit tests and runs them. However to speed things along you can explicitly define the path to the assembly containing your tests in the AppVeyor settings. After doing this AppVeyor gives a test runner output in the console (shown below) along with a <a href="https://ci.appveyor.com/project/MikeHook/mstc/build/tests">nice testing report which you can see directly in AppVeyor here</a>.</p>

<p><img src="https://googledrive.com/host/0Bx-8nw9dhAQcN1lWbU1SLW91bEk/AppVeyorTests.png" title="AppVeyor Test Console" /></p>

<h2>AppVeyor, meet Azure</h2>

<p>The final part of the jigsaw was to setup automated deployments, my requirements for this were:</p>

<ul>
<li>Deployment to be triggered after a successful test run (default AppVeyor behaviour)</li>
<li>Deploy all added, deleted and changed files to Azure</li>
<li>Deploy changes commited to the staging branch to the staging site</li>
<li>Deploy changes commited to the master branch to the live site</li>
</ul>


<p>AppVeyor has a range of options for deployment including several specifically for Azure Cloud sites. However as my application is an old website I just wanted a basic file orientated publish and Web Deploy offered what I was looking for. There is a handy guide on the App Veyor docs for <a href="http://www.appveyor.com/docs/deployment/web-deploy#azure-web-sites">setting up Web Deploy with Azure sites</a> so I won&rsquo;t repeat that here. However there were some custom configuration steps I needed to take:</p>

<ul>
<li>Add a path to the artifacts in App Veyor. These are the files which Web Deploy phyically copys to the Web Server. In my case this was just the whole &lsquo;website&rsquo; directory.</li>
<li>Check the &lsquo;Remove additional files at destination&rsquo; option to ensure files I&rsquo;ve deleted locally are removed from the web server.</li>
<li>Specify &lsquo;Skip directories&rsquo; to ensure assets and cached files for Umbraco are not removed. For my site the &lsquo;Skip directories&rsquo; setting is &lsquo;\App_Data;\media;\data&rsquo;.</li>
<li>Setup 2 separate Deployment providers, with the &lsquo;Deploy from branch&rsquo; option set to &lsquo;staging&rsquo; for the staging site and &lsquo;master&rsquo; for the live site.</li>
</ul>


<p>So now whenever I push changes up to github App Veyor checks which branch I&rsquo;ve pushed to and runs the deployment provider setup for that branch, you can see what has happened at the end of the <a href="https://ci.appveyor.com/project/MikeHook/mstc">console report</a>. I&rsquo;ve been really impressed with the usability and range of options available in App Veyor, it all comes at an unbeatable price of totally free for open source projects and best of all I get to put these <a href="https://github.com/MikeHook/MSTC">cool badges on my repo</a> now!</p>

<p><a href="https://github.com/MikeHook/MSTC"><img src="https://googledrive.com/host/0Bx-8nw9dhAQcN1lWbU1SLW91bEk/AppVeyorBadges.png" title="MSTC Repo badges" /></a></p>
]]></content>
  </entry>
  
  <entry>
    <title type="html"><![CDATA[Inspiring software design]]></title>
    <link href="https://bakingwebsites.co.uk/2015/09/06/inspiration/"/>
    <updated>2015-09-06T18:07:49+01:00</updated>
    <id>https://bakingwebsites.co.uk/2015/09/06/inspiration</id>
    <content type="html"><![CDATA[<p><a href="http://www.603copywriting.co.uk/blog-post-ideas/"><img src="https://googledrive.com/host/0Bx-8nw9dhAQcN1lWbU1SLW91bEk/idea.jpg" class="alignleft" title="Ideas lightbulb" /></a></p>

<p>The software design process can sometimes be difficult to quantify. From an external perspective of a development team, requirements go in and working software comes out. But what exactly happens in the middle to turn the stakeholders hopes and dreams into reliable, executable code?</p>

<p>At its core software design is a methodical, incremental engineering process and there are no short cuts to this process if we want to produce good results. However making really great software that will stand the test of time often requires a little something extra, a bit of inspiration. So where exactly does that spark come from and how can we help create the conditions to nurture it?</p>

<h2>A sticky design problem</h2>

<p>I&rsquo;ve recently been working on a feature to enable users to update their profiles through a web application. This is a pretty standard problem however some extra complexities were introduced by the target platform. Chief among those was the user interface which needed to be asynchronous and fit in with the applications existing front end <a href="https://en.wikipedia.org/wiki/Single-page_application">SPA framework</a>.</p>

<p>I like to implement using the &lsquo;<a href="http://programmers.stackexchange.com/questions/166409/tdd-outside-in-vs-inside-out">outside in</a>&rsquo; approach so began with the user interface, adding one section at a time then abstracting any common patterns to make them reusable. However, after a day at the coal face writing code I took a step back and wasn&rsquo;t pleased with my results. The code was reaching a point where I was struggling to keep track of the workflow in my own head which doesn&rsquo;t exactly bode well for the poor guy that would inevitably need to modify it 6 months down the line. The trouble was no matter how hard I stared at those lines of code a more elegant and simple solution would not present itself!</p>

<p>The very next day I woke up feeling sick and not be able to get into the office to finish implementing the UI. However, it may well have been the most productive &lsquo;time off&rsquo; work I&rsquo;ve had in some time. As I recuperated watching Hobbits and Orcs do battle on a grand scale my mind drifted back to the problems I&rsquo;d been having yesterday. It suddenly became clear to me that I had been abstracting at too low a level and trying to fit all of the behaviour into a single javascript module. However if I just created a single module per user profile element I could create a common &lsquo;interface&rsquo; for each module and easily iterate over them in the main module.</p>

<h2>Emergent architecture</h2>

<p>This new approach had all the hallmarks of a good design as my own reaction was along the lines of &lsquo;that is so obviously better, why didn&rsquo;t I just do it like that in the first place?!&rsquo; That is a pertinent question, and one that has probably troubled many a software developer. However my feeling is that often it is not possible to skip the &lsquo;bad design&rsquo; and go straight to the better solution because you don&rsquo;t know what all the problems are going to be until you start implementing. Thomas Edison summed this up nicely in one of his most famous quotes:</p>

<blockquote><p>What it boils down to is one per cent inspiration and ninety-nine per cent perspiration.</p><footer><strong>Wikiquote</strong> <cite><a href='https://en.wikiquote.org/wiki/Thomas_Edison'>Thomas Edison</a></cite></footer></blockquote>


<p>While its certainly true that experience can help you see patterns and spot the problems earlier I think it is a mistake to try and design everything meticulously up front. There is bound to be some devil in the detail which makes you pivot on the design halfway through so a lot of that up front time will have been wasted.</p>

<p>I find it is best to have a balance, with an initial high level draft plan for the implementation usually implemented through UML modelling. This helps guide lower level design decisions and keep one eye on the bigger picture. To make the lower level design decisions I try and stay agile, adapt the code as I&rsquo;m going along and keep complexity at a minimum.</p>

<h2>Encouraging those aha! moments</h2>

<p>Often my best ideas are formed away from the computer, hours or even days after the initial problem arose. The sub conscious mind is an amazing tool which can help you solve many intractable issues if you can give it the space and time to join up those dots. Despite what our employment contracts may say, software development really isn&rsquo;t a 9 to 5 job. In fact working &lsquo;harder&rsquo; during those office hours can sometimes be counter productive when it comes to making great software. Good decisions and great solutions are formed in relaxed and fresh minds, for that reason I&rsquo;d have to list my bike as one of my most essential software design tools!</p>

<p>As developers we can encourage good software design by focussing on a couple of key elements:</p>

<ul>
<li>Collaborate on design, decisions should be guided by <a href="http://blog.codinghorror.com/the-ten-commandments-of-egoless-programming/">the ten commandments of egoless programming</a></li>
<li>Ensure your estimates include enough contingency to allow for rapid prototyping and iterations during implementation.</li>
<li>Stay pragmatic; aim high but know that perfection is subjective. Establishing coding standards can help guide when a design is good enough</li>
</ul>


<p>Do you have any particular techniques to help inspire your software designs? If so I&rsquo;d love to hear about them and try them out myself!</p>
]]></content>
  </entry>
  
  <entry>
    <title type="html"><![CDATA[Rebase your way to Git enlightenment]]></title>
    <link href="https://bakingwebsites.co.uk/2015/08/16/rebase-git-enlightenment/"/>
    <updated>2015-08-16T18:07:49+01:00</updated>
    <id>https://bakingwebsites.co.uk/2015/08/16/rebase-git-enlightenment</id>
    <content type="html"><![CDATA[<p><img src="/images/posts/Pat-Morita_Karate_Kid_200.jpg" class="alignleft" title="Pat Morita" /></p>

<p>The path to Git enlightenment can be a long one for a developer used to centralized source control such as SVN.</p>

<p>The first signs of trouble usually occur when trying to apply changes from one branch of code to another. Some file change conflicts are likely if the same source file has been changed on both branches. The source control system has no way to know which changes should be kept so it will quite rightly ask the developer to choose, however this can cause some difficulty if the changes have been made by someone else who may not even be around to ask what has happened.</p>

<p>I have a feeling that the great Mr Miyagi would have loved using Git, as patience and dedication to the ways of <a href="https://en.wikipedia.org/wiki/Distributed_revision_control">DVCS</a> are well rewarded in time. Indeed, dealing with branches is one situation where patience is important to avoid introducing regression bugs.</p>

<blockquote><p>Patience, young grasshopper.</p><footer><strong>Wikipedia</strong> <cite><a href='https://en.wikipedia.org/wiki/Kesuke_Miyagi'>Kesuke Miyagi</a></cite></footer></blockquote>


<p>There are a couple of different techniques which can be used to bring the changes on two branches together and the Atlassian site has a great write up of these in it&rsquo;s <a href="https://www.atlassian.com/git/tutorials/merging-vs-rebasing/">merging vs rebasing article</a>. The article describes the following scenario, you have created a <strong>feature</strong> branch from the <strong>master</strong> and made some commits to your branch. Someone else has since made some changes to the master branch which you now need to include in your branch, to get these changes you can either merge or rebase.</p>

<p>My personal preference is to use the rebase command where possible for one key reason, <strong>merge conflicts are easier to resolve!</strong> The reason for this is that when rebasing you apply <strong>your changes</strong> on top of the master changes. This is different to a merge which will apply the master changes on top of your feature changes. So effectively any conflicts which occur will be due to changes made by yourself instead of someone else. My memory may not be great but I stand roughly 100% more chance of remembering something I&rsquo;ve done as opposed to something someone else has done!</p>

<p>Hopefully you can see the benefits of this and are thinking, &lsquo;great I&rsquo;m going to give that a go!&rsquo; But before you rush off a few words of warning, there is potential for things to go horribly wrong.</p>

<blockquote><p>First learn stand, then learn fly</p><footer><strong>Wikipedia</strong> <cite><a href='https://en.wikipedia.org/wiki/Kesuke_Miyagi'>Kesuke Miyagi</a></cite></footer></blockquote>


<p>The trouble comes if there are 2 people working on the feature branch who have both pushed changes to a remote repository. If you haven&rsquo;t fetched their changes before you push the rebased feature branch their changes will get overwritten and lost forever! That would be bad but Git does try to help you out by blocking the push, actually the only way you can push the rebased branch is by passing an extra parameter to <strong>force</strong> the push. So this acts as a nice reminder to think about what you are doing, only tick that &lsquo;force push&rsquo; box if you are sure your branch is fully up to date. Actually I&rsquo;d never use rebase if I had any doubt that anyone else might be working on the same branch as me.</p>

<p>A final note about rebase, it may be difficult to carry out with some Git GUI tools. Some of my colleagues like using <a href="https://www.sourcetreeapp.com/">Source Tree</a> and I&rsquo;ll agree it does look nice, however it doesn&rsquo;t support this workflow well at all. After starting a rebase you get left in a weird limbo state and have to keep re-requesting to rebase the branches after each and every commit. Then once the rebase is complete there is no way to force the push through the UI, you have to drop down to the command line to complete the action. I&rsquo;d recommend giving <a href="https://code.google.com/p/gitextensions/">Git Extensions</a>, the reliable Ford Mondeo of Git GUIs, a go for this scenario, it work much more smoothly.</p>
]]></content>
  </entry>
  
  <entry>
    <title type="html"><![CDATA[Making awesome software with Lean principles - Part II]]></title>
    <link href="https://bakingwebsites.co.uk/2015/07/26/lean-awesome-part-II/"/>
    <updated>2015-07-26T18:07:49+01:00</updated>
    <id>https://bakingwebsites.co.uk/2015/07/26/lean-awesome-part-II</id>
    <content type="html"><![CDATA[<p><img src="/images/posts/Font-Awesome.jpg" class="alignleft" title="Awesome image by Roberlan https://www.flickr.com/photos/roberlan" /></p>

<p>In the <a href="https://bakingwebsites.co.uk/2015/07/19/lean-awesome-part-I/">first part of Making awesome software with Lean principles</a> I started looking at how <a href="https://en.wikipedia.org/wiki/Lean_software_development">Lean principles</a> have helped me while working on the <a href="http://midsussextriclub.com/">Mid Sussex Tri Club website</a>.</p>

<p>The first three principles <strong>Eliminating waste</strong>, <strong>Amplifying learning</strong> and <strong>Deciding as late as possible</strong> are all fundamental to help guide software development. However they only form part of the picture, there are still four more principles remaining that help guide our decisions so let&rsquo;s take a look at them now.</p>

<h2>Deliver as fast as possible</h2>

<blockquote><p>In the era of rapid technology evolution, it is not the biggest that survives, but the fastest. The sooner the end product is delivered without major defects, the sooner feedback can be received, and incorporated into the next iteration.</p><footer><strong>Wikipedia</strong> <cite><a href='https://en.wikipedia.org/wiki/Lean_software_development'>Lean Software Development</a></cite></footer></blockquote>


<p>I&rsquo;ve seen the benefits of an iterative approach over and again throughout my professional life so I regard this as an essential principle to apply to all software projects. I put in place a pretty slick release process as one of the first changes I made and have been reaping the benefits ever since. Basically any check-ins on the master branch of the source code repository are immediately deployed to the website. I&rsquo;ve already blogged about how I set-up this <a href="https://bakingwebsites.co.uk/2014/07/02/automated-azure-deployments/">&lsquo;zero-click&rsquo; deploy process</a> and it has worked largely without problems since set-up.</p>

<p>However, this technique must be used with caution and certainly in tandem with the &lsquo;<strong>Build quality in</strong>&rsquo; principle. It is essential to ensure that a suitable branching process is in place too and changes can only be deployed once they have been tested. If you are working in a larger team I&rsquo;d recommend limiting write access to the master branch to a single person who can coordinate the deployments. While automation is great for productivity people still need to understand how it all works and retain control of the systems.</p>

<h2>Empower the team</h2>

<blockquote><p>The lean approach favors the aphorism &#8220;find good people and let them do their own job,&#8221; encouraging progress, catching errors, and removing impediments, but not micro-managing.</p><footer><strong>Wikipedia</strong> <cite><a href='https://en.wikipedia.org/wiki/Lean_software_development'>Lean Software Development</a></cite></footer></blockquote>


<p>I have been fortunate to be involved with an organisation that trusted me to make the technical decisions. I presented my ideas on the features to implement and got feedback on any changes they thought may be needed. So I was empowered to make the changes as and when they were needed. However I also think it is important to &lsquo;bring the stakeholders with you&rsquo; when making the changes. This has several benefits, not only does it help ensure that the features are relevant, it also gives me some good candidates for people to test the system before it goes live, which brings me neatly onto the next principle!</p>

<h2>Build quality in</h2>

<blockquote><p>Conceptual integrity means that the system’s separate components work well together as a whole with balance between flexibility, maintainability, efficiency, and responsiveness.</p><footer><strong>Wikipedia</strong> <cite><a href='https://en.wikipedia.org/wiki/Lean_software_development'>Lean Software Development</a></cite></footer></blockquote>


<p>As I mentioned earlier, this principle acts as a counterweight to some of the other Lean principles, such as <strong>Deliver as fast as possible</strong>, to help ensure that changes are not rushed and the software doesn&rsquo;t accumulate bugs and brittle implementations. For this project I&rsquo;ve not had the luxury of any other developers who could review the code, however I&rsquo;ve still ensured that changes are functionally reviewed before deploying them to the live site. To facilitate this I&rsquo;ve setup a &lsquo;staging&rsquo; environment using the same deployment technique running off a separate &lsquo;staging&rsquo; repository branch. I first implement the changes on the staging branch and only merge them into the live &lsquo;master&rsquo; branch once someone has tested them out on the staging website.</p>

<p>On one occasion I skipped the staging process and fate taught me a lesson! The update was to use an Umbraco plugin to automatically resize images but little did I know that there was a memory leak in the Umbraco plugin which meant the site quickly went over its memory allocation and Azure automatically took it offline. That was a nasty surprise to find on the live site and some load testing in the staging environment would certainly have helped!</p>

<h2>See the whole</h2>

<blockquote><p>By decomposing the big tasks into smaller tasks, and by standardizing different stages of development, the root causes of defects should be found and eliminated.</p><footer><strong>Wikipedia</strong> <cite><a href='https://en.wikipedia.org/wiki/Lean_software_development'>Lean Software Development</a></cite></footer></blockquote>


<p>There are two key elements to the last principle, <strong>See the whole</strong>. I&rsquo;ve already talked about how the staging and live environments are standardized, in my case this was a fairly trivial exercise made easy by modern hosting tools such as Azure and github that enable multiple environments to be set up at very low cost. The small fee to run an extra Azure database is well worth the value it adds for  the club.</p>

<p>The second element recommends splitting tasks into smaller pieces and is certainly one that I&rsquo;d advocate. Limiting the number of changes made at any one time really helps with tracking down issues. Its a practice which I&rsquo;ve learnt the hard way over the years, it can be tempting to try and &lsquo;fix the world&rsquo; when you get your hands on a code-base and hammer out a high number of changes in a short time. However, not only does this massively increase the probability for bugs, it also makes finding them much more difficult. Looking for a bug in a commit with 50+ changed files isn&rsquo;t much fun!</p>

<p>I&rsquo;ve used the <a href="https://github.com/MikeHook/MSTC/issues">github issue tracker</a> on this project, which may seem a bit odd when there is no one else to share the work with, however it has helped keep me focussed on what I&rsquo;ve been trying to achieve, also its nice to get the satisfaction of pressing the &lsquo;Closed&rsquo; button after fixing each issue!</p>

<h2>Lean == Awesome</h2>

<p>I hope you&rsquo;ve enjoyed reading about my experiences with Lean principles. I&rsquo;d love to hear about any opinions you&rsquo;ve got regarding the way I&rsquo;ve interpreted the principles or how you&rsquo;ve used the principles to make your own awesome software, so feel free to comment on the posts below!</p>
]]></content>
  </entry>
  
  <entry>
    <title type="html"><![CDATA[Making awesome software with Lean principles - Part 1]]></title>
    <link href="https://bakingwebsites.co.uk/2015/07/19/lean-awesome-part-I/"/>
    <updated>2015-07-19T18:12:49+01:00</updated>
    <id>https://bakingwebsites.co.uk/2015/07/19/lean-awesome-part-I</id>
    <content type="html"><![CDATA[<p><a href="http://midsussextriclub.com"><img src="/images/posts/MSTC _logo_yellow_280.jpg" class="alignleft" alttext="MSTC Logo" /></a></p>

<p>I&rsquo;ve been a keen amateur triathlete and member the <a href="http://midsussextriclub.com">Mid Sussex Tri Club</a> for a couple of years. Its a relatively small club but there is a surprising amount of administration involved in running it and after chatting to some of the clubs committee members it was clear that the admin overheads were becoming a burden. I could see the potential for software to help lessen the burden so I offered to take on the club&rsquo;s website and add some features to it.</p>

<p>Fast forward a year and we have a greatly enhanced website with new features that have helped grow the club without taking up more of people&rsquo;s time. Throughout making these changes I&rsquo;ve applied Lean software principles which have really helped me. So in this post I&rsquo;m taking a look at the first 3 principles of Lean and how these have assisted on this project.</p>

<h2>Eliminate waste</h2>

<blockquote><p>Lean philosophy regards everything not adding value to the customer as waste.</p><footer><strong>Wikipedia</strong> <cite><a href='https://en.wikipedia.org/wiki/Lean_software_development'>Lean Software Development</a></cite></footer></blockquote>


<p>I had great motivation to ensure that this principle was applied as I&rsquo;ve been making all the changes during my spare time. Its amazing what you can achieve in a short amount of time with a bit of planning. For example just last week I was able to add 2 new payment options to the site in an hour. The key techniques I&rsquo;ve used to help eliminate waste are:</p>

<ul>
<li>Make sure I understand what the key stakeholder wants to achieve from the feature before implementing it</li>
<li>Design directly in HTML &ndash; I&rsquo;ve designed all the new user interfaces directly in HTML so when it comes to implementing the feature I just need to enhance the existing HTML with the dynamic data elements</li>
<li>Use third parties to do the heavy lifting (ie. don&rsquo;t reinvent the wheel). For this project the key third party systems used are <a href="http://umbraco.com/">Umbraco</a> for content management, <a href="http://getbootstrap.com/">Bootstrap</a> for styling and <a href="https://gocardless.com/">GoCardless</a> for online direct debit payments</li>
</ul>


<h2>Amplify learning</h2>

<blockquote><p>Software development is a continuous learning process with the additional challenge of development teams and end product sizes.</p><footer><strong>Wikipedia</strong> <cite><a href='https://en.wikipedia.org/wiki/Lean_software_development'>Lean Software Development</a></cite></footer></blockquote>


<p>Working in a development team of one on this particular project obviously made knowledge sharing a non issue, however there were opportunities to ensure learning was applied instead of doing things the old way. Integrating the GoCardless payment system presented a great opportunity for learning. The club were reluctant to extend the existing paypal based solution due to the fees involved, with paypal charging nearly 4% per transaction.  So I did some research and found that the GoCardless direct debit service charged just 1% per transaction.</p>

<p>We decided to trial the system and I was pleasantly surprised by how intuitive it was it integrate with. They have <a href="https://developer.gocardless.com/">top notch documentation of their API</a> and client libraries for a wide range of platforms including ours, .NET. I had a test payment process integrated with our website within a couple of hours, their support was also excellent and helped clarify the few points I wasn&rsquo;t clear on regarding setting up specific redirect URLs.</p>

<p>The system has been up and running for around 6 months now and the only issue we&rsquo;ve had was with some intermittent error responses. Again their support team looked into the problem as soon as I raised it and implemented a fix. I&rsquo;m glad that I took the time to learn how to integrate with GoCardless as it has saved our small club hundreds of pounds in fees already!</p>

<h2>Decide as late as possible</h2>

<blockquote><p>As software development is always associated with some uncertainty, better results should be achieved with an options-based approach, delaying decisions as much as possible until they can be made based on facts and not on uncertain assumptions and predictions.</p><footer><strong>Wikipedia</strong> <cite><a href='https://en.wikipedia.org/wiki/Lean_software_development'>Lean Software Development</a></cite></footer></blockquote>


<p>Taking this approach has helped me avoid the common &lsquo;analysis paralysis&rsquo; problem whereby you try and solve too many problems at once, tie yourself in knots and deliver nothing! I deferred the implementation of several tricky  features and was pleasantly surprised that the solutions turned out to be more straight forward than I&rsquo;d originally anticipated.</p>

<p>For example we wanted to add an online entry system for several club events however the we needed to accept entries from club members, affiliated club members or guests. My initial thinking was to have an entry form for each type of entrant with some reporting so the event organisers could see who had entered. This sounded like a big feature that would take weeks to implement. So I started by just adding a simple form for existing members to enter our Duathlon event (fortunately no guests were allowed for our Duathlon!). Later on I returned to the problem of adding guest entries and suddenly it became obvious to me that guests could be members of the website as well just with a different role to limit their access. Then the same entry forms could be used for everyone and I wouldn&rsquo;t have to add any new reporting. Deferring the decision for how to implement this feature saved me loads of time and resulted in a simpler system, wins all round!</p>

<h2>Stay tuned for part II&hellip;</h2>

<p>The first three principles of Lean development have really helped me deliver on this project but there are still four more principles to go, so if you&rsquo;ve found this interesting check back soon for part II in the series!</p>
]]></content>
  </entry>
  
  <entry>
    <title type="html"><![CDATA[Tin Can API overview]]></title>
    <link href="https://bakingwebsites.co.uk/2014/08/13/tin-can-api-overview/"/>
    <updated>2014-08-13T10:10:43+01:00</updated>
    <id>https://bakingwebsites.co.uk/2014/08/13/tin-can-api-overview</id>
    <content type="html"><![CDATA[<p><img src="http://imageshack.com/a/img539/1961/OgE8tH.jpg" class="alignleft" alttext="Tin Can API Logo" /></p>

<p>These are some notes from my reading on the Tin Can API, a specification for the transmission and storage of messages related to learning activities. The specification has been developed by parties in the e-learning industry and aims to be an elegant solution to enable learning systems to communicate with one another.</p>

<p>All this information is available on the <a href="http://tincanapi.com/">Tin Can API website</a>, this is just my own <a href="http://en.wikipedia.org/wiki/Wikipedia:Too_long;_didn't_read">tl;dr</a> type summary.</p>

<h3>What is it?</h3>

<ul>
<li>A RESTful web service specification</li>
<li>Defines the structure for JSON messages which represent learning activities (Or other types of activity)</li>
<li>Each message is called a <strong>Statement</strong></li>
<li>A statement consists of 3 parts: <strong>Actor</strong>, <strong>Verb</strong> and <strong>Object</strong> like &ldquo;Mike read the Tin Can Explained article&rdquo;</li>
<li>Based on the <a href="http://activitystrea.ms/">activity streams</a> specification developed by/for social networks</li>
</ul>


<h3>Why is it good?</h3>

<ul>
<li>More flexible version of the old SCORM standard</li>
<li>Device agnostic &ndash; anything that can send HTTP requests can use the API</li>
<li>Almost any type of content can be stored</li>
<li>Decouples content from the LMS (Learning management system) by storing in a separate LRS (Learning Record Store)</li>
<li>A single <em>statement</em> can be stored in multiple learning record stores</li>
<li>Allows potential for a learner owning their own content instead of their employers</li>
<li>Data is accessible and easy to report on</li>
</ul>


<h3>A statement example</h3>

<pre><code>{
    "actor": {
        "name": "Sally Glider",
            "mbox": "mailto:sally@example.com"
        },
    "verb": {
            "id": "http://adlnet.gov/expapi/verbs/experienced",
            "display": {"en-US": "experienced"}
     },
    "object": {
            "id": "http://example.com/activities/solo-hang-gliding",
            "definition": {
                "name": { "en-US": "Solo Hang Gliding" }
            }
    }
}
</code></pre>

<p>You can generate test statements with valid syntax using the <a href="http://tincanapi.com/statement-generator/">Statement Generator</a></p>

<p>Details of the valid message formats are given on the <a href="https://github.com/adlnet/xAPI-Spec/blob/master/xAPI.md">full xAPI specification</a>.</p>

<h2>The registry</h2>

<ul>
<li>Contains definitions for verbs, activities, activity types, attachment types and extensions</li>
<li>Should be referenced to in messages by URIs</li>
<li>A shared domain language for agreed definitions of terms</li>
<li>Anyone can add their own definitions to <a href="https://registry.tincanapi.com/">the registry</a></li>
</ul>


<h2>Recipes</h2>

<ul>
<li><a href="http://tincanapi.com/recipeshow-it-works/">Recipes</a> provide a standardised way for people to describe activities</li>
<li>Simplifies reporting as the same terms should be used to describe things</li>
<li>A few recipes exist now, for example the <a href="https://registry.tincanapi.com/#profile/19">video recipe</a></li>
<li>More recipes can be added by the community</li>
<li>Helps keep the API flexible and useful for future applications that may not even exist yet!</li>
</ul>


<p>Reading about the Tin Can API over the last few days and seeing it in action in the <a href="https://www.tessello.co.uk">Tessello application</a> has really whet my appetite to work more with the specification. I can see great potential for systems that leverage this specification as it provides a flexible framework for messaging without being restrictive and gives us the basis for a common technical language to use to enable our systems to talk to one another.</p>
]]></content>
  </entry>
  
  <entry>
    <title type="html"><![CDATA[Automated Azure deployments]]></title>
    <link href="https://bakingwebsites.co.uk/2014/07/02/automated-azure-deployments/"/>
    <updated>2014-07-02T10:29:24+01:00</updated>
    <id>https://bakingwebsites.co.uk/2014/07/02/automated-azure-deployments</id>
    <content type="html"><![CDATA[<p><img src="http://imagizer.imageshack.us/v2/320x240q90/850/r38o.jpg" class="alignleft" alttext="Wall-e the robot" /></p>

<p>Azure web site hosting has a great built in feature for deployment automation. All you need to do is point Azure at the location of your website in your source control platform and it will automatically monitor for updates, pull them into Azure and deploy them, Boom! Well that is the theory anyway, turns out in my case I needed to do some tweaking to get the automation to work.</p>

<h2>Tinkering under the hood</h2>

<p>The first step to set up the automated deployment is involves going to your Azure website dashboard and selecting &lsquo;Setup up deployment from source control&rsquo;. There are a bunch of options for what source control services are supported and how they can be setup, this is all pretty well documented in the <a href="" title="https://azure.microsoft.com/en-us/documentation/articles/web-sites-publish-source-control/">Azure publishing from source control article</a> so I won&rsquo;t rehash all of that here. Suffice to say I pointed the website at my github repo and sorted out all the authentication, then Azure pulled through a fresh version to deploy.</p>

<p>Unfortunately when I checked the shiny new &lsquo;Deployments&rsquo; tab I found that the deployment had failed, after looking in the error log the reason was clear enough:</p>

<blockquote><p>&ldquo;Error: The site directory path should be the same as repository root or a sub-directory of it.&rdquo;</p></blockquote>

<p>My website was not in the root folder of the repository, it is in a &lsquo;website&rsquo; folder as you can see in the <a href="" title="https://github.com/MikeHook/MSTC">repo here</a>. so I needed to tell whatever magic was running these deployments to check in that folder instead for the code changes. After a bit of googling I found out that the deployments are driven by an application called kudu which has some documenation on its <a href="" title="https://github.com/projectkudu/kudu/wiki">github wiki</a>. Turns out that it is pretty straight forward to modify the folder, as explained on the <a href="" title="https://github.com/projectkudu/kudu/wiki/Customizing-deployments">customising deployments wiki page</a> I just had to add a .deployment file to the repository root with these contents:</p>

<pre><code>[config]
project = website
</code></pre>

<p>Simples, the deployment worked fine after adding that file&hellip; well it did when I just tried it but previously it didn&rsquo;t seem to work. Either I made some stupid syntax error previously or kudu got fixed since last time I tried!</p>

<h2>A robot to build a robot</h2>

<p>The actual website is running a different configuration based on a custom deployment script, while this is a little OTT to just change the folder path going the extra mile paid dividends later on when I needed to make some other customisations during the deployment. It was pretty straightforward to set up, thanks to the azure-cli tool which generates a deployment script for you based on a set of parameters. Instructions on how to do this are on the <a href="" title="https://github.com/projectkudu/kudu/wiki/Deployment-hooks">kudu wiki deployment hooks page</a>. In my case I just needed to run the following command from my repository root to generate a working .deployment and deploy.cmd file.</p>

<pre><code>azure site deploymentscript --aspWebSite -r website
</code></pre>

<p>Once checked in those files are used by kudu to control the automated deployment process. Check back in Azure and the deployment should now be showing as successful, awesome!</p>
]]></content>
  </entry>
  
  <entry>
    <title type="html"><![CDATA[Mysql to Azure database migration]]></title>
    <link href="https://bakingwebsites.co.uk/2014/06/19/mysql-to-azure-database-migration/"/>
    <updated>2014-06-19T16:57:57+01:00</updated>
    <id>https://bakingwebsites.co.uk/2014/06/19/mysql-to-azure-database-migration</id>
    <content type="html"><![CDATA[<p><img src="http://imagizer.imageshack.us/v2/320x240q90/843/31nm.jpg" class="alignleft" alttext="Square peg - Round hole"  /></p>

<p>If you have read my previous post on <a href="https://bakingwebsites.co.uk/2014/04/28/migrating-umbraco-4-mysql-to-azure-hosting/">Umbraco to Azure migration</a> the topic of this post will be of no surprise.</p>

<p>I&rsquo;ve inherited an application using a MySQL database which I&rsquo;d like to host in Azure. However the hosting support for a MySQL database in Azure is expensive. So I have investigated migrating the DB into an SQL Azure supported format.</p>

<h2>What about a VM?</h2>

<p>That is a good question and one I didn&rsquo;t immediately consider. The Azure platform offers so many options that sometimes the most obvious can be missed. An easy way to keep the MySQL database without needing to fork out for the <a href="https://www.cleardb.com/">ClearDB</a> service is to just spin up an Azure VM, install MySQL on the VM and host everything from there.</p>

<p>This option offers a low overhead entry to hosting the site in Azure, with a lower cost than ClearDB. However I decided not to pursue it as it negates some of the advantages of cloud hosting, one of the aspects of Azure that is attractive is how streamlined you can make the deployment process, you can either download a publish profile and deploy directly from visual studio or hook it directly into your source control and deploy on check in. Also I must admit all the shiny monitoring graphs for Azure websites are pretty cool and give you great visibility of how your hosting is performing. Granted all these features could be achieved with a VM but not nearly so easily. So, onwards with the database migration challenge!</p>

<h2>Microsoft to the rescue! (nearly)</h2>

<p>After a bit of research I decided to try using the <a href="http://blogs.msdn.com/b/ssma/">SQL Server Migration Assistant</a> to migrate the database. I was hoping this would automate all the tedious work and leave me just to press a few buttons, sit back and receive all the glory and admiration. Unfortunately it wasn&rsquo;t quite that simple as there are certain data types that just don&rsquo;t have a straight conversion between MySQL and SQL Server.</p>

<h3>How many ways can you say Yes and No?</h3>

<p>At last, a simple question, surely we can all agree what &lsquo;Yes&rsquo; and &lsquo;No&rsquo; look like, after all its the basis for all digital computing! Unfortunately when it comes to technology nothing is quite that straight forward. In the world of MS SQL we have a <a href="http://msdn.microsoft.com/en-us/library/ms177603.aspx">bit data type</a> for this function, 1 for Yes, 0 for No, simples. However the <a href="http://dev.mysql.com/doc/refman/5.7/en/bit-type.html">MySQL bit data type</a> also takes a length parameter so it is only equivalent to MS SQL if the length is set to 1.</p>

<p>To complicate things further MySQL actually advise in their <a href="http://dev.mysql.com/doc/refman/5.7/en/numeric-type-overview.html">numeric types overview</a> that a TINYINT(1) data type should be used to represent a boolean value. However the actual values of this type can be anything from -128 to 127, pretty crazy huh! Unfortunately the database I am trying to migrate chose the MySQL recommended data type of TINYINT(1) and, quite understandably that is not supported by SSMA (SQL Server Migration Assistant) as a straight migration to bit. My solution for this was to craft a &lsquo;pre migration&rsquo; script to manually convert all the MySQL booleans into a bit(1) data type, which could then be migrated by SSMA by adding a custom type mapping.</p>

<p>I also made a couple of other tweaks to the MySQL database before starting the conversion:</p>

<ul>
<li>Added primary keys to the identifying columns on the tables cmsmember, cmsstylesheet, cmsstylesheetproperty and umbracouserlogins</li>
<li>Cleared out temporary data stored in the cmspreviewxml and umbracolog tables and run optimize on the tables to free up unused space</li>
</ul>


<p>I was then ready to fire up the SSMA tool and migrate the database to Azure. I won&rsquo;t go into details about this as there is already a <a href="http://blogs.msdn.com/b/ssma/archive/2011/02/07/mysql-to-sql-server-migration-how-to-use-ssma.aspx">decent guide for using SSMA</a>.</p>

<h2>The Devil is in the detail</h2>

<p>After the migration there was a final synchronisation step to carry out. I needed to manually check the data types for each of the columns in the Azure DB and update any that were not correct. I found out what the types were meant to be by <a href="http://our.umbraco.org/download">downloading the same umbraco version</a> I was working with and comparing the types. I expect there is a tool that can be used to do this but the database wasn&rsquo;t particularly large so it didn&rsquo;t take too long to carry out manually.</p>

<p>Most of the changes could be made directly to the Azure tables by just changing the datatype in the management tool. However a couple of columns proved more difficult, if they were being used as primary keys in azure there was no way to change them in place so instead I copied the data into a new table which had the correct schema, removed the old table and renamed the new table. Here is an example script for the cmstasktype table:</p>

<pre><code>EXECUTE sp_rename N'[PK_cmstasktype_ID]', N'[PK_cmstasktype_ID_old]',  'OBJECT'

CREATE TABLE [Tempcmstasktype](
    [ID] [tinyint] NOT NULL,
    [ALIAS] [nvarchar](255) NOT NULL    
    CONSTRAINT [PK_cmstasktype_ID] PRIMARY KEY CLUSTERED 
    ([ID] ASC
    )WITH (PAD_INDEX  = OFF, STATISTICS_NORECOMPUTE  = OFF, IGNORE_DUP_KEY = OFF, ALLOW_ROW_LOCKS  = ON, ALLOW_PAGE_LOCKS  = ON) ) 
GO

Insert INTO [Tempcmstasktype] ([ID], [ALIAS])
    Select  [ID], [ALIAS]   From [cmstasktype]

drop table [cmstasktype]
EXECUTE sp_rename N'Tempcmstasktype', N'cmstasktype', 'OBJECT'
</code></pre>

<p>After ensuring all the data types matched I was able to fire up the azure website and hey presto everything functioned correctly! OK I admit it wasn&rsquo;t quite that smooth as I&rsquo;d missed changing one column from an int to tinyint which broke the whole CMS admin UI but once I&rsquo;d tracked that down everything worked fine, hooray!</p>
]]></content>
  </entry>
  
  <entry>
    <title type="html"><![CDATA[Cloud hosting for a prototype project]]></title>
    <link href="https://bakingwebsites.co.uk/2014/05/23/cloud-hosting-for-prototype/"/>
    <updated>2014-05-23T16:04:20+01:00</updated>
    <id>https://bakingwebsites.co.uk/2014/05/23/cloud-hosting-for-prototype</id>
    <content type="html"><![CDATA[<p><img src="http://imagizer.imageshack.us/v2/320x240q90/838/0fsb.jpg" class="alignleft" alttext="Square peg - Round hole"  /></p>

<br/><br/>


<p>Today I am investigating cloud hosting platforms for a green field web application, there are quite a few platforms out there now, however I&rsquo;ll be looking at some of the big hitters as they are tried and tested in the marketplace.</p>

<p>The full technology stack is still under review so the hosting capabilities need to be fairly flexible however the requirements we know for sure are:</p>

<ul>
<li>Able to spin up multiple instances to run testing, staging and production environments</li>
<li>Low cost, ideally zero for testing / staging as this is grass roots project!</li>
<li>Flexibility to host a range of technologies</li>
<li>High reliability / speed (this should be a given for any hosting environment)</li>
</ul>


<h2>Contenders ready!</h2>

<p>I&rsquo;m going to investigate 3 platforms against the main requirements above, Windows Azure, Amazon Web Services and Heroku. Each have their advantages, so lets find out which will be the best fit for our project.</p>

<h3>Azure</h3>

<p>Azure is the Microsoft Cloud offering. As such it has a Microsoft technologies leaning but is by no means limited to their stack.</p>

<h4>OS / Languages / DBs</h4>

<ul>
<li>Windows or Linux</li>
<li>.NET, Node.js, Java, PHP, Python, Ruby</li>
<li>Native DBs: Azure SQL Server</li>
<li>Third party DBs: Neo4j, MySQL, MongoDB (fiddly)</li>
</ul>


<h4>Pricing</h4>

<ul>
<li>30 day free trial then,</li>
<li>$10/month per site</li>
<li>$2.50/month per DB</li>
</ul>


<h3>AWS</h3>

<p>Amazon Web Services were one of the first cloud based hosting solutions out there. It is a mature platform with many options but lets see whether the acronyms compare favourably.</p>

<h4>OS / Languages</h4>

<ul>
<li>Windows or Linux</li>
<li>.NET, Java, PHP, Python, Ruby</li>
<li>Native DBs: SQL Server, MySQL, Oracle, PostgreSQL</li>
<li>Third party DBs: Neo4j, MongoDB, RavenDB (basically anything you can run on VM)</li>
</ul>


<h4>Pricing</h4>

<ul>
<li>12 months free for 1 instance / DB</li>
<li>$15/month per site</li>
<li>$40/month per DB</li>
</ul>


<h3>Heroku</h3>

<p>Heroku is more of a grass roots developer led cloud platform. It is well suited to an open source license free stack but will this be suitable for our application?</p>

<h4>OS / Languages</h4>

<ul>
<li>Windows or Linux</li>
<li>Node.js, Java, Python, Ruby</li>
<li>Native DBs: Postgres</li>
<li>Third party FBs: neo4j, MySQL</li>
</ul>


<h4>Pricing</h4>

<ul>
<li>1 dyno free, $35/month per extra instance</li>
<li>Dev DBs free (Up to 10K rows), Basic $9/month</li>
</ul>


<h2>And the winner is&hellip;</h2>

<p>The technology stack hasn&rsquo;t been chosen yet so we will just need to wait to see you the winner is!</p>
]]></content>
  </entry>
  
  <entry>
    <title type="html"><![CDATA[migrating umbraco 4 mysql to azure hosting]]></title>
    <link href="https://bakingwebsites.co.uk/2014/04/28/migrating-umbraco-4-mysql-to-azure-hosting/"/>
    <updated>2014-04-28T09:58:09+01:00</updated>
    <id>https://bakingwebsites.co.uk/2014/04/28/migrating-umbraco-4-mysql-to-azure-hosting</id>
    <content type="html"><![CDATA[<h2>Why Azure</h2>

<p>I recently inherited an Umbraco version 4 site and need to setup web hosting for it. I decided that Azure would be a good option for hosting as it offers great benefits for future scalability and a good costing model. I also wanted to try it out and see what all the fuss is about!</p>

<p>There were a few steps to carry out to get the site up and running in Azure, so I&rsquo;ve documented my experience here.</p>

<h2>First steps</h2>

<ul>
<li>Obviously you need to sign up to a <a href="http://azure.microsoft.com/">Windows Azure account</a>. Its free to try but you do need a credit card. I guess this makes it nice and seamless for Microsoft to start charging you if you opt to continue past the 1 month trial!</li>
<li>Now login to the portal and go to Websites &ndash;> new &ndash;> custom create &ndash;> enter details, selecting a mysql database from the drop down</li>
</ul>


<p><img src="http://imageshack.com/a/img834/4281/jf2b.png" class="alignleft" alttext="Azure create website dialog"  /></p>

<h2>Migrating the database</h2>

<ul>
<li>Click on the new website and go to the &lsquo;linked resources&rsquo; tab. The MySql Database should be listed here</li>
<li>Click the name to open ClearDB (the third party provider of MySql databases support for Windows Azure)</li>
<li>Setup MySQL workbench to connect to ClearDB using an <a href="https://github.com/CloudBees-community/tomcat-clickstack/wiki/ClearDB-::--MySQL-SSL-Connection-MySQL-Workbench">SSL connection</a>. You may also need to install OpenSSL to enable generation of the rsa key.</li>
<li>Reduce the database size to fit in the 20MB size limit by <a href="http://www.spyriadis.net/2012/07/umbraco-clear-old-document-versions-to-decrease-database-size-and-improve-performance/">removing old document versions and preview / log files.</a></li>
</ul>


<h2>Uploading the web site</h2>

<ul>
<li>Download the publish profile file from your azure account. It is available on the dashboard page of your website, under the &lsquo;quick glance&rsquo; menu</li>
<li>Open the site in WebMatrix, press publish and browse to select the publish profile file you just downloaded.</li>
<li>Web Matrix will now run a diff on the files and prompt you to upload any changes to Azure.</li>
<li>In Azure go to the site configure tab and set the app settings for &lsquo;umbracoDbDSN&rsquo; and any other connection string values to the ClearDB database connection string. If you are not sure what the connection string you can get it from the &lsquo;quick glance&rsquo; menu.</li>
</ul>


<p>I like this ability to set your production connection strings / app settings in Azure. This will be help enable me to open source the code without storing these secure settings in the config files themselves.</p>

<p>Hey presto, your site should be up and running!</p>

<h2>So, what&rsquo;s the verdict?</h2>

<p>Is Azure as nice a hue as promised or is it more murky in practice? Well from my experience its all worked pretty much as expected so far. Its clear the Microsoft has invested some serious resources into the platform and unlike some of their other products (ahem Windows 8) the usability is excellent.</p>

<p>I think this is a decent work flow to initially get a site up and running. However in the long term I would want to hook up source control for the site to publish when merging to a branch. There is an option in Azure to &lsquo;Set up deployment from source control&rsquo; so I will be investigating how this works next.</p>

<p>The main drawback I currently see with this setup is that the database has a limit on the number of connections. The free version has 4 which is fair enough, given it is just for trialling. However even the paid versions have low limits of 15, 30 or 40 for $10, $50 or $100 respectively. My feeling is that these limits may well cause problems when the site is running in production. I already hit the 4 connections limit just browsing the site myself and publishing a new page and it is bound to use more when real users are browsing at the same time.</p>

<p>The SQL databases offered in Azure do not have this connections limit and would also be significantly cheaper in the long run, so I will be investigating the feasibility of migrating the Umbraco DB from MySQL into SQL.</p>
]]></content>
  </entry>
  
  <entry>
    <title type="html"><![CDATA[Event Storming a distributed solution]]></title>
    <link href="https://bakingwebsites.co.uk/2014/01/29/event-storming/"/>
    <updated>2014-01-29T17:38:27+00:00</updated>
    <id>https://bakingwebsites.co.uk/2014/01/29/event-storming</id>
    <content type="html"><![CDATA[<p>Software design and development techniques are constantly evolving, making the discipline a fascinating area to work in. Over the time I&rsquo;ve been working as a developer I&rsquo;ve seen various approaches to design from Code First, Data Driven to Domain Driven (DDD). My preference is to consider the scope of the problem first and design a solution to match and DDD is a good fit for this. However when looking at enterprise level problems we need to give more consideration to how a problem will scale&hellip; enter Event Storming.</p>

<h2>Distributed design</h2>

<p>I work in a development team which is responsible for several key business capabilities, there are already some software solutions in place for these capabilities however they were designed several years ago to solve problems at a scale at least an order of magnitude below where we currently find ourselves. Our stakeholders have expressed a desire that we could redesign a solution which would meet our current needs better, basically it needs to work <strong>faster</strong>, do <em>just</em> what is needed and ideally <strong>scale</strong> so that it will still perform well at the next order of magnitude up.</p>

<p>We decided to have an Event Storming session to help us analyse the problem and come up with a high level distributed solution. We carried out the session in a couple of phases, first we reviewed the current solution, then we looked at the primary goals for the redesign then finally we started event storming a solution. Here are the team hard at work mid-storm:</p>

<p><img src="http://imageshack.com/a/img542/5968/1l37.jpg" class="alignleft" alttext="Octopress Logo"  /></p>

<h2>Collaborative analysis</h2>

<p>The session first involved us all writing down on post-it notes business events that had some relevance to the feature we were analysing. We then stuck all these onto a big board and de-duped them. It was a bit tricky to order the post-its at this stage so we went for a loose left to right time sequence.</p>

<p>Following this we got the post-it stack back in action and wrote down each of the commands that could have some influence on the events on the board. Then we linked each of the commands to events on the board, this wasn&rsquo;t always a one-to-one relationship which presented some practical problems, however on the whole I think working with physical post-its was far better than using something like Visio as its more democratic. Finally we arranged the post-its into discrete pieces of behaviour and mapped out the interactions between them.</p>

<p>It was important that we recognised the difference between an event and a command during the exercise. As a rule of thumb commands are carried out by users and events are raised by the system to indicate something has happened. For example the <em>Create Product</em> command is raised when the user saves a product entry, whereas <em>&lsquo;Product Created&rsquo;</em> event is raised after the transaction has finished and a product has been persisted in the system. As I alluded to earlier there is no hard one-to-one relationship here, a single command can often result in multiple events being raised and vice versa. Its important to make sure the distinction is clear to everyone before the session begins, it saves a lot of time in the long run!</p>

<p>The results of our session can be seen in the picture below:
<img src="http://imageshack.com/a/img34/1388/bbid.jpg" class="alignleft" alttext="Octopress Logo"  /></p>

<h2>A virtual solution</h2>

<p>By the end of the session we had a virtual solution figured out that could be implemented with discrete modules communicating exclusively via messaging. I was pleasantly surprised by the elegance of the solution, by focussing on the interactions between the systems and isolating responsibilities it was clear that we only needed to pass a small amount of data between each module and could effectively encapsulate the behaviour. However Event Storming is just one technique and I wouldn&rsquo;t suggest it is a magic bullet design technique, these are the main pros and cons as I see it.</p>

<h3>Advantages</h3>

<ul>
<li>Helps focus on the interactions between elements of a distributed system</li>
<li>The whole team is involved at the analysis stage and visualize the same proposed solution</li>
<li>Encourages scalable solutions</li>
</ul>


<h3>Drawbacks</h3>

<ul>
<li>Reliant on domain knowledge of team members to surface events / commands</li>
<li>Design can get lost in a sea of post-it notes!</li>
<li>Need to transfer quickly to implementation tasks to avoid losing insights</li>
</ul>


<p>I&rsquo;d be interested to hear of your experiences of event storming and how effective you have found it to be?</p>
]]></content>
  </entry>
  
  <entry>
    <title type="html"><![CDATA[Dear Wordpress, you're dumped!]]></title>
    <link href="https://bakingwebsites.co.uk/2014/01/15/dear-wordpress-youre-dumped/"/>
    <updated>2014-01-15T16:38:27+00:00</updated>
    <id>https://bakingwebsites.co.uk/2014/01/15/dear-wordpress-youre-dumped</id>
    <content type="html"><![CDATA[<p><img src="http://imageshack.com/a/img827/7426/w5v5.png " class="alignleft" alttext="Octopress Logo"  />
There comes a time in a developers life (every couple of years it seems) when you are dissatisfied with your existing blogging platform. What had started as a beautiful and fulfilled relationship has decayed to the point where you barely interact. What once seemed like a cutting edge editing interface has become stayed and obtuse. Your eyes begin to wander, other blogging platforms seem so slick and modern in comparison, you wonder  &ldquo;why can&rsquo;t I have some of that?&rdquo;</p>

<p>But there is no need to fret, unlike <a href="http://www.sheknows.com/tags/celebrity-breakups">other breakups</a> this change should be quite painless for all parties involved. So as January is the peak month for relationship change, there is no better time to ring the changes and introduce a new blogging platform!</p>

<h2>No more Batman and Robin</h2>

<p>You may ask what my blog has to do with the dynamic crime fighting duo Batman and Robin? Well the new platform is based on <a href="http://jekyllrb.com/">Jekyll</a>, which is quite the opposite of dynamic. Using the power of Jekyll I can now generate all the static blog content (html, images, css) locally by running a couple of commands. Then I just push the changes up to <a href="https://github.com/">github</a> and boom, the updates are published.</p>

<p>I really liked the simplicity of this approach as a blog is pretty much all about the content, there are no interactive features or dynamically changing content that would require a processing engine. The functionality can be met with good old static html. There are also a bunch of other great advantages to this approach:</p>

<ul>
<li>Use of <a href="https://github.com/NeQuissimus/MarkdownByExample/wiki/MarkdownSyntax">Markdown</a> for content editing</li>
<li>Faster page load times</li>
<li>More tolerant to high loads (although I doubt the traffic on this particular blog will ever cause a problem!)</li>
<li>Free web hosting with <a href="http://octopress.org/docs/deploying/github/">github pages</a></li>
<li>Scratches my developer itch for getting my hands dirty with the blogging platform</li>
</ul>


<p>There are some drawbacks to this approach such as a higher barrier to entry for editors, however as I&rsquo;m the only editor that isn&rsquo;t a problem for me.</p>

<h2>Wordpress meet Octopress</h2>

<p>Having settled on a new platform I needed to extract the content from my existing wordpress blog and convert it into a format suitable for Octopress (ie. Markdown). Fortunately this is a fairly <a href="http://import.jekyllrb.com/">well travelled road</a> and my posts were pretty basically formatted so the conversion process was pretty painless. The most important issues for me were to not lose formatting of the content and retain the same permalinks so existing google / bookmark links would still work.</p>

<p>I got the blog running pretty easily (as it runs through Ruby, which is already setup on my machine) however the default theme wasn&rsquo;t really doing it for me. Fortunately there are a bunch of <a href="http://opthemes.com/">alternative themes</a> available that a pretty straightforward to apply. I opted to use the <a href="https://github.com/shashankmehta/greyshade">greyshade theme</a> as a base and tweak the fonts / layout to suit my needs.</p>

<h2>Images / Comments</h2>

<p>So at this point all the posts are in the blog nicely formatted but the images are still being served from Wordpress and even worse the comments have not been ported at all.</p>

<p>I considered just dumping the images into the new blog platform itself, however I felt like there should be a better solution. Whilst my blog is pretty tiny at the moment the number of assets are bound to grow over time and I didn&rsquo;t want to cripple the blog hosting server itself with unnecessary load. Initially I tried uploading the images to <a href="http://picasa.google.com/">Picasa</a>, however it seems to require a desktop app to upload the images and refused to give me a proper URL for the image sources. A far better solution for me was <a href="https://imageshack.com/">ImageShack</a>, uploading is handled through a slick browser based interface and you can easily get direct links to the images. A nice bonus for the platform is built in support for image resizing, all you need to do is specify your required size in the image link.</p>

<p>The final part to integrate was the comments. This turned out really straightforward using <a href="http://disqus.com/">Disqus</a>. All I needed to do was sign up for a new account and point it at my existing wordpress blog to pull the comments down. You can enable Disqus in Octopress through the config.yml file.
Then, provided your post links are maintained, when the blog is switched across the comments are also kept, simples!</p>

<h2>Conclusion</h2>

<p>So there you have it, a freshly baked blogging site for your consumption pleasure, enjoy!</p>
]]></content>
  </entry>
  
  <entry>
    <title type="html"><![CDATA[Design patterns without Katas]]></title>
    <link href="https://bakingwebsites.co.uk/2013/06/13/design-patterns-without-katas/"/>
    <updated>2013-06-13T09:05:05+01:00</updated>
    <id>https://bakingwebsites.co.uk/2013/06/13/design-patterns-without-katas</id>
    <content type="html"><![CDATA[<p>There are a number of design patterns which I have chosen not to implement a coding kata for. This is because I felt that I would either not use the pattern regularly in practice or they have alternative solutions that make the pattern redundant. However I think it is worth calling out these patterns and summarising how they work.</p>

<h2>The decorator pattern</h2>


<p>This pattern provides a way of extending a classes behaviour without using inheritance, it is defined as:</p>

<blockquote>The decorator pattern extends the functionality of individual objects by wrapping them with one or more decorator classes. These decorators can modify existing members and add new methods and properties at run-time.</blockquote>


<p>The main reason I won&rsquo;t be using this pattern much in practice is that the class structure it generates is not very clear and also the behaviour of   the classes can change depending on the order they are instantiated. So I think implementing this pattern could cause more problems than it solves, especially if the system may need to be maintained by different people at a later date.</p>

<h2>The factory pattern</h2>




<blockquote><em>The factory method pattern allows for the creation of objects without specifying the type of object that is to be created in code. A factory class contains a method that allows determination of the created type at run-time.</em></blockquote>


<p>Whilst the factory method has its uses it is basically just an implementation of sub classing, where parameters are defined as base classes to allow different derived classes to be passed at runtime. It is a straightforward pattern and the coding kata would be pretty short to implement it.</p>

<p>Also one of the main issues the factory pattern tries to solve is centralising object creation, however we generally use IoC containers which provide <a href="http://stackoverflow.com/questions/871405/why-do-i-need-an-ioc-container-as-opposed-to-straightforward-di-code">low maintenance dependency injection</a>  out of the box. So this removes the main need for the factory pattern.</p>

<h2>The Singleton pattern</h2>




<blockquote>Ensure a class only has one instance and provide a global access point to it</blockquote>


<p><img class="alignright size-medium wp-image-460" alt="asparagus shoot from http://sandyspringcsa.com/" src="http://imageshack.com/a/img32/7137/uwa5.jpg" width="300" />
This is a pattern which can be very useful in applications, however the implementation is so short that a coding kata would have little content. There are just a couple of pitfalls to watch out for when implementing this pattern:</p>

<ul>
    <li><span style="line-height:16px;">Ensure the implementation is  thread safe
In Java the synchronized keyword can be used on the method which returns the singleton to ensure only a single thread ever has access to the class at once. However that can lead to the second pitfall</span></li>
    <li>Consider whether you implementation offers the best performance
Using synchronization is expensive (ie. It takes the computer a relatively long time to process)</li>
</ul>


<p>This implementation avoids both of these pitfalls by creating the <em>uniqueInstance</em> when the class is first loaded:</p>

<pre style="font-family:Andale Mono, Lucida Console, Monaco, fixed, monospace;color:#000000;background-color:#eee;font-size:12px;border:1px dashed #999999;line-height:14px;overflow:auto;width:100%;padding:5px;">public class Singleton {
  private static Singleton uniqueInstance = new Singleton();

  private Singleton() {}

  public static Singleton getInstance()  {
    return uniqueInstance;
  }
}</pre>


<p>Finally, as with the factory pattern, if you are using an IoC container then they generally provide a way to configure a class as a singleton so there is rarely a need to implement this pattern manually yourself.</p>

<h2>There may be more&#8230;</h2>


<p>Stay tuned for more patterns to be added to this post!</p>
]]></content>
  </entry>
  
  <entry>
    <title type="html"><![CDATA[The Observer pattern coding kata]]></title>
    <link href="https://bakingwebsites.co.uk/2013/05/29/the-observer-pattern-coding-kata/"/>
    <updated>2013-05-29T08:53:06+01:00</updated>
    <id>https://bakingwebsites.co.uk/2013/05/29/the-observer-pattern-coding-kata</id>
    <content type="html"><![CDATA[<p>The second design pattern I will be looking at is the Observer pattern, which is useful for safely passing data between objects. The Observer pattern is defined as:</p>

<blockquote>&#8220;a one-to-many relationship between objects so that when one object changes state all it  dependants  are notified and updated automatically&#8221;.</blockquote>


<p>A good analogy for this pattern, described in the excellent <a href="http://www.headfirstlabs.com/books/hfdp/">Head First Design Patterns book</a>  is that of a magazine publisher and subscribers. Here the publisher is the <em>one</em>  in the relationship and the subscribers are the <em>many</em>. Typically the publisher will notify each of the subscribers of a new magazine edition by sending them the magazine in the post or through their e-book subscription.  Translated into the Observer pattern the Publisher is known as the Subject and the subscribers are the observers. The subject <em>notifies</em> the observers of changes in its state.</p>

<p>Some important features to note about this pattern are:</p>

<ul>
    <li>Observers can not change the state of the subject and vice versa (ie. they are Loosely Coupled)</li>
    <li>The state information can be either <em>pushed</em> out to the observers by the subject or <em>pulled</em> from the subject by the observers</li>
    <li>Observers can be added and removed at any time</li>
</ul>




<h3>The brief</h3>


<p>This is our  fictitious  brief for a new system which needs to be designed. It is election time and the polls are coming in. A local TV station would like us to design a system which can keep track of the results as they arrive. There are several hundred constituencies (areas of the country) which may declare for the Blue, Red, Yellow or Green party. The TV station wants to present this data in a number of ways:</p>

<ul>
    <li>As a leader board, showing the tally for each party</li>
    <li>As a map, with each region coloured to the winning party</li>
    <li>As a <a href="http://news.bbc.co.uk/1/hi/uk_politics/election_2010/8574653.stm">Swingometer</a>  showing the proportional change and overall result</li>
</ul>


<p>We don&rsquo;t need to worry about the implementation details of these display methods, the algorithms will be provided by the TV station. Our main concern is how to design a system to pass the data between the election object and the display objects.</p>

<h3>Designing the Solution</h3>


<p>Here is the class diagram for our solution, if you would like to try implementing the solution yourself the starting point for the kata is tagged here: <a href="https://github.com/MikeHook/DesignPatterns/tree/ObserverStart">Observer Pattern Kata Start</a>.</p>

<p><img class="alignnone" alt="Observer pattern for election data" src="https://www.lucidchart.com/publicSegments/view/51892f26-05fc-4844-a25b-4c660a0087f6/image.png" width="579" height="597" /></p>

<p>We have leveraged the Observer pattern in our solution. The Election object inherits from ISubject and each of the display methods inherit from IObserver. The Election object maintains a list of the observers, we can add or remove an observer to this list using the <em>Register</em> and <em>Unregister</em> methods. When the subjects <em>Notify</em> method is called it informs each of the observers that a change has occurred by calling their <em>Update</em> method. A completed implementation for the election scenario is tagged here: <a href="https://github.com/MikeHook/DesignPatterns/tree/ObserverEnd">Observer Pattern Kata End</a>.</p>
]]></content>
  </entry>
  
  <entry>
    <title type="html"><![CDATA[Strategy pattern coding kata]]></title>
    <link href="https://bakingwebsites.co.uk/2013/05/07/strategy-pattern-coding-kata/"/>
    <updated>2013-05-07T08:16:49+01:00</updated>
    <id>https://bakingwebsites.co.uk/2013/05/07/strategy-pattern-coding-kata</id>
    <content type="html"><![CDATA[<p>I&rsquo;ve been having a look at coding katas and design patterns over the last couple of weeks. If you are not familiar with either of these concepts then you can read <a href="http://butunclebob.com/ArticleS.UncleBob.TheBowlingGameKata">Uncle Bob&rsquo;s introduction to the Bowling Kata</a> and check out <a href="http://www.blackwasp.co.uk/GofPatterns.aspx">Richard Carr&rsquo;s great set of articles on design patterns</a>.</p>

<p>My main goals are to:</p>

<ul>
    <li><span style="line-height:13px;">Increase my familiarity with design patterns</span></li>
    <li>Understand how design patterns can be best applied in real life situations</li>
    <li>Develop a repeatable method for memorizing the patterns</li>
</ul>


<p>A good way to cover off all of these goals will be to develop a set of code kata&rsquo;s which can be solved by applying a design pattern.  Sounds simple? Maybe but lets get started and see how it goes!</p>

<h2>The Strategy Pattern</h2>


<p>The strategy pattern is defined as<em>   </em></p>

<blockquote><em>&#8220;a design pattern that allows a set of similar algorithms to be defined and encapsulated in their own classes.&#8221; </em></blockquote>


<p>The aim of this pattern is to separate the parts of a system that may change from those which are unlikely to change, allowing for easier maintainability of the system in future.  This all sounds good in theory but you may be wondering how and where the pattern can be applied in practice. With this in mind I&rsquo;ve come up with a  fictitious brief that we can solve by utilising the Strategy Pattern.</p>

<h4>The brief</h4>


<p>A games company is developing a sports event simulator, to be built in iterations starting with simple requirements and building up to increase the complexity. The system design should allow for changes to be made by extending the existing system without changing what is already in place.</p>

<ol>
    <li>The simulator must support marathon and 10 km run events. The only requirement for these events is that the competitors can be displayed in some way (text is fine) and they can compete in the event. All competitors will compete by running.</li>
    <li>After running some events they proved to be totally chaotic so each event should now include a marshal. The marshal can also be displayed but does not compete in events.</li>
    <li>Since the glorious victory of team GB in the Olympic Triathlon the sport&#8217;s popularity has increased. So the games company would now like to also support triathlon events. Again competitors must be displayed and be able to compete, however a triathlon competitor will compete by swimming, cycling and running.</li>
</ol>




<h4>Designing the Solution</h4>


<p>The starting point for this kata is available to clone from github here: <a href="https://github.com/MikeHook/DesignPatterns/tree/StrategyStart">Strategy Kata Start</a>  <a href="https://github.com/MikeHook/DesignPatterns/tree/StrategyStart">
</a></p>

<h5>Iteration 1</h5>


<p>To meet the first requirement we only need a couple of objects as shown below:</p>

<p><img class="alignnone" alt="Strategy Pattern - Design iteration 1" src="https://www.lucidchart.com/publicSegments/view/5180e984-cb84-4274-a415-68870a00005a/image.png" width="637" height="405" /></p>

<p>We can create a couple of events for marathon and 10km runs and add some runners to those events. When the simulation runs the Compete() base method is called for each of the EventAttendees to simulate them taking part in the event. Each of the runners can be displayed by a call to their <em>Render()</em> method.</p>

<h5><span style="line-height:13px;">Iteration 2</span></h5>


<p>We now need to include Marshals as part of the event, so the model is extended as below:</p>

<p><img class="alignnone" alt="Strategy Pattern - Design iteration 2" src="https://www.lucidchart.com/publicSegments/view/518380c3-ab34-42c9-a96e-71dc0a005c5f/image.png" width="707" height="492" /></p>

<p>However, there is an obvious problem with this design, as noted in the diagram. One option would be for the Marshall to override the Compete method and make it do nothing. However this will store up more trouble for us as there may be other types of event attendee later which do not compete. We would have to ensure that each of these attendees also override that method with the same &lsquo;not compete&rsquo; behaviour. There is a better way to design for this issue (there is a clue in the name of this blog post!)</p>

<h5>Iteration 3</h5>


<p>It is clear that the Compete behaviour may change frequently depending on the attendee, we can leverage the Strategy pattern to extract this behaviour into separate classes as shown below.</p>

<p><img class="alignnone" alt="Strategy Pattern - Iteration 3" src="https://www.lucidchart.com/publicSegments/view/51877f21-1fd8-4c3b-9f02-04510a0087f6/image.png" width="519" height="496" /></p>

<p>The EventAttendee base class now contains a property of type ICompeteBehaviour. Any implementation of this interface can be assigned to each instance of an EventAttendee. So the <em>Runner</em> class is assigned the <em>Run </em>behaviour and the <em>Marshall</em> class is assigned the <em>DontCompete</em> behaviour.</p>

<p>Iteration 4</p>

<p>We have one more requirement to satisfy, the design needs to be extended to allow Triathlon events to take place. Thanks to our changes in the previous iteration we can add this new requirement without making any changes to the existing classes. Here is the final structure:</p>

<p><img class="alignnone" alt="Strategy Pattern - Iteration 4" src="https://www.lucidchart.com/publicSegments/view/51878405-1770-4c88-b91a-761b0a000882/image.png" /></p>

<p>We have extended the <em>EventAttendee</em> class with a new <em>Triathlete</em> class and created a new <em>RunCycleSwim</em> implementation of the <em>ICompeteBehaviour</em> interface. You may be thinking that the same could have been achieved with a method for the behaviour on the Triathlete class, while this is true it limits the flexibility of the design. We can see the advantage of this design by adding Spectators to the simulation. They will also be assigned the DontCompete behaviour, so we have effectively shared this part of the logic without repeating the implementation.</p>

<p>The completed implementation for this kata is available on github here:  <a href="https://github.com/MikeHook/DesignPatterns/tree/StrategyEnd">Strategy Kata End</a></p>
]]></content>
  </entry>
  
  <entry>
    <title type="html"><![CDATA[Integrating EPiServer 7 with MVC - Next Steps]]></title>
    <link href="https://bakingwebsites.co.uk/2013/04/09/integrating-episerver-7-with-mvc-next-steps/"/>
    <updated>2013-04-09T17:40:42+01:00</updated>
    <id>https://bakingwebsites.co.uk/2013/04/09/integrating-episerver-7-with-mvc-next-steps</id>
    <content type="html"><![CDATA[<p>My previous blog post, <a title="Integrating EPiServer 7 with an existing MVC  site" href="https://bakingwebsites.co.uk/2013/03/14/integrating-episerver-7-with-an-existing-mvc-site/">Integrating EPiServer 7 with an existing MVC site</a>, outlined the initial steps to get EPiServer 7 running. However there are a number of additional steps you may need to take before your site is fully integrated.</p>

<h3>Convert any Controllers not in Areas</h3>


<p>If your site only contains controllers within Areas then you should not need to make any changes. However controllers in the root of the site will not work by default (at least for me). I found it was best to deal with these controllers on a case per case basis as the best course of action depended on the function of the controller. I implemented one of the following changes for each:</p>

<ul>
    <li><span style="line-height:13px;">Move the controller into an area. This option makes sense if the views for the controller do not have any CMS editable content</span></li>
    <li>Convert the controller to be CMS managed. Makes sense if the views need to be CMS editable (inherit from  PageController&lt;T&gt; where T is a BasePage)</li>
    <li>Convert the controller to an HttpHandler. In one case the controller did not have any views or models, it was really just a different entrypoint to the site which ran a bit of logic and redirected. In this case there was no point in retaining the controller as an HttpHanlder could do the same job more efficiently</li>
</ul>




<h3>Disable strict language routing</h3>


<p>I encountered a further issue after patching my EPiServer.Core and EPiServer.Framework nuget packages to the latest versions. None of the controller actions in the home controller worked any more except for the Index. This was fairly easy to remedy by disabling the strict language routing, via the episerver/sites/site/strictLanguageRouting config setting.</p>

<h3>Deployment Issues</h3>


<p>While its all well and good having the site running on your machine, eventually it will need to be deployed somewhere. We handle configuration changes with file transforms and I was pleased to note that the config changes required for episerver deployments are now minimised. Here is a summary list of all the settings we changed per environment:</p>

<ul>
    <li><span style="line-height:13px;">connectionStrings
</span></li>
    <li>episerver/sites/site/siteSettings/siteUrl</li>
    <li>episerver.framework/siteHostMapping/siteHosts</li>
    <li>episerver.framework/appData/basePath</li>
    <li>episerver.framework/licensing/licenseFilePath</li>
    <li>episerver.search/namedIndexingServices/services/baseUri</li>
</ul>


<p>Note, you may need to transform further settings for a load balanced site.</p>

<h5>EPiServer UI not deployed</h5>


<p>Previously with EPiServer v6 all that was needed to run the CMS interface itself was to install the application on the web server. However the EPiServer 7 UI architecture also has a number of dependencies in the {VPP}\modules folder. So ensure that these files are also present in your deployed environment, otherwise you will probably encounter the following error:</p>

<pre style="font-family:Andale Mono, Lucida Console, Monaco, fixed, monospace;color:#000000;background-color:#eee;font-size:12px;border:1px dashed #999999;line-height:14px;overflow:auto;width:100%;padding:5px;">DirectoryNotFoundException: Could not find a part of the path '{Your site path} \Website\ClientResources\ClientResources\packages.config'</pre>




<h5>Search service configuration</h5>


<p>We have the search service configured on a local host name as the indexing service does not like to communicate over a public host name. However this caused a further issue with the service reporting that multiple hosts names could not be run for the service. Fortunately this could be remedied easily by setting the system.serviceModel/serviceHostingEnvironment/multipleSiteBindingsEnabled  setting to true.</p>

<p>Those were all the steps we needed to take to deploy the site successfully. I&rsquo;d be interested to hear your experiences if you found any other settings that need to be changed. Feel free to reply in the comments below or contact me directly on twitter <a href="https://twitter.com/michael_hook">@michael_hook</a>.</p>
]]></content>
  </entry>
  
  <entry>
    <title type="html"><![CDATA[Integrating EPiServer 7 with an existing MVC site]]></title>
    <link href="https://bakingwebsites.co.uk/2013/03/14/integrating-episerver-7-with-an-existing-mvc-site/"/>
    <updated>2013-03-14T15:54:57+00:00</updated>
    <id>https://bakingwebsites.co.uk/2013/03/14/integrating-episerver-7-with-an-existing-mvc-site</id>
    <content type="html"><![CDATA[<p><img class="alignright size-full wp-image-408" alt="custom_integration" src="http://imageshack.com/a/img560/4853/3rqu.jpg" width="300" />This post assumes you have EPiServer 7 installed on your machine. If you don&rsquo;t have it then it is available from <a href="http://world.episerver.com/Download/Categories/Products/EPiServer-CMS/">EPiServer world</a>  (once you have created an account).</p>

<p>There are 2 main options for creating a new EPiServer 7 MVC stylee site:</p>

<ul>
    <li><span style="font-size:13px;">Create a new Visual studio project (after installing &#8216;EPiServer 7 Visual Studio Integration&#8217;, available from </span><a style="font-size:13px;" href="http://world.episerver.com/Download/Categories/Products/EPiServer-CMS/">EPiServer world</a><span style="font-size:13px;">)</span></li>
    <li><span style="font-size:13px;line-height:19px;">Use the </span><a style="font-size:13px;line-height:19px;" href="http://world.episerver.com/Articles/Items/ASPNET-MVC-Templates-for-EPiServer-7-CMS/">EPiServer 7 MVC templates package</a></li>
</ul>


<p>For integrating with an existing site I&rsquo;d recommend using option 1, as there are far less files to integrate. However it is well worth looking at the templates package as well as this demonstrates how models and views can be implemented with EPiServer 7.</p>

<p>After creating the new Visual Studio project I remembered that EPiServer have a NuGet feed, and they do have the version 7 assemblies on NuGet. However the version numbers are slightly different to those used in the visual studio project, so make sure you specify the version numbers to NuGet when you install the packages (they are listed below). Here are the steps I followed in detail:</p>

<ol>
    <li><span style="line-height:13px;">Created a new Visual studio project using the EPiServer Web Site (MVC) template
</span></li>
    <li>Followed the EPiServer tutorial (<strong>link</strong>) to add a home page and set it to the &#8216;start page&#8217;</li>
    <li>Upgraded my existing site to MVC 4 by installing the Microsoft ASP.NET MVC 4 nuget package (obviously not required if your existing site is already on MVC version 4.</li>
    <li>Copy across the connectionStrings.config, episerver.config,  EPiServerFramework.config, EPiServerLog.Config and FileSummary.config files</li>
    <li>Update the  siteUrl in  episserver.config.</li>
    <li>Copy the AppData, IndexingService, modules and modules bin folders.</li>
    <li>Merge the web.config files - ensure the  episerver.search baseUri is updated to point at your site address.</li>
    <li>Installed EPiServer 7 from Nuget feeds using these commands to get the correct versions:
<ul>
    <li>Install-Package EPiServer.Framework -Version 7.0.859.1</li>
    <li>Install-Package EPiServer.CMS.Core -Version 7.0.586.1</li>
</ul>
</li>
    <li>Removed assembly references to Razor and System.WebPages.Razor (as was clashing with EPiServer versions)</li>
    <li>Update Controllers to inherit from  PageController&lt;T&gt; where T is a PageData class.</li>
    <li>Update Global.asax to inherit from  EPiServer.Global</li>
</ol>




<h2><strong>IoC containers clashing!</strong></h2>


<p>OK, this is the tricky bit it gets quite involved but please stay with me!</p>

<p>When I tried to run the site it now returned a &lsquo;No parameterless construct or defined for this object.&rsquo; message. Which in plainer  English  means the application can&rsquo;t create the Controller classes. This is because the site I am integrating with currently uses the Castle Windsor IoC container, however EPiServer uses the StructureMap IoC container internally. We  definitely  don&rsquo;t want two IoC containers and I can&rsquo;t see any evidence of the EPiServer container being swappable. So the only option here is to convert the current Windsor implementation to a StructureMap implementation. More information on Structure map can be found on the excellent <a href="http://docs.structuremap.net/">StructureMap documentation site</a>, however I think it is worth including an overview in this post as, whilst this isn&rsquo;t always going to be necessary for your site, I expect it will be a common problem.</p>

<h4>Add StructureMap version 2.6.1.0</h4>


<p><span style="font-size:13px;">This is available from NuGet (as this is the version used in the EPiServer 7 MVC templates package).
The command to install is:  </span><span style="font-size:13px;">Install-Package StructureMap  -Version  2.6.1.0</span></p>

<h4>Register your services with StructureMap</h4>




<ul>
    <li><span style="font-size:13px;">Copy the  StructureMapDependencyResolver and DependencyResolverInitialization  classes from the EPiServer MVC templates project.</span></li>
    <li>Convert service registration calls to register services with StructureMap instead of Windsor. This is carried out in the  ConfigureContainer method of the  DependencyResolverInitialization class.</li>
</ul>


<p>For example here is a Windsor interface registration and its equivalent StructureMap registration:</p>

<pre style="font-family:Andale Mono, Lucida Console, Monaco, fixed, monospace;color:#000000;background-color:#eee;font-size:12px;border:1px dashed #999999;line-height:14px;overflow:auto;width:100%;padding:5px;">//Windsor registration - Here container is an implementation of IWindsorContainer
var myConfig = WebConfigurationManager.GetSection("myConfig") as MyConfig;
container.Register(Component.For(typeof(IMyConfig)).Instance(myConfig));</pre>




<pre style="font-family:Andale Mono, Lucida Console, Monaco, fixed, monospace;color:#000000;background-color:#eee;font-size:12px;border:1px dashed #999999;line-height:14px;overflow:auto;width:100%;padding:5px;">//StructureMap registration - Here container is of type ConfigurationExpression
var myConfig = WebConfigurationManager.GetSection("myConfig") as MyConfig;
container.For&lt;IMyConfig&gt;().Use(myConfig);</pre>


<p>An example of a class registration with a singleton lifestyle:</p>

<pre style="font-family:Andale Mono, Lucida Console, Monaco, fixed, monospace;color:#000000;background-color:#eee;font-size:12px;border:1px dashed #999999;line-height:14px;overflow:auto;width:100%;padding:5px;">//Windsor registration
container.Register(Component.For(typeof(Cache)).Instance(HttpContext.Current.Cache).LifestyleSingleton());</pre>




<pre style="font-family:Andale Mono, Lucida Console, Monaco, fixed, monospace;color:#000000;background-color:#eee;font-size:12px;border:1px dashed #999999;line-height:14px;overflow:auto;width:100%;padding:5px;">//StructureMap registration
container.For(typeof(Cache)).Singleton().Use(HttpContext.Current.Cache);</pre>




<ul>
    <li><span style="font-size:13px;">Convert  </span><em style="font-size:13px;">IWindsorInstaller</em><span style="font-size:13px;">  implementations  to  </span><em style="font-size:13px;">Registry</em><span style="font-size:13px;">  subclasses.</span></li>
</ul>




<h4>Debugging your StructureMap registrations</h4>


<p>You can debug structure map by adding this line:</p>

<pre style="font-family:Andale Mono, Lucida Console, Monaco, fixed, monospace;color:#000000;background-color:#eee;font-size:12px;border:1px dashed #999999;line-height:14px;overflow:auto;width:100%;padding:5px;">_container.AssertConfigurationIsValid();</pre>


<p>Initially EPiServer was reporting many registration failures but you can delay the call until the InitComplete event is called in the DependencyResolverInitialization class. Then most of the EPiServer  registrations have completed and it is easier to see if there are any issues with your own services.</p>

<h4>Manually retrieving a service</h4>


<p>Generally my services are injected into constructors automatically, however I had a couple of calls to retrieve services manually from the IoC container. For example, to retrieve an implementation of an interface called IMyService:</p>

<pre style="font-family:Andale Mono, Lucida Console, Monaco, fixed, monospace;color:#000000;background-color:#eee;font-size:12px;border:1px dashed #999999;line-height:14px;overflow:auto;width:100%;padding:5px;">_var myService = DependencyResolver.Current.GetService&lt;IMyService&gt;();</pre>




<h4>Last steps</h4>


<p>Hopefully your site will be running now, there is some additional configuration work you may want to do for EPiServer 7 VPP folders. But if you&rsquo;ve made it this far you will probably need a break!</p>

<h5>Updated on 9th April 2013</h5>


<p>Updated the list of config files which must be copied to include EPiServerLog.config and FileSummary.config</p>
]]></content>
  </entry>
  
  <entry>
    <title type="html"><![CDATA[Become a Git contortionist with Stash]]></title>
    <link href="https://bakingwebsites.co.uk/2013/01/18/become-a-git-contortionist-with-stash/"/>
    <updated>2013-01-18T19:16:05+00:00</updated>
    <id>https://bakingwebsites.co.uk/2013/01/18/become-a-git-contortionist-with-stash</id>
    <content type="html"><![CDATA[<p><img class="size-medium wp-image-364 alignright" alt="Annie the Contortionist" src="http://imageshack.com/a/img856/5731/jyt7.jpg" width="300" />One of the great aspects of the Git source control system is its flexibility. Almost any sticky situation you may encounter  as a developer working with source control can be   solved with Git.</p>

<p>Take this scenario, you&rsquo;re halfway through writing a class for a new feature when you get a call.. the client has found a show stopping bug in the application and it needs to be fixed right away. To be able to fix the bug you will need to switch onto the live code branch but you can&rsquo;t go switching branches with a load of uncommitted changes.  Now you don&rsquo;t want to commit your code as its half done and won&rsquo;t even compile right now, but you don&rsquo;t want to lose the changes either&hellip; <a href="http://git-scm.com/book/en/Git-Tools-Stashing"><em>git stash</em></a> to the rescue!</p>

<p>When you issue the git stash command all your changes will be committed to a stack. Leaving you with no changes on your current working branch and free to branch where ever you want. So now you can switch to the live branch and do your bug fixing work. Once that is done you can simply move back to the feature branch and <em>apply</em> the stashed changes. Hey presto, you are back where you started with your uncommitted half complete work!</p>

<p>If you really get into lots of parallel work you can stash multiple times, just be sure to remember that it is a stack and your last changes you have stashed will come back off stack first.</p>
]]></content>
  </entry>
  
  <entry>
    <title type="html"><![CDATA[Microsoft jump on the Open Source band wagon]]></title>
    <link href="https://bakingwebsites.co.uk/2012/04/03/microsoft-jump-on-the-open-source-band-wagon/"/>
    <updated>2012-04-03T12:35:04+01:00</updated>
    <id>https://bakingwebsites.co.uk/2012/04/03/microsoft-jump-on-the-open-source-band-wagon</id>
    <content type="html"><![CDATA[<p><img class="alignright" title="Tux, the Linux Mascot" src="http://upload.wikimedia.org/wikipedia/commons/thumb/a/af/Tux.png/220px-Tux.png" alt="" width="220" height="261" />
A landmark decision was made last week by Microsoft&rsquo;s ASP.NET web development team. They announced that three key technologies used to develop web applications, <a href="http://weblogs.asp.net/scottgu/archive/2012/03/27/asp-net-mvc-web-api-razor-and-open-source.aspx">ASP.NET MVC, Web API and Razor would be made fully Open Source</a><sup>1</sup>. This is a big step for a company built on the sales of Closed Source software. I&rsquo;m going to have a look at what I think this decision means for the consumers, who use software built with these technologies, and the stakeholders who commission the software.</p>

<h2>Open Sesame</h2>


<p>For those those not involved directly in software development, the moniker &lsquo;Open Source&rsquo; may conjure up images of magicians pulling rabbits out of a hat<sup>2</sup>. However the reality could be viewed as the opposite of magic as Open source demystifies the software development process. In the traditional &lsquo;Closed Source&rsquo; licencing model, software is made by a company behind closed doors and the code is encrypted before release to the public. The traditional thinking is that this protects the company by preventing third parties from stealing their intellectual property. This is a subject of <a href="http://en.wikipedia.org/wiki/Software_patent_debate">some debate</a>  , which I won&rsquo;t go into here. However it is clear that many businesses are currently successful without relying on restrictive software patents.</p>

<p>In an Open Source licencing model, the full unencrypted source code will be published at the same time as the software itself (indeed often before-hand in the case of preview and beta releases). Also, as in the case of this announcement, public contributions may be accepted to modify the original source code. Naturally the acceptance process is completely at the discretion of software company, so unhelpful or damaging contributions will not be accepted.</p>

<p>A good example of the Open Source model working commercially is the Android operating system released by Google. A massive range of mobile devices run Android and it is not only the key competitor to Apple&rsquo;s iOS (iPhones &amp; iPad operating system but has helped ensure that most devices using Microsoft&rsquo;s Windows Mobile operating system are sitting on the scrap heap. I for one am glad that there is healthy competition to the world of Apple and its clone army of i-device accolytes.</p>

<h2>Software that Just Works</h2>


<p>From a consumer or stakeholder viewpoint the natural desire is to want software that &lsquo;just works&rsquo; and to reach that goal we just need to fix all the bugs in the software. Unfortunately the belief that all software bugs can be fixed is generally  infeasible  given time and budget restraints, due to the nature of programming the two go hand in hand. In each piece of code there are many paths that can be travelled, much like a maze in a country mansion garden. If you ask 10 different people to walk the maze the chances are each one will set off in a different direction. Most of them will hit a dead end before finding their way through and a nasty bug could be hiding at each of these dead ends!</p>

<p>However Open Source software helps minimize the number bugs by accepting contributions to fix any that are found by the development community. In this way the software benefits from the knowledge of a much wider group of people than could be acheived if it was developed and maintained soley by a single company. Most software developers are driven by that itch to &lsquo;make stuff work&rsquo; and are only too happy to contribute to a project which helps make this happen. The end result is a product that is more reliable for the consumers and stakeholders and has the appearance of &lsquo;just working&rsquo;.</p>

<h2>Security concerns</h2>


<p>Typically the biggest obstruction to making software Open Source is the perceived risk to security. If anybody can view exactly how the software is operating then it is much easier for hackers to cause the software to break, exploit a vulnerability to propogate a virus or carry out other nefarious acts. The <a href="http://haacked.com/archive/2012/03/29/asp-net-mvc-now-accepting-pull-requests.aspx">indications by Phil Haack</a>, a former member of the MVC team, are that this decision by Mircosoft is no exception. So a great deal of credit should go to those involved at Microsoft for making change happen in their organization.</p>

<p>Regarding the perceived risks to security, Open Source can actually reduce the risk for similar reasons to the improvement in relibility. Any security vulnerabilities will quickly be picked up by the community and fixed. The Open Source culture of continual improvement in the software makes for a much more secure product.</p>

<p>Take the example of web browsers, a couple of years ago Microsoft&rsquo;s Internet Explorer browser had massive market share. However over time so many security vulnerabilities were exploited in the browser that the <a href="http://www.theinquirer.net/inquirer/news/1037530/us-government-warns-internet-explorer">US government themselves warned against using the software</a>!   Along came Mozilla&rsquo;s Firefox browser to save the day, with much improved security. Naturally Firefox has always been developed under an Open Source licence as explained in the <a href="http://www.mozilla.org/about/manifesto.html">Mozilla manifesto</a>.</p>

<h2>Future developments</h2>


<p>The likelyhood is that this announcement will not trigger a deluge of community updates and fixes to the frameworks in question. I anticipate that a minority of change submissions will make it back into the frameworks themselves. However it does demonstrate an important change in mindset from Microsoft and may well signal the beginnings of a new approach for the organisation. It is clear that in the fast moving world of software and digital media you need to adapt to survive and it is encouraging that even massive organisations such as Microsoft are able to do this.</p>

<h5>Footnote</h5>


<p><sup>1</sup>While the MVC framework has been open source since its original release, this announcement widens the license model to the Web API and Razor frameworks and also marks the first time that Microsoft will accept public contributions to the open source frameworks. If you are unfamiliar with these technologies then further information is available on the Microsoft blah blah (LINK).</p>

<p><sup>2</sup>Or maybe thats just my fertile imagination!</p>
]]></content>
  </entry>
  
</feed>
