Install local Redis instance with “Bash on Ubuntu on Windows”

In Windows 10, there is a feature that allows you to run native Bash Linux. Pretty cool, and I’ve started using it to have a local Redis instance running on my local dev machine that runs Windows.

Install Bash on Windows

To get this feature, you need the Windows 10 “anniversary” update. You need to then turn on developer mode in Windows. To do this, go the Settings > Update & Security > select For developers on the left and select the Developer Mode radio button.

You then need to turn on the Bash feature in Windows. Go to Programs and Features on the control panel, select Turn Windows features on or off, then navigate to “Windows subsystem for Linux“.

You’ll probably need a restart.

Install Redis

You should now be able to find “Bash on Ubuntu on Windows” (snappy name) from a search in your start menu. Open it.

First thing we need to do is install Dotdeb – which has a bunch of packages – including Redis – for use here.

To install Dotdeb:

You need to add a couple of lines to your APT list that allows us to use Dotdeb. I did this using nano text editor, with the following command:

sudo nano /etc/apt/sources.list

You will probably then be asked for a password. The next screen displays a list of sources. you need to add a couple of lines to the bottom:

deb http://packages.dotdeb.org squeeze all
deb-src http://packages.dotdeb.org squeeze all

Then press Cntl + O followed by enter to save in the same location. Then Cntl + X to exit nano.

Then run the following two commands to get and add GnuPG key.

wget https://www.dotdeb.org/dotdeb.gpg
sudo apt-key add dotdeb.gpg

Finally you need to run the following the get the APT packages:

sudo apt-get update

Once this all is done, you have the simple step of installing Redis, which is done using the following:

sudo apt-get install redis-server

That should be you all set up.

Useful commands

Once you are installed you, obviously, will want to start up your local server. The command for this is:

sudo service redis-server start

You can check the server’s status with: sudo service redis-server status

You may also want to run look at what’s stored on your server. To do this enter the command redis-cli. Once in cli you can do stuff like:

Info – what is says on the tin – info about your server instance. Number of connections, memory usage etc.

keys * – lists all keys stored in the instance

get <myKey> – retrieves the object stored for supplied key.

 

Note: most of the information came from: http://www.hanselman.com/blog/DevelopersCanRunBashShellAndUsermodeUbuntuLinuxBinariesOnWindows10.aspx I have provided a bit more instruction on setting up Redis as I struggled a tad as a Linux noobie and figured I wouldn’t be the only one!

End-to-end Integration tests for Web Api

Recently I was looking at the NancyFx framework, what found I liked most about the whole thing was the Nancy.Testing library. It allows you to not just test the code inside your API, but actually make the request to the Url, with any headers, body or whatever with it. This means you are testing everything. You can ensure you are sending back the right status codes, content types and that you are handling authorization correctly.

To do this in Nancy, the code looks something like:

 

[TestMethod]
public void GetEmployeesExpectOK()
{
    var bootstrap = new ConfigurableBootstrapper(c => c.Module<EmployeeModule>());
    var browser = new Browser(bootstrap);

    BrowserResponse response = browser.Get("/Employees/", with =>
    {
        with.HttpRequest();
        with.Header("Accept", "application/json");
    });

    Assert.AreEqual(HttpStatusCode.OK, response.StatusCode);
}

 

As you can see here, you create a “Browser” and use it to request at the specified route. Pretty cool. This was particularly useful for adding some automated acceptance tests for your application – as it allows us to tests all the way from an API request, down to the data storage and back out again. However, we were not using NancyFx for our API, we were using ASP.Net Web API instead – so we needed to replicate this way of testing.

Happily a library exists which allows you to implement tests this way for Web API. This is called WebApi.Testing (http://www.nuget.org/packages/WebAPI.Testing/). The code is very similar, except there are some flaws.

 



[TestMethod]
public void GetEmployeesExpectOK()
{
    var config = new HttpConfiguration();
    config.MapHttpAttributeRoutes();
    config.Routes.MapHttpRoute(
    name:"DefaultApi",
    routeTemplate:"api/{controller}/{id}",
    defaults:new{ id =RouteParameter.Optional});

    Browser browser = new Browser(config);var response = browser.Get("/Employees/",(with)=>
    {
        with.Header("Accept","application/json");
        with.HttpRequest();
    });
    Assert.Equals(HttpStatusCode.OK, response.StatusCode);
}

What I don’t like about this is that we have to re-define the routes for the API project, so we’re not really testing the real routes from our application, which is a shame. The solution we found was to edit the WebApiConfig in the API project, so we can get the routes from out test, like so:


public static void Register(HttpConfiguration config) 
{ 
    // Setup Web API configuration routes 
    config = GetConfig(config); 
} 

//This is added so we can return the HttpConfiguratio
public static HttpConfiguration GetConfig(HttpConfiguration config) 
{ 
    config.MapHttpAttributeRoutes(); 

    config.Routes.MapHttpRoute( 
    name: "DefaultApi", 
    routeTemplate: "api/{controller}/{id}", 
    defaults: new { id = RouteParameter.Optional } 
    ); 

    return config; 
}

Then in the test class:


[TestMethod]
public void GetEmployeesExpectOK()
{
    var config = ApiProject.WebApiConfig.GetConfig(new HttpConfiguration()); //Get the routes from API project
    var browser = new Browser(config); 
    var response = browser.Get("/Employees/", (with) => 
    { 
        with.Header("Accept", "application/json"); 
        with.HttpRequest(); 
    }); 

    Assert.AreEqual(HttpStatusCode.OK, response.StatusCode);
}

As you can see here, we just get the route configuration from the application and use it in the test, and now we are testing the routes too.

Writing a Prezi clone with HTML5, SVG, and Javascript

Aditya Bhatt

The idea

The other day, I took it upon myself to write a browser-based Prezi-like app without using flash. Condition: It should run purely client-side.

It was also an experiment in evaluating whether the current APIs available in modern browsers are enough to handle the task. What follows is an account of what works, what doesn’t, and what could be done better.

SVG vs Canvas

When you’re building a rich graphics-intensive app like Prezi, you usually have two ways of rendering content: SVG and Canvas.

1. SVG provides a neat DOM that can be manipulated with existing DOM handling javascript libraries, such as jQuery. Canvas, on the other hand, is just a bitmap buffer. This means that you have to program your own DOM-like scene graph if you wish to use Canvas for handling presentation elements. Libraries for this already exist – most notably, fabric.js, but none…

View original post 963 more words

The SpecFlow Chronicles – Volume 1 : Turning Tests Into Living Documentation

Tester Vs Computer

As I mentioned in last week’s post, part of my focus is to help my team increase its capabilities in the area of test automation.  We would like to increase the scope of our automation and, in particular, we would like to increase the level of collaboration between developers and black-box QA in implementing and maintaining the tests.

Some of the challenges that we’re currently facing:

  • Many black box testers lack the automation experience needed to automate the tests that they want to automate
  • Developers don’t know what the testers want to automate
  • The tests that are currently being run are not transparent to the business side
  • Existing test automation is not being maintained or exploited because it’s only well-understood by those that implemented it

Over the past few months, my team has been playing with an open-source tool called SpecFlow as we try to address these challenges.

What…

View original post 788 more words

Themes for MVC Views

If you have a MVC application and you wish to be able to configure it to use different views or .css, here is how.

Create the configuration

First things first. You’ll need to set somewhere the configuration which defines which of your themes to use. This part is dependent on what you are trying to achieve. When I used this method, my intentions where to provide some slightly different looking pages to be used when the application was deployed in an iFrame as opposed to when it ran on its own. So, for this purpose I just stuck a setting in the application’s web.config file. Like, so

<appSettings>
<add key="Theme" value="Default_Theme"/>
</appSettings>

Place your themed views into folders

The Next thing to do will be to place your views into sub-folders that are categorised by their theme. Here you will require one folder for “Default” views. In this folder you will need a full set of views (i.e. it has all pages required for the application). All subsequent theme folders will only need a page where it requires a different from the default. By which I mean, if your controller looks up a view and can’t find the file in your configured theme it will fall back and use the related default theme.

ThemeViewFolders

Create your custom RazorViewEngine

The next step is to use your configuration to display the set of views you want.

The standard RazorViewEngine will Get your razor views from the folder structure of “Views/Subfolder/page.cshtml”. However, now we have placed our views a layer down in the folder structure. We could, of course, explicitly define our path as “Views/Theme1/Subfolder.page.cshtml” everywhere but for obvious reasons this can get messy! There is another way, and that is to create a custom RazorViewEngine class. To do this you’ll need to add the following code to your application:


public class ThemedRazorViewEngine : RazorViewEngine
{
   public ThemedRazorViewEngine(string themeName)
   {
       const string defaultThemeName = "Default_Theme";

       MasterLocationFormats = new string[]
       {
        "~/Views/" + themeName + "/Shared/{0}.cshtml",
        "~/Views/" + defaultThemeName + "/Shared/{0}.cshtml",
       };

       PartialViewLocationFormats = new string[]
       {
         "~/Views/" + themeName + "/{1}/{0}.cshtml",
         "~/Views/" + themeName + "/Shared/{0}.cshtml",
         "~/Views/" + defaultThemeName + "/{1}/{0}.cshtml",
         "~/Views/" + defaultThemeName + "/Shared/{0}.cshtml"
       };

       ViewLocationFormats = new string[]
       {
         "~/Views/" + themeName + "/{1}/{0}.cshtml",
         "~/Views/" + themeName + "/Shared/{0}.cshtml",
         "~/Views/" + defaultThemeName + "/{1}/{0}.cshtml",
         "~/Views/" + defaultThemeName + "/Shared/{0}.cshtml"
       };
    }
}

And then add the following two statements in your global.asax in the Applicaton_Start() method to register your custom view engine:


// Gets the theme name from the web.config
string themeName = ConfigurationManager.AppSettings["Theme"];
ViewEngines.Engines.Clear();
ViewEngines.Engines.Add(new ThemedRazorViewEngine(themeName));

Using a seperate CSS file

As well as altering the layout of your views, you may also wish to apply alternate CSS to your themed views. The infrastructure for doing this is almost there, using the above. All you’ll have to do is create a new _Layout.cshtml file in the folder for your new theme, which renders the desired CSS.

The layout can look almost the same as what you had in your default theme (unless you desire otherwise), except you will need to choose which style you render. For example , by default your _Layout.cshtml will have the following line:

@Styles.Render("~/Content/css")

If you have placed your alternate CSS file in a seperate folder then you will need to replace this with something like:

@Styles.Render("~/Content/Themes/New_Theme/css")

Or if you wish to re-use the existing CSS but add some extra/specific stuff to it you can just choose to render the additional file, like:

 @Styles.Render("~/Content/css")
 @Styles.Render("~/Content/Themes/New_Theme/style.css")

I hope this helps!