Nik's Technology Blog

Travels through programming, networks, and computers

An Introduction to Web Development and Design for Work Experience Students

We have a school student coming into our agency for work experience shortly, so I'm putting together a programme which will introduce him to the various areas of web development, such as HTML, CSS, client-side and server-side code, databases and XML.

It is going to be difficult to cover the various different skills involved in web development in a week, and without knowing what sort of web development knowledge the student already possesses it is hard to determine what can be achieved in such a short time.

However the main goal of work experience is to give the student a flavour of what is involved in the profession, to allow them to make an informed decision on whether such a career is for them.

I've structured the programme as follows:

Day 1 - Introduction to Web Design
Day 2 - Introduction to HTML and CSS
Day 3 - Understanding web servers, web browsers and HTTP and FTP
Day 4 - Introduction to server-side and client-side programming
Day 5 - Overview of databases and XML

Within each topic I have posed questions and tasks, which will require research and learning.  For each subject I have provided links to tutorials and online information.

I'm also aware that web development is very much a practical and creative skill, so I've also set a project which will run for the whole week and will allow him to put what he has learned into practice by building a simple personal portfolio website.

I have no idea whether I'm being too ambitious, but surely that will depend on the student's current knowledge and interest in the subject.  I think that it can easily be tailored to each student depending on their interests. 

I have uploaded a PDF of my programme entitled An Introduction to Web Development and Design for Work Experience Students and would appreciate any feedback.

Language Interoperability in the .NET Framework

.NET is a powerful framework which was built to allow cross-language support.  All .NET code is compiled to Intermediate Language (IL) whether you are developing in C#, VB.NET, J# or any other .NET language.  This means it is possible to build applications with modules written in different languages, because when the application is compiled it will all be compiled to a common language, IL.

This means a class written in one language can inherit from a class written in another language, or an object can directly call a method of another class written in another .NET language.  Visual Studio also allows you to step through all the different modules in the debugger.

To demonstrate the Language Interoperability in .NET, I'm going to call a VB.NET method from the code-behind page of a C# ASP.NET page.  This isn't something you would ordinarily want to do, but its an easy way to show the power of .NET.

In Visual Studio, right-click your website root in Solution Explorer and select add reference.  Scroll down the .NET tab until you find Microsoft.VisualBasic and click ok.

This will modify your Web.Config file by adding an assembly reference to Microsoft.VisualBasic to the assemblies list.

            <assemblies>
                <add assembly="System.Core, Version=3.5.0.0, Culture=neutral, PublicKeyToken=B77A5C561934E089"/>
                <add assembly="System.Web.Extensions, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35"/>
                <add assembly="System.Data.DataSetExtensions, Version=3.5.0.0, Culture=neutral, PublicKeyToken=B77A5C561934E089"/>
                <add assembly="System.Xml.Linq, Version=3.5.0.0, Culture=neutral, PublicKeyToken=B77A5C561934E089"/>
                <add assembly="System.Web.Extensions.Design, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35"/>
                <add assembly="System.Design, Version=2.0.0.0, Culture=neutral, PublicKeyToken=B03F5F7F11D50A3A"/>
                <add assembly="System.Windows.Forms, Version=2.0.0.0, Culture=neutral, PublicKeyToken=B77A5C561934E089"/>
                <add assembly="Microsoft.VisualBasic, Version=8.0.0.0, Culture=neutral, PublicKeyToken=B03F5F7F11D50A3A"/>
      </assemblies>

To use the VB.NET language within your C# webform you need to add a using Microsoft.VisualBasic; statement at the top of your code-behind page.

In my demo example below I am going to use the VB.NET MonthName method of DateAndTime to get the current month's name and display it on my page using a ASP.NET label control.  The bold code below is VB.NET interspersed with C#.

using System;
using System.Collections.Generic;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using Microsoft.VisualBasic;

public partial class language_interop : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
        int month = DateTime.Today.Month;
        string monthName = DateAndTime.MonthName(month, false);
        labelMonthName.Text = monthName;
    }
}

TargetInvocationException - Exception has been thrown by the target of an invocation

This exception isn't very useful because it's a general exception thrown when a method invoked through reflection throws an exception, took me a while to figure out what the issue was.  Even though I knew the page causing the error.

This exception was thrown by a ASP.NET web form which contained a GridView connected to an ObjectDataSource.

The ObjectDataSource references methods in a data access layer class.  These methods then call stored procedures in the MS SQL database. 

The code worked perfectly in my development environment.

I have the SQL database set up so that the database user ASP.NET uses only has rights to execute the stored procedures it needs to.  The database user cannot run commands against the tables directly, this way I limit the surface area of attack should my application have a weakness that could be exploited.

I double checked the stored procedures were all up-to-date, then double checked all the permissions on the stored procedures, and everything seemed in order, but I still kept getting the stack trace below in Event Viewer:


    Stack trace:    at System.RuntimeMethodHandle._InvokeMethodFast(Object target, Object[] arguments, SignatureStruct& sig, MethodAttributes methodAttributes, RuntimeTypeHandle typeOwner)
   at System.RuntimeMethodHandle.InvokeMethodFast(Object target, Object[] arguments, Signature sig, MethodAttributes methodAttributes, RuntimeTypeHandle typeOwner)
   at System.Reflection.RuntimeMethodInfo.Invoke(Object obj, BindingFlags invokeAttr, Binder binder, Object[] parameters, CultureInfo culture, Boolean skipVisibilityChecks)
   at System.Reflection.RuntimeMethodInfo.Invoke(Object obj, BindingFlags invokeAttr, Binder binder, Object[] parameters, CultureInfo culture)
   at System.Web.UI.WebControls.ObjectDataSourceView.InvokeMethod(ObjectDataSourceMethod method, Boolean disposeInstance, Object& instance)
   at System.Web.UI.WebControls.ObjectDataSourceView.ExecuteSelect(DataSourceSelectArguments arguments)
   at System.Web.UI.DataSourceView.Select(DataSourceSelectArguments arguments, DataSourceViewSelectCallback callback)
   at System.Web.UI.WebControls.DataBoundControl.PerformSelect()
   at System.Web.UI.WebControls.BaseDataBoundControl.DataBind()
   at System.Web.UI.WebControls.GridView.DataBind()
   at System.Web.UI.WebControls.BaseDataBoundControl.EnsureDataBound()
   at System.Web.UI.WebControls.CompositeDataBoundControl.CreateChildControls()
   at System.Web.UI.Control.EnsureChildControls()
   at System.Web.UI.Control.PreRenderRecursiveInternal()
   at System.Web.UI.Control.PreRenderRecursiveInternal()
   at System.Web.UI.Control.PreRenderRecursiveInternal()
   at System.Web.UI.Control.PreRenderRecursiveInternal()
   at System.Web.UI.Control.PreRenderRecursiveInternal()
   at System.Web.UI.Page.ProcessRequestMain(Boolean includeStagesBeforeAsyncPoint, Boolean includeStagesAfterAsyncPoint)
Custom event details:

I then decided to check the stored procedures.  Then it dawned on me that one of the stored procedures used EXEC sp_executesql, which requires the database user to have, in my case, SELECT permissions on the actual table itself.

Once I granted these permissions to the database user, the web form loaded correctly.

ASP.NET Content Disposition Problem in IE7

I've just spent quite a while debugging a problem with content disposition I was having with Internet Explorer 7, the code works fine in Firefox but causes this error message to occur in IE7.

"Internet Explorer cannot download xxx from xxx."

"Internet Explorer was not able to open this Internet site.  The requested site is either unavailable or cannot be found.  Please try again later."

content-disposition-error

This was my original snippet of C# code:

Response.Buffer = true;
Response.ClearContent();
Response.ClearHeaders();
Response.ContentType = docToDisplay.Type.ContentType.ToString();
Response.AddHeader("Content-Disposition", "attachment;filename=" + Server.UrlEncode(docToDisplay.FileName));
Response.Cache.SetCacheability(HttpCacheability.NoCache);

Response.BinaryWrite(docToDisplay.FileContent);
Response.End();
Response.Flush();
Response.Close();

Response.Cache.SetCacheability

I eventually figured out that the following line on code was causing the issue.

Response.Cache.SetCacheability(HttpCacheability.NoCache);

I then did a quick search for "Response.Cache.SetCacheability(HttpCacheability.NoCache);" and discovered another developer who have had the same Content-Disposition issue.  Unfortunately for me that page didn't get returned when I was searching for the Internet Explorer error message.

This was the response to the post by Microsoft Online Support:

"Yes, the exporting code you provided is standard one and after some further
testing, I think the problem is just caused by the httpheader set by
Response.Cache.SetCacheability(HttpCacheability.No Cache)
I just captured the http messages when setting and not setting the above
"NOCache" option and found that when the http response returned the
Cache-Control: no-cache
header. So we can also reproduce the problem when using the following code:
page_load...
{
Response.CacheControl = "no-cache";
ExportDataGrid(dgSheet,"test.xls");
}
IMO, this should be the clientside browser's behavior against "no-cache"
response with stream content other than the original text/html content. So
would you try avoid setting the CacheAbility or the "Cache-Control" header
to "no-cache" when you'd like to output custom binary file stream?
Thanks,
Steven Cheng
Microsoft Online Support"

After removing the Response.Cache.SetCacheability line the file downloads correctly in Internet Explorer.

Authenticate with MailEnable SMTP using ASP.NET 2.0

I've recently been trying to send emails using ASP.NET 2.0 on a web server which uses MailEnable. MailEnable had relaying locked down to avoid opening the server up to spammers, but I wasn't able to authenticate with MailEnable to relay emails to external domains.

I tested my code was working by temporarily checking the "Allow relay for local sender addresses" checkbox in the SMTP properties on MailEnable and my email was relayed successfully. However as soon as I uncheck this option I get this error message in the SMTP W3C logs:

503+This+mail+server+requires+authentication+when+attempting+to+send+to+a+non-local+e-mail+address.+Please+check+your+mail+client+settings+or+contact+your+administrator+to+verify+that+the+domain+or+address+is+defined+for+this+server.

I eventually got it working. I changed the authentication type from "MailEnable integrated authentication" to "Authenticate against the following username/password." then I supplied a username and password to MailEnable.
After restarting the SMTP service in MailEnable. I was able to relay emails using the following C# ASP.NET 2.0 code snippet...


using System.Net.Mail;

MailAddress source = new MailAddress("admin@localdomain.com", "Server");
MailAddress recipient = new MailAddress("external@mail.com", "External");

MailMessage enquiryMail = new MailMessage(source, recipient);
enquiryMail.Subject = "Test";
enquiryMail.Body = "Test content";
enquiryMail.IsBodyHtml = true;

SmtpClient smtpServer = new SmtpClient("mail.localdomain.com");
smtpServer.Credentials = new NetworkCredential("username", "password", "localdomain.com");
smtpServer.Send(enquiryMail);

Apache Web Development Testing Server Set-up

I've been setting up an Ubuntu linux machine for web development testing on my local network, but because the machine has only one IP address assigned to it I wanted a solution to be able to serve more than one website without changing the config in Apache each time.

One method would be to use a separate folder for each site but .htaccess rewrites don't work properly using this method and if you write hyperlinks that refer to the root of the site (i.e /contact.php), this can cause issues too.

Anyway, I thought of using different port numbers to distinguish the different testing websites. So one site maybe on 192.168.0.1:2000, another on 192.168.0.1:2001 etc...

You set this up in Ubuntu as follows:

Open a Terminal prompt and type:

sudo gedit /etc/apache2/ports.conf

Enter your password and then for each port number you require add a Listen statement on a new line. So your file should look like:

Listen 80
Listen 2000
Listen 2001

<ifmodule>
Listen 443
</ifmodule>

Save the file and then go back to the Terminal and type:

sudo gedit /etc/apache2/sites-available/default

In this file you should find a <virtualhost *> tag followed by various commands. You need to copy and paste everything from <virtualhost *> to </virtualhost> onto a new line below.
Then rename the first <virtualhost *> to <virtualhost 192.168.0.1:80> where 192.168.0.1 is the IP address of you machine. Rename the second virtual host to <virtualhost 192.168.0.1:2000> and repeat for as many websites you want to set-up.

Then for each Virtual Host you'll need to change the DocumentRoot to the file path to each website on the local machine.

Once this is done you'll need to restart Apache to see if your changes have been successful. To do this type the following into the Terminal:

sudo /etc/init.d/apache2 restart

Internet World - eBusiness Legal Tips

It's been a couple of weeks since I attended Internet World at London's Earl Court and the follow-up emails have started to arrive in my inbox where I exchanged business cards with some of the exhibitors.
The show ran for three days, but I only managed to attend on the last day (1st May 2008).

During the exhibition, as well as general networking, I attended several presentations about marketing, social media, search and e-commerce.
One particular presentation by Nigel Miller of Fox Williams LLP was about legal tips for safe selling online.
This topic will bore many developers, entrepreneurs and start-ups because they don't understand or see the importance in legal issues and just want to get their idea/business or product live on the web.
Having seen the potential problems of ignoring legislation first hand, I was particularly interested in what Nigel had to say.

I'm one of those people who tends to read the odd terms and conditions page or End User License Agreement (EULA) and find that the language these documents are written in doesn't make for easy reading or understanding, so I was pleased that this presentation used simple plain English.

The presentation was not an exhaustive list of the all legal rules and regulations a website needs to comply with, but it highlighted the areas that are frequently misunderstood or ignored completely, it focused mainly on UK rules and regulations, such as:

  • Sector specific compliance
  • Web Accessibility compliance
  • Company information which must be on the website
  • Intellectual property and ownership
  • The Data Protection Act (complying with)
  • Terms and conditions and disclaimers
  • Pricing errors
  • Distance selling regulations and consumer rights

Nigel's full presentation entitled "Risky business; legal tips for safe selling online" can be downloaded as a PDF from Fox Williams' ebizlawTM website.

Nigel Miller is a partner at Fox Williams LLP.

Time to start testing your websites in Safari on Windows?

Apple recently added their Safari web browser to the Apple Software Update and pre-checked the box by default. This effectively means that a lot of Windows users will now, possibly without knowing it, have installed Safari.
I'm not going to discuss the ethics of this practice here, instead read John's Blog - CEO of Mozilla.

But what it means for the humble web designer or developer is that we should really be installing Safari on our Windows machines and adding it to the list of browsers we test our sites against as the number of users is bound to increase as a consequence.

Apple pushed Safari web browser through their Apple Updates service

Competition in the browser business is good and over the last few years Firefox has begun to gain ground on Microsoft's Internet Explorer domination. It has also forced the browsers to become more standards compliant, thereby helping web developers and designers design cross-browser, cross-platform web pages.

According to Apple, Safari is a standards compliant browser built on the open source WebKit project, so hopefully if your pages have been built to W3C standards they will require minimal checking, but it is always wise to test. Apple have a range of web developer resources for the Safari browser, including the Safari CSS support, Safari developer FAQ, and a general web development best practices guide.

Product Review: Train Signal's IIS Web Servers CBT Video Training

As an ASP.NET web developer, I think it's important to understand and know how to configure Microsoft's web server, Internet Information Services (IIS). Depending on the organisation you work for you may or may not get the opportunity to tinker with IIS, but this shouldn't stop you from learning the basics.

You could go out and buy a book on configuring IIS and then install IIS on your computer to practise what you've read, but thanks to the guys at Trainsignal.com who have kindly sent me some of their training videos, I've discovered a much easier way of learning.

Train Signal CD-ROM

Train Signal provides video training courses for Microsoft, Cisco and CompTIA certifications, including CCNA, A+, Network+.
I'll also be reviewing the Cisco CCNA training videos here soon.

Train Signal's IIS Web Server video training covers both IIS 5 and IIS6, and features topics including installing IIS, creating test websites, hosting more than one website using host headers, adding security, setting up an FTP server, and web server optimisation.

Train Signal CD-ROM menu

The course is taught by Scott Skinger, President and founder of Train Signal. Scott has many years of experience in the IT field, holds various IT certifications and is a competent instructor. The videos are easy to follow and Scott's narration is second to none.

Train Signal lab book sample

The series of videos are backed up with a written guide in the form of the lab book, which comes as a printable PDF on the CD ROM, this goes through the same steps featured in the videos and includes network diagrams like the one above to help you set-up your own lab.

Train Signal video player

If you want to get up to speed on a particular Microsoft product, obtain an IT certification or you don't like reading IT text books then I definitely recommend you give these training videos a try.

Course Contents in full:

Introduction
Lab Setup
Setting up the lab
Computer 1
Computer 2
Computer 3
Lab
Scenario
Installing IIS on Windows 2000 Server
Creating an HTML file
Hosting Ben & Brady's site
Configure DNS so Internet users can find your website
Testing the website from the client
Lab
Scenario
Creating a test website using an HTML file
Creating an additional website on the web server
Creating host headers
Configuring DNS for the second website
Test and view website from client
Assigning site operators
Adding security to a website
Test and view the website from a client
Lab
Scenario
Downloading and installing service packs and hot fixes
Setting NTFS permissions
Disabling Netbios over TCP/IP
Download and run The IIS lockdown tool from Microsoft
Enable and view logging

Wingdings and Webdings Character Reference

Here's a useful reference to Wingdings and Webdings character sets. I find these characters are sometimes useful in design, especially using a tool such as Adobe Fireworks.

Use them as starting points for creating icons. The trick is to use the "Convert to paths" option in the "Text" menu of Fireworks, this converts the font character to a vector image which you can tweak to you're hearts content.

Use this chart as a quick reference to get the image you're after.

Webding and Wingdings caharacters