CloudDays™ – Quick Start to Azure Redis Cache

redisAzure Redis Cache helps your application become more responsive even as user load increases and leverages the low latency, high-throughput capabilities of the Redis engine. This separate distributed cache layer allows your data tier to scale independently for more efficient use of compute resources in your application layer.

Redis is an open source, BSD licensed, advanced key-value cache and store. It is often referred to as a data structure server since keys can contain strings, hashes, lists, sets, sorted sets, bitmaps and hyperloglogs. Redis supports a set of atomic operations on these data types.

Microsoft Azure Redis Cache is based on this cache and store. It gives you access to a secure, dedicated Redis cache, managed by Microsoft, providing the best of both worlds: the rich features and ecosystem of Redis, and reliable hosting and monitoring by Microsoft.

You can use Redis from most programming languages used today.

Azure Redis Cache leverages Redis authentication and also supports SSL connections to Redis.

The purpose of this article is to help you decide if Azure Redis is the right technology for your project. The Azure documentation is pretty good to help you get started, but is spread all over the place, so this article focuses on the steps to get started, and gives you a peek into what your code looks like. (If you are like me, you can often tell if the technology is a good fit by seeing code.)

NOTE: Of course, you can use Redis without Azure. For more information on that, see Distributed Caching using Redis Server with .NET/C# Client.

Continue reading “CloudDays™ – Quick Start to Azure Redis Cache”

Dev Patterns – Dependency Injection (aka Inversion of Control)

diamond-cubes-2-pattern-clip-art“Dependency Injection” (DI), also more cryptically known as “Inversion of Control” (IoC), can be used as a technique for encouraging this loose coupling.

John Munsch explains it like this:

When you go and get things out of the refrigerator for yourself, you can cause problems. You might leave the door open, you might get something Mommy or Daddy doesn’t want you to have. You might even be looking for something we don’t even have or which has expired.

What you should be doing is stating a need, “I need something to drink with lunch,” and then we will make sure you have something when you sit down to eat.

In designing an object-oriented application, a major tenet of design is “loose coupling”. Objects should only have as many dependencies as is needed to do their job – and the dependencies should be few.

There are three primary approaches to implementing DI:

  • Constructor injection
  • Setter injection (also called Property injection)
  • Method injection

Constructor injection uses parameters to inject dependencies. In setter injection, you use setter methods to inject the object’s dependencies. Finally, in interface-based injection, you design an interface to inject dependencies.

Continue reading “Dev Patterns – Dependency Injection (aka Inversion of Control)”

Object JavaScript – Better JavaScript Using TypeScript

imageTypeScript is a language for application-scale JavaScript development. TypeScript is a typed superset of JavaScript that compiles to plain JavaScript. Any browser. Any host. Any OS. Open Source.

TypeScript is a superset of JavaScript that combines type checking and static analysis, explicit interfaces, and best practices into a single language and compiler. By building on JavaScript, TypeScript keeps you close to the runtime you’re targeting while adding only the syntactic sugar necessary to support large applications and large teams.

TypeScript starts from the syntax and semantics that JavaScript developers know today. With TypeScript, you can use existing JavaScript code, incorporate popular JavaScript libraries, and be called from other JavaScript code.

TypeScript compiles to clean, simple JavaScript code which runs on any browser, in Node.js, or in any other ES3-compatible environment.

The latest version of TypeScript includes of new features in the language, compiler and associated tools. And it comes in the box as part of Visual Studio 2013 and Visual Studio 2015.

Continue reading “Object JavaScript – Better JavaScript Using TypeScript”

CSS Tutorial – Font Sizing

css3_logoYou can use Cascading Style Sheets (CSS) is to modify the font or typography of the page. There are several ways to describe font sizes.

In the font-size property, you’ll know that there are many different measurements to use when defining the size of the font.

Relative lengths

  • xx-small through xx-large – relative to the default browser font size
  • percentages – relative to the surrounding text
  • em and ex – relative to the parent element
  • pixels – relative to the screen resolution

Absolute lengths

  • points and picas – print units
  • inches, centimeters, and millimeters – length units

Continue reading “CSS Tutorial – Font Sizing”

Tip – Serving .json File on Windows (IIS, IIS Express)

imageSo what is wrong with the simple getJSON call? Why doesn’t it work?

<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript">
  $(document).ready(function(){
     $.getJSON('data.json',function(result){
      alert("success");
    });
  });

It works fine in Firefox 11 but not in IE and Chrome. By default, IIS6 does not serve .json (no wildcard MIME type). So you will see a 404 not found thrown.

By default, IIS in Windows Server 2003 and beyond does not serve files that aren’t of a MIME type that it knows about (instead returning 404 errors).

So, to serve up JSON files you need to add a MIME type to IIS to allow it to serve that type of file. You can set it at the site level or at the server level.

Continue reading “Tip – Serving .json File on Windows (IIS, IIS Express)”

Single Page App – isLoading jQuery Plugin to Indicate Content Loads

imageWhen you’re loading information using jQuery AJAX, you may want to provide visual feedback when loading data or for any action that would take time.

In this Snippet, you will learn how to:

  • Load JSON data from a getJSON call to our server.
  • Show and hide a spinning indicator inside a div.
  • Bind the incoming data to a view model object.
  • Use the view model to populate an external template.

image

Then once the page is loaded, it will display the data based on an external template.

image

And we’ll provide some tips on how you you can use the IsLoading library to display the loading indicator on top of the page while loading and on top of the div itself.

Continue reading “Single Page App – isLoading jQuery Plugin to Indicate Content Loads”

Single Page App – Separate UI from Model Using Publish, Subscribe Pattern using AmplifyJS

image8AmplifyJS is a set of components designed to solve common web application problems with a simplistic API. Amplify’s goal is to simplify all forms of data handling by providing a unified API for various data sources.

Your application may need more sophisticated control than is offered in Knockout, which provides for automatic updates in your view model. Knockout provides the observable pattern. But in the pattern described here Amplify’s publish/subscribe you do the publishing and the subscription.

In this post, you’ll learn the basics of how you can implement publish/subscribe pattern on the client using Amplify.

Continue reading “Single Page App – Separate UI from Model Using Publish, Subscribe Pattern using AmplifyJS”

Single Page Apps – Retrieving, Caching Server Requests Using AmplifyJS

image8You may want to use storage to store data. You can save the data your user has entered in a wizard. Or you might want to save data so you can provide an offline experience. Or you may want to store user preferences. Local storage is a good idea anytime you do not want, or need your user or your application to start all over.

AmplifyJS is a very neat library that provides a consistent API to handle client storage that works in most browsers.

In this post, you will learn to retrieve the data through amplify.request without concern for data caching, server interface, resource location, data types, wrappers, and all the other specificities of the client/server interaction.

Requests made through amplify.request will always be resolved asynchronously, even if the resource invokes the callbacks immediately.

You will probably need jQuery for Amplify Request. The default request type shipped with AmplifyJS does utilize jQuery AJAX, but you can just as easily create a new request type that uses Dojo, MooTools, etc.

However the publish/subscribe and store components do not use jQuery at all.

Continue reading “Single Page Apps – Retrieving, Caching Server Requests Using AmplifyJS”

Single Page Apps – Store Your Data Locally in Knockout Using AmplifyJS

image8[3]Amplify store and Knockout can be great partners. For example, you can use client storage to improve user experience, remembering user preferences or previously entered values such that the user doesn’t have to start all over.

There is a tutorial on Knockout that provides for client storage. In the tutorial, Knockout uses Amplify to restore user data when the user revisits the site.

You can augment Knockout observables with additional functionality, by using extenders.

You can use extender to automatically store and restore any observable property. Continue reading “Single Page Apps – Store Your Data Locally in Knockout Using AmplifyJS”

Single Page Apps – Local Data Store with AmplifyJS

imageYou may want to use storage to store data. You can save the data your user has entered in a wizard. Or you might want to save data so you can provide an offline experience. Or you may want to store user preferences. Local storage is a good idea anytime you do not want, or need your user or your application to start all over.

AmplifyJS is a very neat library that provides a consistent API to handle client storage that works in most browsers.

Of course, you can use HTML5 Local Storage. But amplify.store supports IE 5+, Firefox 2+, Safari 4+, Chrome, Opera 10.5+, iPhone 2+, Android 2+ and provides a consistent API to handle storage cross-browser.

Note: Because of the JSON dependency, you need to add json2.js for support in browsers without native JSON support, including IE 5, IE 6, IE 7, Firefox 2.0 and Firefox 3.0.

Continue reading “Single Page Apps – Local Data Store with AmplifyJS”