Why I choose to rebuild my website in nuxt.js

For many years now I’ve thought about rebuilding my website, I’ve had the same old landing page for ages now! Work and clients always seem to come first and I just push my own stuff to the back of the list.

Anyway with 2021 fast approaching me and a fellow dev at Fishtank where I work decided we need to up our dev game and learn something new. We both love WordPress and it’s always our go-to content management system (CMS), we’ve been toying with the idea of using WordPress as a headless CMS for a while now but neither of us has really invested enough time into looking it to it properly, until now. 

Headless CMS’s have been doing the rounds for a while now and the idea behind them is somewhat geniuses if you ask me. A typical website with a CMS has a whole backend for clients (you) to change the content of the website without digging into the code behind the website. This is brilliant it means we can give you a bespoke website and you can change the content without the need to ask a developer to update the content. The only problem with it is the backend behind the website is huge especially WordPress, it’s a great system but can be very slow and hard to optimise for speed. This is where the headless bit comes in, you take the CMS and host that on a subdomain of your website ie headless.domain.com or cms.domain.com you then output all the content (data) from the cms to an API endpoint. This allows the developer (me) to then build a website and connect to that API and fetch the data back.

This opens up a world of opportunity, I could build the website in PHP and call the API and time I need to get that data and display that on the website or I could build the website with a framework like nuxt.js which allows me to build the website in javascript (JS) then run a command and compress everything to static files. Nuxt will call all the API’s get the content put them into my files and flatten them. Meaning I have a lighting fast website built purely on HTML, CSS and JS even if you’re not a technical person like me that sounds cool right? Maybe not but believe me it is and it matters because your website will be unbelievably fast and Google loves a fast loading website, as does anyone who visits a website.

Did you know 1 in 4 people would abandon a website if it took 4 or more seconds to load?

We live in a fast-paced world these days and nobody wants to wait for anything anymore, that includes websites loading. If you haven’t already noticed why not try clicking around my website, homepage to about or contact then back to a blog page. You see there is minimal load time as all the code is static. On the first load the browser gets all the static files then just links to each page as you click around the website. Sure I have a nice transitional loading screen, but it’s not really going to a server and bringing back each page like it would be if I were just using WordPress alone.

Super fasts load times and the chance to play around with a new (to me) JS framework are the main reason I decided to build my website with nuxt.js. My verdict 100% the best decision I made! I’ve still got a lot to learn but I’m planning on doing a follow-up post going into the Pro’s and Con’s of using nuxt.js and who or what type of website might benefit from this type of build.