Case study

WordPress to Hugo conversion

Colin originally approached us to clone the homepage of his website as a proof of concept to see how it would work if his site was in hugo with the repository in Gitlab. Initial tests were promising and the whole site has since been cloned and extended with some sections being redesigned. Further work is currently being undertaken to integrate a microsite into the theme.

4Armed website's screenshot

Problem

Feeling ever more frustrated with running their website in WordPress, the data scientists at Jumping Rivers wanted an easier way to manage their daily interactions with the website. They wanted to be able to change content, courses and blog posts and integrate the management of their website into Gitlab which most of their staff use in their daily roles. The also wanted all of the advantages that are baked in to a static website; such as insanely fast page speeds, fortress like security and branch based version control. They needed a team with experience of both WordPress and the JAMstack and we were able to help

icon

Solution

After a proof of concept it was decided that Hugo would be the best static site generator for this implementation. It is the fastest static site generator and excels at building websites designed around content and blogs rather than Single Page Applications. We built a custom theme, first as static html and later connecting the templates to the Hugo content. Content was imported from WordPress using the excellent SchumacherFM plugin. As no payment processing was required, we decided to build a vanilla JS cart utilising Netlify forms rather than relying on an API for a backend.

Core web vitals

Over the previous 28-day collection period, the aggregate experience of all pages served from this origin passes the Core Web Vitals assessment.

First Contentful Paint (FCP)

Largest Contentful Paint (LCP)

First Input Delay (FID)

Comulative Layout Shift (CLS)

Learnings

Building a shopping cart from scratch in vanilla JS isn’t actually that easy. Especially when you have to replicate most of the functionality that Woocommerce provides. We learnt a lot from the process and developed our own ecom module off the back of this so it was well worth it although debugging edge use cases almost finished us off :)

4Armed website's screenshots

What they thought of us

Excellent job. It’s now much easier for us to create courses and posts from within gitlab Thanks!

murphy photo

Colin Gillespie

O’Reilly author, Data camp presenter, R trainer/consultant and academic