Enter the Web Matrix v0.6 by Thomas GIL (thomas.gil@dotnetguru.org)


Introduction

Today, the 15th of June 2003, the new version of Web Matrix has been released by Microsoft. This Web development environment is efficient, robust, free and light. Being free, it contributes to the democratization of .NET technologies: in this way, WebMatrix can be compared to other competitive free products such as:

For most projects, developers can just install this collection of free tools and reduce the global building price of .NET applications!

For the last few weeks, Microsoft and Borland have been promoting their respective IDEs, Visual Studio.NET and C#Builder; it is thus easy to misunderstand this message and think that one needs to install a costly IDE to create real .NET applications, and that it is mandatory to install the Windows operating system.

It is thus comforting to know that it is possible to implement all the layers of modern distributed applications (visualization, presentation, service, business and data access) with only free tools. WebMatrix, as we'll see, does very well what it's been built for: it enables the developer to implement the presentation layer of .NET Web applications.

In this short article, we'll give you a tour of this product, that we think is very promising, and point out its qualities (in comparison with even VS.NET and C#Builder) and its residual gaps.

First impressions

WebMatrix can be downloaded from www.asp.net. Afer a surpriseless installation, one discovers a user-friendly environment that respects the practices of the VS.NET or C#Builder users:

Figure A: First contact with WebMatrix

The first thing one will want to do is of course create a new ASP.NET page. Once more, one feels immediately at home in the visual ASPX page design interface; tabs differentiate HTML elements and ASP.NET WebControls (one not surprisingly finds the list of controls from the System.Web.UI.WebControls namespace):

Figure B: Graphical design of an ASP.NET page

So far, so good. Innovation has been ruled out of this part of the tool, to give us a design experience that's almost identical to what VS.NET offers. As a result, any ASP.NET developer is able to develop the graphical part of his pages in minutes. The investment in other IDEs shows profitable.

A small technical detail seduced us: in opposition to its big brother VS.NET, WebMatrix chooses to put the designer into "FlowLayout" instead of "GridLayout" by default. You already know that we largely prefer the first mode, under which web pages resize dynamically according to the size of the browser window (and according to the user's screen resolution). The other mode, GridLayout, is appealing to Visual Basic 6 users (absolute positioning of visual components), but doesn't respect the Web's philosophy: applications would be developed for a restricted target.

Once our page has been built, simply pressing F5 is enough to execute it. But there's a subtlety hiding behind this magic (that users of the previous version of WebMatrix already know): the Web server that executes our Web application can be either:

This last point means that it is possible to build and test our ASP.NET applications on any development platform (including Windows 98).

User event management

As we've seen, the visual design of ASP.NET pages is no problem for WebMatrix. Let's look at user interaction with pages now; as in other IDEs, all we have to do to handle a click event on the submit button of our form is double-click on it in the designer. The results, this time, do not look good:

Figure C: Reaction to the click event on an image button

For our readers who may find "do not look good" a little severe, let's switch to the "All" tab that shows the whole code for the ASP.NET page:

Figure D: Reaction to the click event on an image button - complete code

Yes, all the C# (or VB.NET, J#) code is in the ASPX page itself, confined in a <script> tag.

This means that WebMatrix does not use CodeBehind classes at all, despite their being an indispensable tool to separate responsibilities. Thus, the same page is responsible for the presentation and the management of the dialogue with the user, two activities that can be assumed by different roles on a project and that must be separated into distinct components.

Of course, nothing prevents the developers from building a separate assembly (in SharpDevelop for example) that's responsible for the behavior of the Web site, including the codebehind, and only using WebMatrix to manage the presentation layer. Too bad there's no coupling between different development tools for the presentation and session layers, which would lead to small maintenance problems to keep ASP.NET and codebehind coherent.

Even if we reluctantly accept to type our code in the <script> environment of the ASPX page, we stop doing so very quickly; the C# editor in WebMatrix is very crude: no automatic code completion, no automatic layout of the code, and let's not even talk about refactoring... In summary, this is an editor that only relates to C# by code coloring. We're very far, for code edition, from what VS.NET, C#Builder or SharpDevelop have to offer!

Database access

The relational database access is what WebMatrix is best at, even surpassing some of VS.NET's possibilities!

Let's first say that that this tools gives access to three database types: SQLServer, MSDE and Access. Of course, the database has to exist before we connect to it using the "Data" tab of WebMatrix. But everything else can be done from the IDE:

But the best accomplishment (amateurs of quick and dirty development will appreciate) is the integration of database data into an ASP.NET page. You probably know (as we'd have seen had we used VS.NET) that several steps are necessary to get the results of a SQL query to display in an ASPX page:

In WebMatrix, this is not necessary: just drag and drop a table from the Data tab onto the design surface of our ASP.NET page! Microsoft evangelists will have nice and spectacular demos to show in the near future! See for yourself:

Figure E: After dragging and dropping the "Personnes" table onto the design surface of the IDE

That's it!

But a closer look enables us to note that the displayed component is not a standard DataGrid but is a specific user control, developed by the WebMatrix team: the MxDataGrid. A second component (responsible for the database connection and the request execution) has been added to the page: an AccessDataSourceControl.

After the initial seduction, we were concerned by these proprietary WebMatrix controls; will we have the right to use them in a production environment, and under which conditions? But the editor's answers to our questions eliminate these concerns: these controls are available and freely redistributable.

These very controls (especially the MxDataGrid) do automatically what the DataGrid wasn't able to do: pagination and column sorting. The configuration of these options is very simple using the control's property sheet (AllowSorting, AllowPaging and PageSize properties).

Thus, it is possible, in less than a minute and thanks to WebMatrix, to get a nice ASP.NET page that presents the results of a SQL query on a database table that automatically manages pagination and sorting.

More seriously, we are convinced that the MxDataGrid component simplifies the use of the DataGrid (typically the sorting and pagination behaviors). But in a more complex site, we strongly advice against this approach: it may be very direct but it will not allow for rational management of the modification of data structures or for the representation of the data as a business object model. Architecture to use with great moderation, even though the tool is really irreproachably implemented! Congratulations!

Other WebMatrix features

Undeniable qualities of the tool

The previous sections have outlined the essential features of WebMatrix: developing and testing ASP.NET pages, and directly access databases. But as in any tool, this hard core is surrounded by a myriad small peripheral assistants and tools; we won't formally classify them, but we'll present here those that seduced us.

User Control management

Being used to VS.NET, we expected to be able to build User Controls (ASCX) in WebMatrix. We have thus transformed our authentication form into a new User Control: "login.ascx".

Once this control developed, we have naturally tried to drag and drop the control onto the design surface of the "NewPetShop.aspx" page. What a surprise! See for yourself:

Figure F: After dragging and dropping the "Login.ascx" control onto the "NewPetShop.aspx" page

You're not dreaming: the control does not become a gray box on the design surface, but we really have a faithful preview (WYSIWYG) of what the control will look like at run-time. We can get a good idea of the look, but also of the size of the control, and have less visual impedance surprises between the controls' looks and the page aggregation. A real accomplishment, given that other development environments do not (yet) have this feature!

Additional control library

No formal revolution: WebMatrix allows for extensions of its control library with new user controls, whether they come from Microsoft or from a team internal to the user company.

No, it's not the form which is simply excellent: WebMatrix has the ability to discover the list of available components by invoking a Web Service! When the user asks it to install the selected component, it downloads it and dynamically integrates it to the selected tab. Here's what it looks like:

Figure G: Accessing a predefined user control library

It is even possible, before the installation, to get a runtime preview of the control:

Figure H: Details and visual preview of a user control

You're perhaps thinking that WebMatrix's internal plumbing to manage user controls is none of the user's business. That's true, but we see a unique opportunity there: WebMatrix behaving like a Web Service client, and the address of this service being configurable from the control browser, nothing can prevent us from developing our own component catalog Web Service!

This is fundamental: to access a good reusability level, one has to develop reusable controls, but also document them, manage their versions and configurations, and give the developers the tools to find the right tools for their needs and install these into their favorite development environement.

The benefit of the component search and install Web Services is that WebMatrix offers a weak coupling with the component managing system (what's generally called a repository or component catalog).

What would be really great, now that the infrastructure is ready, would be to develop a server-side Web Service that would be the facade for a configuration manager (CVS for example...), and that could dynamically maintain the list and versions of the components updated.

It's worth noting that this kind of tool is not new: Microsoft has been maintaining a component repository for several years (COM/ActiveX), with a search engine and version management. But here, with Web Services, one could very well navigate on component catalogs (free and commercial) anywhere on the Web, and implemented on any system (OS + language + configuration manager)! The dream comes true...

Search engine on the .NET Framework classes

Less impressive than adding controls at will using Web Services, but as useful: WebMatrix shows in its "Classes" tab a very simple and effecient search engine on the .NET Framework classes. It gives us a logical (namespace oriented) or physical (assembly oriented) view of the standard .NET classes, as well as of the WebMatrix classes.

Figure I: Search engine on .NET Framework classes

Some regrets

WebMatrix reaches its 0.6 version, the product is globally mature, but there are still a few points that are perfectible. Of course, it's easy to be a critic, so we'll present this as a wishlist to the WebMatrix development team for the next version...

Available editors in WebMatrix

The editors (visual and source code) HTML / ASPX / ASCX are very good. One feels immediateley at home, manipulations are natural and intuitive. We have even felt the urge to write this paper in WebMatrix; unfortunately, after a few lines, we've encoutered two major problems:

We already mentioned it: the code editor (C#, J# or VB.NET) does not feature automatic code completion or automatic formatting. It is thus very limited for the development of classes (business, service, data access), and one will generally prefer to use SharpDevelop for this part. The only problem is that WebMatrix and SharpDevelop are not integrated, and nothing has been planned to use them together... This effort is thus the responsibility of developers.

Finally, even though WebMatrix features XML, CSS and XSLT stylesheets and SQL edition, the wizards only create a skeleton for the file. The edition itself takes place in a Notepad-like editor, with no color coding or automatic completion. It is of course better to look for other tools to edit this kind of files (for example, XML Cooktop for XML and XSLT).

WebMatrix documentation

The whole documentation of WebMatrix, and of the .NET Framework, as well as the ASP.NET tutorials, are only available online. We regret that the installation does not propose to make a local copy of the necessary documentation on the developer's hard drive, which would have enabled disconnected systems to use the docs (even connected systems would benefit from faster information retrieval).

Conclusion

WebMatrix 0.6 is a free tool that is absolutely sufficient to develop the Web presentation layer (ASP.NET) of a .NET application. It is also useful to build prototypes or short-lived applications in which ASPX pages (or ASCX controls) directly access a relational database. For this kind of application, it surpasses on some aspects commercial IDEs (VS.NET and C#Builder).

The reusable component management, open, flexible and efficient, should inspire many development environments! We see this as an important point for enterprise and commercial component repositories: editors have a lot to win by exposing evaluation versions of their components using a WebMatrix compatible WebService...

On the other hand, one shouldn't expect to be able to develop a complete multi-level application with WebMatrix: for the service, business and data access layers, other tools are much better fit (in particular SharpDevelop, Eclipse with its C# plug-in, and of course commercial IDEs such as VS.NET and C#Builder). A good idea would be to integrate WebMatrix and SharpDevelop together, especially for the user event management, which should in our opinion be done from CodeBehind classes. A double-click on a button should ideally create the associated CodeBehind associated with the ASPX page and open it in SharpDevelop... Who knows? Maybe this will be a surprise of version 0.7?

Resources

WeMatrix: http://asp.net/webmatrix/download.aspx

Projet Mono: http://www.go-mono.com

#Develop: http://www.icsharpcode.net/OpenSource/SD/Default.aspx



Author: Thomas GIL

Translator (French to English): Bertrand LeRoy

Copyright DotNetGuru June 2003