Cincom VisualWorks Web Toolkit Tutorial : Web Development Overview

Application Overview

Because the Web Toolkit supports both the ASP and J2EE models, the application you are going to develop in this tutorial will use concepts from both. To avoid any confusion, the application will be developed separately using both models instead interspersing the two methodologies into a single solution. This way, you can decide which methodologies you prefer using and which would work best in your development environment.

This lesson describes the small application that you are going to build in this tutorial. It also identifies the code development strategy used throughout this tutorial.

Figure 1. A typical web development team

Above is a somewhat simplified diagram of the different roles people play in the development of a web site. Those team members include the following people:

Web Architect – designs the site and creates a site map; decides on the technology used for the site
Web Developer – creates the structure of the web site, components or objects used to to help ease the creation of dynamic web pages
HTML Author – creates the layout of the pages on the site
Graphic Designer – creates images and graphics for the site

During this tutorial, you will experience 3 of these roles: Architect, Developer and HTML Author (our apologies to the graphic designer but in all honesty, that is a separate discipline altogether and has no place in this tutorial). At times, the roles will blur and will not seem very “clear cut”.

Web Developer will do HTML Authoring
HTML Author will do web development

The goal of web development is to allow these roles to co-exist. Because you will experience 3 of these roles during this tutorial, it will be easy for you to decide what roles you and others within your organization will play when it comes time to develop your own sites.

Figure 2. The Login Screen to the TEACH system

Toyz Inc. is a fictitious toy company. Management wants to keep track of what continuing education courses their employees have taken. They have named their application TEACH which stands for Toyz Inc. Employee Accreditation and Course History. Above is their login page.

Figure 3. The HTML Layout of the the TEACH system pages

The HTML Author has created for us a template page that defines 3 major areas of a web page.

The Header Area – this contains the Toyz Inc logo and the title of the TEACH system. The HTML author wants this displayed on every page of the application.
The Navigation or Links Area - this contains hyperlinks to other pages within the TEACH system and will vary depending on who has signed into the TEACH system
The Main Content Area - this content will vary depending on what page you are on.

The Web architect has created the following site map for us (below).

Figure 4. The Site Map for TEACH system

Not all of the pages will be available to all employees. For example, only managers will be allowed to add courses, employees and XREFS (courses that employees have taken). All employees will be allowed to see what courses they have taken.

Figure 5. The database/files used for the application

We will design this application so that data access is totally insulated from the business logic. The site will use ASCII flat files so that anyone can use their development platform of choice without worrying about database connectivity issues (I.e. which database to use).

Figure 6. The data for the application

Above are the 3 text files used for the application. In later units, when you are writing code to retrieve this data, here are a few things to keep in mind to help you quickly decide if your code is working properly.

There are 3 employees and their employee numbers are six ones, six twos and six threes.
Employee 111111 has a security level of 1.
Employee 222222 has a security level of 2.
Employee 333333 has a security level of 3.
Employee 111111 has taken 1 course.
Employee 222222 has taken 2 courses.
Employee 333333 has taken 3 courses.
SVW101, Introduction to Smalltalk (VisualWorks), has been taken by 1 person.
MVB102, Advanced Visual Basic, has been taken by 2 persons.
JAV103, Web Development to Java, has been taken by 3 persons.

Figure 7. Where’s My Code?

When using the Web Toolkit to develop this web application, logic and data presentation can and will reside in multiple locations. In terms of team members:

The Web Developer will say “There’s HTML in my Smalltalk code”
The HTML Author will say “There’s Smalltalk code in my HTML”

There will be a separate lesson on this topic later in the tutorial so you can experience this for yourself firsthand. Understand that developing applications for the web is a little different than developing standalone GUI applications. Your code will reside in multiple locations (not just in the Smalltalk image) so you might as well get used to it.

Web Development Methodology

This tutorial will start developing the site using the ASP model. The ASP model is simpler than the J2EE model and this is how we want to start. It is easy to get the code working correctly using the ASP model and some of the concepts will carry over into the J2EE model. Once the we get the site working, we will start to add more complexity to it which will expose more advanced coding techniques.

We will then re-write the application using the J2EE model. This model lends itself better to team development and more reusable code; however, the concepts are more advanced than its ASP counterparts.

Summary

	Roles in a team development environment have been identified
	A typical web development team consists of an architect, a designer, an HTML author and a graphics designer.
	A site map and a template page have been created for you
	The files (and their contents) used for this application have been identified
	Application logic and the presentation of data will reside in multiple locations
	The site will developed first using the ASP model
	The site will eventually be re-written using the J2EE model
	The ASP model is easier to learn than the J2EE model
	The J2EE model has more advanced capabilities than the ASP model and lends itself better to a team development environment