Moving my website to Strapi and NuxtJS (part 1)

What is JAMstack?

To start let's look at what JAMstack is. JAMstack isn’t a specific set of tools, but a new, modern way of building websites & apps.

So where does “J-A-M” come from? And the answer is these three core concepts.

JavaScript: Executes on the client-side.

APIs: All server-side functions or database actions are abstracted into reusable APIs, accessed over HTTPS with JS.

Markup: Templated markup should be pre-built at build time, usually using a site generator for content sites or a build tool for web apps.

What do I want to accomplish?

For many years this site has been static, and over that time I have noticed that I have updated the site less and less. The main areas that have suffered are the portfolio and blog, removing the blog completely during the last build!

Alongside this, I was running many other systems for form collection, support tickets, questionnaires, surveys the list goes on. I had reached the point of being sick of maintaining many solutions and wanted to bring this all under one roof.

Some of the pages, such as our services page, I was more than happy to leave as static. I prefer a custom layout for each of the services, rather than templating everything.

I also wanted a way to achieve the following:

  • Lower cost - Free, potentially, depending on where you look to host your site.
  • Easier to maintain - Once your site is set up, maintenance is generally as easy as adding, updating, or deleting content contained on the CMS.
  • Since your pages are pre-rendered, meaning they’re created on deployment and not on user request, your site will be blazing fast.
  • SEO friendly - Being pre-rendered also comes with the benefit of having all your content readily available for bots and crawlers.
  • Secure - The less back and forth between the server, database, and client, the better.
  • Expandable - Ability to add and remove functionality that we need.

I am adding more and more ideas to the plans for the website going forwards. Check our progress (coming soon)

So what did we decide?

After researching about JAMStack for a while now, looking at the many frameworks and headless CMS solutions I could use, I settled on the following:

Strapi - open-source headless cms. It’s 100% Javascript, fully customisable and developer-first. Strapi offers the ability to connect to a range of databases, frontend frameworks, or static site generators. I can choose where I want to host the websites, whilst integrating with my favourite tooling.

Nuxt.js - Vue.js framework

I am working on another post that talks about the challenges I faced and the progress to date.

Part 2 - Building with Strapi and Nuxt.js (coming soon)