Using frameworks to enhance your applications

Let's face it, writing any application these days, be it for a rich client or a thin one, starts off as if you're in a restaurant choosing from a menu. You're presented with a set of choices for this framework or that framework, some of which are de facto choices, others that may be less appealing. There are side dishes of controls you might want to use, so you have to select them as well.

Because you're here reading this post on this particular website from this particular .NET control and framework vendor, we're going to assume that your number one, automatic choice will be the .NET Framework. A given, you might say. Ditto for our controls, because obviously you have good taste.

But what about other frameworks? Obviously we have ours for creating an ORM (eXpress Persistent Objects) or for creating an MVC type application (eXpressApp Framework), but there are some others out there, open source, that you might want to investigate to polish the user interface of your apps. Here's a brief selection and please note I don't pretend to be thorough here.

CSS frameworks

Let's start at the top, in your users' face, as it were. Cascading Stylesheets (CSS) have been the way to style to look and feel of your web apps for a long time. But did you realize that there were frameworks for CSS?

Yahoo!, as part of their various developer products, have a CSS framework called YUI Grids CSS. No, not grids in the way we use the term, but grids that help you layout your web pages. There's a builder application that helps you explore the layouts you can create with the YUI Grids CSS, and you can get the HTML code once you've worked out a layout you like.

A better one, in my view, is Blueprint CSS. Again it's a grid based framework that gives you the ability to go to 24 columns across. Before you go, what the..., let me explain that in general you merge columns newspaper style, you don't try and put 24 columns on the screen at the same time. The grids, if you like, allow you to layout your content as if you were in a graphics app ("snap to grid"). Blueprint also comes with some good looking (and consistent) font choices for your various HTML elements.

JavaScript frameworks

Moving through the presentation layer for web apps brings you up against JavaScript. With JavaScript you can do some really interesting effects, and provide some important user interactivity. But the whole question of browser support and the differences in the browser DOMs really make this hard, as if writing JavaScript well wasn't hard enough.

There are, to be blunt, a great number of JavaScript Frameworks and libraries you really should be considering for your web apps. These frameworks will make your work incredibly easier since they will abstract away the problems you will run into and have to solve anyway. These are the ones that I've investigated.

First up here is Yahoo again with their Yahoo! User Interface Library (That's what YUI means above). There is a whole boatload of JavaScript goodness in this library, all the way from manipulating the DOM, adding events, some lightweight controls, drag-and-drop, and so on, so forth. There's also a compressor for minifying your JavaScript, a profiler, and other tools. Best of all, the impact on the window global object boils down to a single object called YAHOO. Everything is in there, nicely namespaced.

Next is a tiny library called Base. This is a really good library for creating a class model in JavaScript, especially if you are used to "classical" class modeling the way we do in C# rather than the prototypal modeling you find in JavaScript. It gets pretty close and is an amazing feat.

If you prefer something a little more accepted and widespread, there's always Prototype. It has good class inheritance functionality through its Class module. Prototype has some excellent AJAX functionality as well, although you'd presumably be using ASP.NET AJAX. I don't know too much about its DOM manipulation features, because I much prefer the next framework in my list.

The final one I'd like to talk about is jQuery. This is, essentially, a JavaScript library for manipulating the DOM (so it overlaps YUI and Prototype in that respect). In its latest incarnation (1.3.x), it is remarkably fast at querying the DOM (which is the precursor to doing a lot of other work with jQuery: you find some elements according to some selector values and then you manipulate them). There are other libraries that build upon jQuery, notably jQuery UI, which is a set of user interface widgets that use jQuery. Like YUI, jQuery has a minimal effect on the global object: just two global identifiers, jQuery and $, although you can turn off $ if you are using something like MooTools which also uses it.

Presentation layer frameworks

Did you know that there are frameworks that embed a browser in them so that you can create a desktop application out of a web page? The most famous is Adobe Air: it will package up the HTML, CSS and JavaScript from a web application to produce a fully functional desktop application. This desktop app can have full access to your file system, registry, and so on. Instead of publishing your desktop application on the web, you're publishing your web application on the desktop.

This is kind of a mind bender in a way. The application is not displaying a web page from out there in internet-land, it is just using HTML, etc, as the presentation layer for a normal desktop application. In other words, this isn't Google Chrome's "Create Application Shortcut", which is just a way of using Chrome without the chrome for a particular web site.

Adobe Air is downloadable for free, but in case you want an open source, no mega-corporation framework instead, try out Titanium.

Of course, in the .NET world, there's WPF and Silverlight. Both of which we support with an ever-growing set of controls.

So, go on, have some fun investigating frameworks for your next application and save some time by using them.

Free DevExpress Products – Get Your Copy Today