asked on

coding faster - easier maintenance

Hey Web Gods,

How do I code faster and make my code easier to maintain? I need your tips and
ideas. I've been building dynamic websites for awhile now. But as they get more
complex, I find I'm spending too much time on maintenance. I have to do more with
less.

Currently, I use html kit to develop my asp/access or sql websites.

thanks

bruno

If you are still using table based layouts, stop. Use semantic code and CSS for presentation.

bruno

rdivilbiss

Completely separate HTML, CSS, JavaScript and Server Side code.

Learn how to create simple reusable objects in JavaScript and ServerSide code.

Don't cut and paste examples from code libraries into your code unless you truly understand the code and have verified it has proper error handling and security.

Don't start a web design until you have a model of the site and its functions.

Believe it or not the following page is very complex in functionality, but as you can see all the page parts are separated into reusable and easy to maintain parts. This is a login page which has subscription, e-mail a friend, add to bookmarks, registration, member account management, advertisments, etc. etc.

If the owner want's a style change, I only have to work on the css files.
If there is a bug in the authentication routine, ot the database changes, I only have to look at the asp page.
It the privacy policy changes, I make a change in one places and several hundred pages all reflect the change.
Almost every page in the entire site has the same structure.

<% Option Explicit %>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>

<head>
<title>snip</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<meta http-equiv="expires" content="now-1">
<meta http-equiv="pragma" content="no-cache">
<meta name="author" content="Roderick Divilbiss">
<meta name="copyright" content="© 2005 Roderick Divilbiss">
<meta name="description" content="snip....">
<meta name="keywords" content="snip...">
<meta name=robots content="index,follow">
<link rel="shortcut icon" href="../../favicon2.ico" type="image/x-icon">
<link rel="stylesheet" type="text/css" href="../../include/css/all.css">
<link rel="stylesheet" type="text/css" href="../../include/css/code.css">
<script language="javascript" type="text/javascript" src="content/page_2.js"></script>
</head>

</head>
<body>
<div id="topmenu"></div>
<div id="banner"></div>
<div id="mainmenu"></div>
<div id="middle">
<div id="content"></div>
<div id="nav"></div>
<div id="right"></div>
<div id="bottomMenu"></div>
<div id="copyright"></div>
</div>

</body>
</html>

rdivilbiss

On your server side code, you should also use good documentations and code libraries:

<% option explicit %>
<%
Dim page_version
page_version = "0.01 delta 02-07-2005 08:30 AM"
'***********************************************************************************
' PURPOSE            :
' ON ENTRY            :
' ON EXIT             :
' DEPENDENCIES :
' ASSUMPTIONS        :
' ERROR CHECK        :
' CALLED BY        :
' AUTHOR            : Rod Divilbiss
' LAST MOD        : 03-24-2004
' BY                    : RD
' CHANGES        : most recent first
'                         02-24-2004 RD original ASP
' STATUS : Development
'****************************************************************************************

'**********************************************************
'* This const declaration must proceed thisPageClass.asp
'**********************************************************
' const secureCertificateServerName = "" ' N/A

%>

<%
'**********************************************************
'* On form pages or pages which should expire add the
'* following to the header of the page.
'**********************************************************
response.addheader "Cache-Control", "no-store"
response.addheader "Cache-Control", "no-cache"
response.addheader "Cache-Control", "private"
response.addheader "Cache-Control", "max-age=0, must-revalidate"
response.addheader "Expires", Now-1
response.addHeader "Pragma", "no-cache"

'**********************************************************
'* Now we can call our server side includes
'* Best to put in aplha order unless there are dependencies
'* that require another order
'**********************************************************
%>
  
 
 
 
 
 
 
<%

'**********************************************************
'* PAGE VARIABLE DECLARATIONS
'* Best to put in aplha order unless there are dependencies
'* that require another order. Also, one Dim per line
'* allows useful comments to the right of the declarations.
'**********************************************************

Dim debug            ' The debug object
Dim production        ' Is this page in production? Controls messages returned to the browser on errors, etc.

'**********************************************************
'* PAGE INITIALIZATION
'* Best to put in aplha order unless there are dependencies
'* that require another order.
'*
'* The debug object would naturally be first.
'* Error checking to insure objects are created properly
'* and that all classes were included should occur.
'**********************************************************

production = false

on error resume next
Set debug = new clsDebug
debug.enabled = true

if err then
      '****************************************
      '* Notify developer if not production
      '****************************************
      if NOT production then
            response.write "ERROR: Unable to initialize the debug object. Check for SSI:<br>" & vbLF
            response.write server.HTMLencode("") & "<br>" & vbLF
            response.write "DETAILS: " & err.number & " " & err.description & " " & err.source
            response.end
      end if
else
      debug.enabled = true
      ' debug.notify = "scriptError@cmcmortgage.com"
      debug.subject = "Purchase Order Debug Information"
end if

seb_gibbs

I personally keep each page very very minimal and let all the include functions do the work.

This is madeup, but to give an idea...


output-headers(title,description,heading,indexit,secured)
output-template("stnd")
output-displaybox("my heading","html text")

denam

ASKER

How about tools? I'd love to have Dreamweaver MX but right now can't afford it. Do any of you use
freeware or other tools to handle, for example, writing css?

rdivilbiss

There are many freeware development programs.

I generally work strictly in the code, so anything with color coded markup and intelligent completion for the languages I use is a boon. I work against a local web server and can open pages in a real browser if I need to look at the layout. WYSIWYG editors will force choices you may not want, and often suffer from outdated code constructs.

FrontPage, DreamWeaver, ColdFusion, are just ways to hide what's going on, bloat your code, and make maintenance more difficult.

ASPEdit
PSPad
and
FirstPage 2000

are pretty popular. PSPad probably has the bigger market share.

rdivilbiss

I've never found anything I like for CSS other than the text editor, it's self.

bruno

TopStyle Lite for CSS is a good one...

http://www.bradsoft.com/download/index.asp

rdivilbiss

Can't be better than Notepad, LOL

bruno

SUUUURRREE.....ya....cause Notepad is GREAT..... lol

denam

ASKER

Great info you all.

Separating HTML, CSS, JavaScript and Server Side code makes total sense.

One thing I spend a lot of time doing is writing out dim statements and asp code. I've got some
sites (they always want them yesterday and then tommorrow they want them tweaked a little)
that have tons of variables input by forms, and then processed in some way.

Several are on access. So I end up writing page after page of queries and vbscript and asp.
My understanding is that something like dreamweaver writes this for you. I've certainly resisted.
I hate FrontPage ;o) But I've seen developers produce this stuff quicker using DW.

I hope I'm not dragging this on. I know it's only 50 points. But I figure it's a chance to get a good discussion
on this. I'm sure there are others out there who'll benefit.

Dena

rdivilbiss

DreamWeaver, FrontPage and ColdFusion will all "write" code for you but it will be bloated, hard to maintain, goop.

Put your database access code in an include file and use it over and over. When it is right it is right. If it is wrong, you only have one file to fix, rather than multiple pages.

If you are dimensioning lots of variables to match what the form posted, you can probably eliminate that effort except for form fields that you actually need have to perform calculations or manipulations. If you are only submitting it to the database, you can substitue a finction that retrieves the field, cleanses it for XSS scripting and SQL injection and puts it directly into you database command, rather than putting it in a local variable and putting that variable's value into the database connection.

I'll post an example later as I'm not feeling well, (no I have not been celebrating St. Patrick's day - but if I feeel better I might).

ASKER CERTIFIED SOLUTION

rdivilbiss

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

rdivilbiss

Thank You!!!

I'm glad I could help.

denam

ASKER

You're welcome. It is good advice. I'm trying to turn anything I do multiple times into a function or subroutine.
Much easier to deal with.

denam

ASKER

This is the best developer advice I've ever gotten. It's taken some time to fully appreciate just how good. I'm wondering if you can recommend any websites, books or articles that go into more depth on this topic. For example, ways to separate html, css and server side code (form from content from function?). When I asked the question I was using asp. Since then, I've started learning asp.net. I am told this is easier to do in .net. But haven't gotten far enough to know first hand.

And thanks again for the yoda-like advice.

rdivilbiss

WOW! I wish I could force a few people to subscribe to this question, LOL. Thank you very much.

I can really recommend any books on web design, not because they don't exist, just because I've been doing this so long I've absorbed the information incrementally from other sources. However, closely related and highly recommended is Writing Secure Code 2 by Microsoft Press and I have pre-ordered The 19 Deadly Sins of Software Security. Designing with security in mind not only makes you a better developer but also reinforces the importance of keeping code, markup and style separate.

There are a number of experts here that are worth searching their answer history (click their username, and read their question history.) A very good leaning experience.

COBOLdinosaur is the guru of HTML and standards compliant development. seanpowell, Batalf, mplungjan, fritz_the_blank, and GrandSchtroumpf are some good ones to read. Check their profiles for personal web sites.

Some recent favorite web sites relating to design (and follow their links to other sites) are:

http://www.csszengarden.com/
http://www.quirksmode.org/
http://www.opera.com/products/mobile/dev/ <-- three really good articles on CSS layout
http://www.rodsdot.com/ee/default.asp (LOL)
http://validator.w3.org/
http://www.w3.org/QA/