DEV Community

Cover image for Updating A 25-Year-Old Website
Mads Stoumann
Mads Stoumann

Posted on

Updating A 25-Year-Old Website

As frontend developers, we always want to use the latest and the greatest. A lot of the time however, the clients we work for, are dependent on old systems, that would cost a fortune to update. A couple of years ago, I had to work with the code of a 25-year-old website.


But first, a little flashback. Back in 1993, as a 20-year old geek, I was working for a comicbook-shop in Copenhagen, Denmark, called “Fantask”.

Fantask used a database called “Perfect Filer” to handle all customers, products and — most important — subscriptions. Customers could subscribe to all kinds of products: american comics, danish comics, books by specific authors or series etc.

Filer

Released in 1983, “Perfect Filer” was a CLI-based tool, and took up 261kB of HDD-space and a whopping 128kB of RAM! Needless to say, it was very complicated to use with vast amounts of data, and Fantask had a growing customer-base.

Because I had an interest in IT, and had done some “computer work” on Fantask's catalogues, they asked me to create a new, graphical UI for handling customers, products, subscriptions and much more.

Luckily for me, my best friend studied data science, and could help me with database-design and coding - as I knew next to nothing about either!

At that time, “SQL Server” was for OS/2 only, so we picked the brand new “Microsoft Access 1.0”-database, which also had support for VBA: Visual Basic for Applications.

With VBA you could — and still can — build:

  • A database application
  • Custom forms
  • Custom reports
  • Custom navigation

... and pack it like an app, with icon etc.

I cannot remember how many months it took to develop, but … they've been using it ever since! (more on that later)


A couple of years later, a thing called the World Wide Web was suddenly on everybody's lips, so I had to learn another kind of “programming”: HTML.

I created this beautiful website in september 1995:

Fantask First Website

Sorry for hurting your eyes, but that's how most websites looked back then!

In December 1996, Microsoft launched Active Server Pages (today called “Classic ASP”), allowing you to connect databases with websites.

Suddenly, we could connect the Access-database with the website and create an online shop. And, mind you, there were a lot of data:

  • More than 50.000 comics
  • More than 5.000 books
  • More than 5.000 games, figures, films etc.
  • More than 10.000 customers

Shortly thereafter, I left the company to start my own business.
And for the next 21 years, the site looked like this:

FantaskBefore

The search-experince was like … well, 1997, the layout was done with a <table>, and the look-and-feel was not winning any design-awards 😂


During these 21 years they'd asked a lot of companies to help them with a new website … but it was simply too expensive for a small comicbook-shop (20-25.000$+). And “out-of-the-box” shops simply didn't cater for such large amounts of products/data.

Then in 2018, Fantask was on the brink of bankruptcy — and reached out to me for help. They thought a flashy new website could help the store survive. I didn't have much spare-time, but promised to spend all my Sundays for one month to help them.

With a limited timeframe and no budget, I realized the cheapest solution would be to … well, continue using Classic ASP!

For reasons unknown, it's still supported by Microsoft (or = it still works), even though it was replaced by .Net in 2002, and the last stable release is more than 21 years old!

I installed the “Classic ASP Syntaxes and Snippets”-plugin for “VS Code”, traversed my old code (oh, the horror!) — and split it up into:

  • Modules
  • Services
  • Components

I added input sanitation, re-used database-connections, were careful not to overuse the session-objects, and applied some of the “best practices” of the past 20 years.

I added modern semantics, valid- and structures (schema.org) markup, Google Snippets, a mega-menu and a fetch()-based “auto-suggest”:

Mega Menu and Autosuggest

Then I applied all of the “Google Analytics Enhanced Ecommerce”-logic:

  • Product impressions
  • Detail-click
  • Detail-impressions
  • Add-to-basket transaction
  • Remove-from-basket transaction
  • Purchase transaction

… As well as “Google Merchant”- and “Facebook Business”-feeds.
I also removed all sensitive data from the Access-database, since I figured it's probably easier to hack than modern databases.


Recap

The project ended up taking 7 days (and not just the 4 Sundays I'd agreed to), and included:

  • Complete re-write of "backend" code, into: Modules, services and - components
  • Complete re-write of HTML (no <table>-based design!)
  • Complete re-write of CSS
  • Complete re-write of JS
  • Structured, semantic and valid markup
  • Google Search Snippet
  • Google Enhanced Ecommerce integration
  • Google Merchant and Facebook Business integration
  • Structured, measurable goal-friendly checkout-flow
  • Performance optimizations
  • ... and much more!

The website was re-launched in December 2018 — Fantask is still going strong! — and can be visited at fantask.dk (sorry, only in Danish!):

Fantask Website Today


Conclusion

Working with old code is sometimes unavoidable, either because of scope or costs, but it can also teach you a thing ot two.

In this case, the only way I could accomplish the re-write in such a short time was because of the simple and reduced tech stack: HTML, ASP, CSS and JavaScript. No frameworks. No backend-development, since “Classic ASP” is dead-simple, like PHP. Just VS Code and Internet Information Server, with a few tweaks.

But also, and this is perhaps the most important reason, because I could make all decisions myself! No discussions with BE-developers, no Project Manager, no Scrum Master, no JIRA-tickets, no UX-discussions — or designers wanting a 1px box-shadow!

In other words: completely unrealistic in the real world!

But it was fun to do, and while I won't recommend using “Classic ASP” for your next project, I will recommend looking at the tech stack, and see, if anything can be simplified.

Latest comments (84)

Collapse
 
jdcdev profile image
Jose Daniel

I can completely relate to this post. I'm not a full time developer but I learned the basics of web development back in 2010. It was straight to the point: HTML, Js and Css for front-end. C# or PHP back-end and a good LAMP setup. Since then many frameworks have been added and sometimes I just wonder if many of them are really necessary or add value. I don't have the answer but I believe simplicity is better as long as the main goal is reached without compromising efficiency and reliability.

Collapse
 
madsstoumann profile image
Mads Stoumann

I agree, simplicity is always the right path!

Collapse
 
mufidu profile image
Mufid

Fantastic. It makes me think again before going deeper into other "latest" frameworks. Thanks!

Collapse
 
madsstoumann profile image
Mads Stoumann

Glad you liked it!

Collapse
 
pastuh profile image
pastuh

0.25 border solved everything. GJ

Collapse
 
vinthefantastic1 profile image
vinthefantastic1

The new site looks great! It's super speedy and responsive to boot! Fantastic work.

Collapse
 
madsstoumann profile image
Mads Stoumann

Thank you!

Collapse
 
jonesydev profile image
jonesy-dev

Flot stykke arbejde.

Collapse
 
madsstoumann profile image
Mads Stoumann

Mange tak!

Collapse
 
pietervanuhm profile image
Pieter van Uhm • Edited

Nice job, maybe consider URL Rewriting to make it a bit more prettier

Collapse
 
madsstoumann profile image
Mads Stoumann

Yes, I need to look into that. Not sure if it even existed back in the 1990’s! 😂

Collapse
 
robole profile image
Rob OLeary • Edited

Enjoyed this story a lot. The reality is old tech works fine in many cases, and it may not be worth it for a small business to replace things like you discussed. Using modern HTML and CSS with a sprinkle of JS will take you a long way. I think there is a fixation on large scale businesses these days, and we forget about smaller businesses with simpler needs and less resources.

I did my final year college project in ASP, even though ASP.NET was around, because I got a well-written book on it in a sale bin and I was a poor student! I wish I had the code to look over it now. Glad to head Fantask is still going. As a comic-book lover, I will look to visit if I make it to Copenhagen. Thanks for sharing 😀

Collapse
 
madsstoumann profile image
Mads Stoumann • Edited

Thanks! I agree, small businesses cannot afford the multitude of services required to run a modern webshop, if it's more than a few hundred products. And please do visit Fantask! It's been on the same corner in Copenhagen for almost 50 years, and has been visited by many famous artists through the years: Stan Lee, Carl Barks, Will Eisner etc.!

Collapse
 
mbdunson profile image
M. Brian Dunson

This is fantastic! Well done and thank you for sharing this very inspiring story!

Collapse
 
madsstoumann profile image
Mads Stoumann

Thank you!

Collapse
 
metric152 profile image
Ernest

Every once in awhile I'll have to revisit a page I wrote in the early 00s that's either PHP or Classic ASP. All of the code is so nested and awful. All the mistakes you make as a junior dev.

Working with Classic ASP was painful if you needed to manipulate strings. I had to go that direction because the server at the office was NT. The site rarely went down but I pushed it pretty hard.

Collapse
 
madsstoumann profile image
Mads Stoumann

Yeah, revisiting old code can be painful! And I had completely forgotten a lot of the syntax, like ReDim Preserve 😆

Collapse
 
lasertuskey profile image
Alexa Tuskey

I can't believe you only did it in 7 days. Incredible work!

Collapse
 
madsstoumann profile image
Mads Stoumann

Thank you! I was a bit pressed for time!