Fremus.co.za

Demistifying Life and Web Development

Archive for May, 2008

Breadcrumb navigation

So I have this peculiar solution that I want to develop using PHP and MySQL, and since I do not have ASP.NET running on this hosting package PHP and MySQL are the obvious options at this stage. The first step in creating a solution is to define it. You define a solution by describing what it is you want to achieve, and in so-doing determine all the variables and objects that might exist within your solution. Once you have described the solution you can start analysing it and start breaking it down into small usable pieces. I follow a practice whereby I develop small pieces of code at a time and test them as I go along (with your desired goal in mind).

I want to develop a breadcrumb navigation system for my website. That is the solution I want. How do I go about defining it? What is the purpose behind building a breadcrumb navigation system?

  • Share/Bookmark
Tags: ,
posted by fr3dr1k in Web Development,Web Technologies and have No Comments

Forums

As a part of the whole Web 2.0 movement forums have proved invaluable, because they allow lots of users to collectively create and share content. Forums differ from blogs and wiki’s, and this is one of the main differences between all three solutions, is the way the information is displayed and handled. Forums use a post-and-reply method. This means that a registered user creates a topic on a forum and writes some content around that topic and then other registered users can comment on that topic. Only registered users can comment on topics, as opposed to blogs and wiki’s which can allow open access to any user.

I read an article recently that listed 8 Popular Open Source Forums, and from the list so far I tested PHPBB on one site and found it to be easy to install. I did find that the Afrikaans language pack was not updated or even available, which is a little disappointing. I then also tried a plugin for WordPress but found the display a little cluttered, and it just felt a little odd to have a forum inside a blog. Next in line is Vanilla, which amazingly is only 386kb when compared to the 2.16Mb of PHPBB. Vanilla took me 5 minutes to install and it is really a very lightweight forum script. You can go take a look here. I cannot run and test YetAnotherForum at this stage because it uses ASP.NET 2.0, but it really looks a bit like Invision’s forum.

  • Share/Bookmark
posted by fr3dr1k in Web 2.0,Web Technologies and have No Comments

Wiki’s vs Blogs

Wiki’s and Blogs are two popular means by which people can create, share and collaborate on the world wide web. Creative collaboration is a term that can be used synonymously with Web 2.0, because at the heart of Web 2.0 is the creating and sharing of content between large numbers of users. That being said I have tried understanding in my own way what the difference is between a blog and a wiki, and I really want to use my own experience of the two to try and separate them as two different pieces of technology with potentially different uses and applications.

Blogs

A blog, in my view, is a website that uses a content management system that allows a user to create and publish narrative content that is intended for a large audience. The narrative ‘pieces’ are published in a journal-style way, with each published narrative ‘piece’ being listed on the website in a chronological fashion. A website that functions as a blog generally allows visitors to leave comments on each narrative piece. This website is an example of a blog.

Wiki’s

A wiki, in my opinion, is a website that uses a content management system that allows multiple users to create and collaborate content. I personally use a Wiki to document ideas and concepts for websites and share the content with users in my development team. I then let them add their ideas to the existing content and in so-doing build an effective document to work from. A wiki also allows users to search for topics and if they cannot find an item or topic it allows them to create the content. This is slightly different from the way a blog works.

  • Share/Bookmark
Tags:
posted by fr3dr1k in Web 2.0,Web Technologies and have No Comments

Captcha’s and things, life around ASP.NET, and Web 2.0

So what are captcha’s? What’s the purpose of a captcha’s? Captcha’s are those little images that contain a combination of phrases, letters and/or digits. They are used on comment and contact forms on the web to prevent spambots from submitting spam comments. They work because they require human input and someone with eyes that can read the characters on the image. A spambot will not be able to see the image.

I do most of my web development with ASP.NET (C#) because its the environment I find myself in at work and admittedly its an easier environment to develop in than say a Linux or BSD environment. Ease of use in this instance might have a price in terms of hardcore performance but it has a pay-off when it comes to development speed. The server controls that come shipped standard Visual Studio 2005 make it quite easy to have a basic website with basic data controls up and running in a few minutes. The server controls take care of all the processing for you, and all you have to do to use them is drag them onto a form, set a few attributes and voila. Even Visual Web Developer (free download) comes packed with all the tools to get a small data-driven website up and running in no time.

Web 2.0 is a marketer’s catch phrase, I am sure of this. Marketing people might be inclined to use any catch phrase to promote a service or product, if it can draw the customer’s attention. Realistically though they have to realise that Web 2.0 is just a catch phrase, nothing more, in my honest opinion. The technologies that drive Web 2.0 are not so new that they have been re-invented. Social networking forms a part of the whole Web 2.0 theme of which Facebook and MySpace are popular examples. Both of these Social Networking platforms offer an API (Application User Interface) which allow developers to tap into the resources provided by each. The only reason people would want to tap into such a resource is because of the database of users that use that particular network, no other reason. If I developed a Social Networking website and I developed an API for that website and my website had 30 users as opposed to the millions of users that Facebook has, then its obvious to guess where someone might want to invest their time.

  • Share/Bookmark
posted by fr3dr1k in Web Development,Web Technologies and have No Comments

What is AJAX? Part2

This article and its contents are based on the articles on the W3C Website, and is a great place to start learning.

AJAX uses the XMLHTTPRequest JavaScript object to communicate directly with the web server and has three important properties:

  • the onreadystatechange property
  • the readystate property
  • the responsetext property

It’s important to note that the XMLHTTPRequest object is not supported by Internet Explorer which uses an ActiveX object, and for that reason when you create an XMLHTTPObject in JavaScript you have to add a few try/catch statements so that it returns the correct object for the correct browser.

If you want to use AJAX on a webpage it is thus important to understand that you need an XMLHTTPRequest object to make it possible. JavaScript is used to create the XMLHTTPRequest object and looks like this:

function GetXMLHTTPObject()
{
     var xmlHttp = null;
     try
     {
          xmlHTTP = new XMLHttpRequest();
      }
      catch(e)
      {
          try
          {
              xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
          }
          catch(e)
          {
              xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
          }
      }
     return xmlHttp;
}
  • Share/Bookmark
posted by fr3dr1k in AJAX,Web Development,Web Technologies and have No Comments

What is AJAX? Part1

I downloaded the LiveValidation script recently and I realised after implementing it on a webpage I did not understand how it interacts with a PHP or ASP.NET application and it got me thinking that maybe I need to just try and understand how server-side and client-side code interacts with JavaScript.

What is AJAX? I know it’s an acronym for Asynchronous JavaScript and XML, but what does it really mean and how does it work. Client- and Server-side scripting is easy to understand on their own and its easy to understand how both technologies are used, but where it becomes tricky for myself is when the server-side and client-side code need to interact with each other. Developing web applications with ASP.NET does not always expose a developer to the inner workings of that specific technology. AJAX is not unique to PHP or ASP.NET. Both ASP.NET and PHP are server side scripting languages. The first thing to understand is that AJAX is not a technology on its own, nor is it something that has not been there before, because it uses existing technologies (JavaScript, XML) to do what it does. AJAX uses a combination of programming tools to create web-based applications that react more like software applications – this means that the web-based application responds much smoother and nicer and the page does not reload to retrieve new content.

I still have not defined what AJAX looks like or what it exactly does. AJAX is based on open standards such as HTML, CSS, XML and JavaScript. AJAX uses XML and HTTP Requests to communicate with a web server. Another important thing to note is that with AJAX web applications do not re-submit a web page every time a user makes a request. If for example a user enters data on a form and submits the information to a web server, the web server will traditionally create a new page after the submit has occurred, but AJAX communicates with the web server in such a way that updates to the page only happen to the sections of the page that are affected.

  • Share/Bookmark
posted by fr3dr1k in AJAX,Web Development,Web Technologies and have No Comments

Managed Content vs Custom Content

How do you decide when to use a Content Management System (CMS) and when to develop the content yourself? The answer lies in your marketing strategy and specifically your strategy for web-based content. Do you know who the intended target audience for your strategy is?

In some cases it might prove a better bet to develop content from scratch, such as a brochure-ware type of website. Brochure-ware websites generally have a very static nature and are used to market a product or service in a very visual way. Such websites often use technologies such as Adobe Flash to promote that product or service. Adobe Flash can accomplish animations and effects that cannot be replicated with AJAX or any standard web development technologies. Flash has a few limitations as well, but for impact Flash can be used very effectively. Microsoft also recently released their Silverlight technology, but it might take some time for Silverlight to be adopted as widely as Flash. Both technologies, however, incur some cost because their development environments are not free or inexpensive. Adobe Flash requires an Integrated Development Environment as does Silverlight. For Adobe Flash you may require one of the CS3 range of software packages that include Flash and for Silverlight you might want to look at buying Visual Studio 2008. Both products also tend to force you into using other proprietary software as well which also costs money. Developing Silverlight applications require Windows Server software to run those applications, which costs more money as well.

  • Share/Bookmark
posted by fr3dr1k in Web Development,Web Technologies and have No Comments

AJAX form validation – LiveValidation

Here’s the thing right, I really want to create a nice contact form for my website, but I also want to make sure that the form accepts the right type of information. For this I need some JavaScript and of late I have been reading a lot about JavaScript libraries such as jquery, mootools and prototype. I have also worked a bit with ASP.NET Ajax, but I do find the .NET implementation does hide a lot of the inner workings of the JavaScript and does not force you to understand the core references as some of the other JavaScript libraries do. With .NET you can get some AJAX running without touching much JavaScript code at all.

So the contact form on my website should allow visitors to send an email with their name, email address and a message. All three fields are required and should not contain empty values. The validation will be done server side, so that the user can see what they are doing wrong immediately and take any necessary steps to correct the information they entered.

One thing that has been bugging me recently has been to find an easy way to validate forms, and I came across LiveValidation. It’s pretty easy to setup and use, and I will be using it to create the form described above.

I also downloaded Amaya, an free XHTML editor, since I am extremely keen on sticking to Web Standards and all.

The basic structure for the form can be seen here. The form requires all three fields and validates the email address field, and if the email address field is found to be valid a alert message box appears on the screen. The underlying JavaScript code is quite interesting to note:

var fld_name = new LiveValidation( 'fld_name', {onlyOnSubmit: true } );
fld_name.add(Validate.Presence);
var fld_email = new LiveValidation( 'fld_email', {onlyOnSubmit: true } );
fld_email.add(Validate.Email);
fld_email.add(Validate.Presence);
var fld_msg = new LiveValidation( 'fld_msg', {onlyOnSubmit: true } );
fld_msg.add(Validate.Presence);
var automaticOnSubmit = fld_email.form.onsubmit;
fld_email.form.onsubmit = function(){
    var valid = automaticOnSubmit();
    if(valid)alert('Thank you for submitting your message!');
    return false;
}
  • Share/Bookmark
posted by fr3dr1k in AJAX,Web Development,Web Technologies and have No Comments
Get Adobe Flash playerPlugin by wpburn.com wordpress themes