An Ang Mo Geek in Singapore

converting dynamic sites to static hosting

Why?

Security and speed are the two main factors that made me migrate dynamic sites to static sites.

I used to build some small sites without any framework using PHP to reuse common files (headers, footers, database connections) with some minimalistic administration pages to avoid to do vi over ssh to manage content. Security wasn’t a concern, Internet users where nice and respectful back then (or more probably I was young and naive). A badly done image upload can quickly become a hacker paradise. This little php snippet that sends out thousands of emails or worse runs brute force attacks against some powerful institutions.

This kind of security holes becomes even more important when you are using well known frameworks (Wordpress, Joomla anyone?).

I used Joomla or Wordpress on some of my less smaller sites. All this sites where made for personal fun or for small community clubs I was part of, and once time passes the sites doesn’t get updated anymore, but you don’t want to kill it by pride. You keep it in the wild, forgetting Joomla’s security updates and still needing your Apache, libapache2-mod-php and PHP.

Time to archive it!

Archive your old sites

For sites you know you won’t have any content or layout updates anymore, the easy way out is downloading your dynamic site as plain HTML and serve it read-only without any server-side dynamic component. You could still keep some on-the-fly Javascript DOM replacements.

Tools

Many ways to skin a cat. Browsers have the ability to download a page and their asset. Good enough for small 3 pages sites. I find httrack more elegant and flexible. There are obviously many other tools to get to the same result, all depends on your taste and needs.

httrack

httrack is a mirroring tool, it allows to update local mirror when the source has changed, it allows to continue interrupted mirroring processes. For our archive process we will use it in a very simple way.

httrack http://www.example.com -O ~/mirror/

Your site is now mirrored in ~/mirror/www.example.com/.

We can now upload our HTML, CSS, JS and Images to our hosting provider and update the domain’s DNS entry to point to the new server. Or you could just replace all the files of your PHP site.

If your files (HTML, JS, CSS) contain references to www.example.com it doesn’t matter, since the site is hosted under the same domain.

Hide your admin and update content when needed

If you still need to do updates to your content from time to time, you can keep your PHP site on a server inside your LAN or behind a firewall to limit access. You can even keep it in a Virtualbox or Docker image and run it when needed.

Using httrack, you update your static mirror with

httrack --update http://source.example.com -O ~/mirror/

Your site is now updated with the latest changes in ~/mirror/source.example.com/, and you can upload the content to your HTTP server.

Use a static generator

If none of the above options are suitable, you can migrate your site to a static generator like Hugo, Hexo or any other similar tool.

Examples

PAO

Celtic Rock Band. No more active, but site looked good and most of the pictures are mine. Migrated from Joomla 1.5
paomusic.com

Bar des Fossiles

Alumni Bar at the annual physics department festival. Used to keep in touch and keep track of the drunk evenings, Facebook wasn't there yet. Migrated from Joomla 1.5
bardesfossiles.ch

Chapelle Echarlens

A beer my wife an I used to brew but never made the market jump. The site was more a joke, you need to keep busy between the brewing steps. Migrated from custom framework.
chapelle-echarlens.ch

Geranium

It's a concept! Default landing page of the VPS that I was sharing with a friend. Intended as a joke about the hype of dynamic content, every content in boxes (but no descent CSS). Migrated from custom framwork.
geranium.crealbum.com