Re: Refactoring webcode to use templates

G'day Bod,

[Note: Your question is very generic, which is fine. Accordingly, my suggestions are also generic: you'll need to adapt these to your requirements.]

"... written entirely in Perl ... HTML, CSS, JavaScript, etc hard coded along with the functional logic."

Before doing anything else, you should separate all of these concerns. There should be no "HTML, CSS, JavaScript, etc" in your Perl code. You probably want: (templated) HTML in *.tt; CSS in *.css; JavaScript in *.js; and so on.

As with any sort of strict rule, there will be exceptions; for instance, you may need to toggle a CSS display property in JavaScript to handle a "show/hide" function.

Here's a few general pointers:

Start a new project. Copy parts of existing code where necessary but don't try to modify the current application on the fly.
Make decisions regarding software versions at the outset. Consider what's available to all end-users.
Don't try to retrofit partial changes into existing code.
Hard-code as little as possible: templates can reference other templates.
Avoid anything that may require subsequent changes to core code: prefer config changes.
Give careful consideration to specific and generic elements; e.g. id and class HTML attributes which may be referenced by CSS and/or JavaScript.
Test extensively. This pays obvious dividends up front. It's also the gift that keeps giving (as you'll find out when an apparently innocuous change to one thing completely breaks something else that appeared to be quite unrelated).
Be patient. Avoid the urge to deploy early. Eagerness to show off your new creation is perfectly understandable; just make sure you're ready and avoid egg-on-face syndrome.

Your template would look something like this:

<html>
    <head>
        <title>[% title %]</title>
        <link ... [% base_url %]/css/[% css %] ...
        <script ... [% base_url %]/js/[% js %] ...
    </head>
    <body>
        [% header %]
        [% page_specific %]
        [% footer %]
    </body>
</html>
[download]

"What are the hidden pitfalls that could trip me up and suck up vast amounts of time?"

Following my pointers above should mostly avoid these; I wrote them with this question in the back of my mind.

In my (not inconsiderable) experience, one of the biggest pitfalls in any software project is: "I'll just leave that for now and fix it later."; which is often followed by the famous last words: "That should be quick and easy to do.". If it is indeed quick and easy, do it now; however, that often turns out not to be the case and shortcomings, or even bugs, plague many subsequent production versions. Get it right once, then spend your subsequent time on things vastly more interesting than tracking down bugs or trying to refactor your refactorings to get what you wanted in the first place.

In closing, this sounds like an interesting project and I wish you good luck with it.

— Ken

Comment on Re: Refactoring webcode to use templates Select or Download Code

Replies are listed 'Best First'.
Re^2: Refactoring webcode to use templates by Bod (Parson) on Feb 01, 2021 at 23:20 UTC
Start a new project Thanks Ken, That is probably the key I was after without knowing it when I asked the question... My guess is that starting a new project and taking the great advice already given, I will have a far better idea of the real problems I am facing. A couple of days ago, the idea of refactoring a working website looked like such a mammoth task that I had no idea where to start. Now, I at least have a starting point.	[reply]

Replies are listed 'Best First'.

Re^2: Refactoring webcode to use templates
by Bod (Parson) on Feb 01, 2021 at 23:20 UTC

Start a new project

Thanks Ken,

That is probably the key I was after without knowing it when I asked the question...
My guess is that starting a new project and taking the great advice already given, I will have a far better idea of the real problems I am facing.

A couple of days ago, the idea of refactoring a working website looked like such a mammoth task that I had no idea where to start. Now, I at least have a starting point.

[reply]