BACK
January 16, 2021
Moving my website to Strapi and NuxtJS (part 1)

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!

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)

Kingsley media
Whether you're bringing a new product to market or redesigning enterprise software, we'll make sure it's done right 👌
Kingsley Media LTD
35 Kingsley Wood Road
Rugeley
WS15 2UF

Company Number: 10121315

©2020