Goodbye WordPress! Hello Directus & Next.js

When we first started YoPrint, we went with WordPress for our landing pages because it was easy, and we didn't have time. Launch an instance, add a theme and a few plugins, and you are good to go. Wonderful! The site design was terrible, but it was good enough for what we were trying to do.

As years passed, our frustrations with WordPress started to accumulate and finally exploded when we hired our first designer. I wanted to give our website a facelift and make it pretty! Unfortunately, translating the design to WordPress was a giant pain in the ass. The WYSIWYG editor was clunky and hard to standardize. So, I tried custom CSS. However, it took me forever to try and fight all the stupid little classes and the page builder. Eventually, like putting lipstick on a pig, I just gave up, hand-coded the HTML, embedded it as raw HTML on the page builder, and called it a day. Sometimes, I feel like my genius knows no bounds. (That's a joke btw).

The problem is that I have 20+ pages that should have the same look and feel for the sake of cohesion. So, I created a Node.js project to help me manage the templates and CSS. What the fuck am I even doing at this point? Isn't WordPress supposed to be the no-code solution?

To add insult to injury, the site has been progressively slowing down, and now it was outright timing out sometimes. Maybe the Jenga of plugins is finally ready to fall and I didn't want to find out.

We are Coders

At this point, I realize why so many companies simply outsource maintaining WordPress. It's a skill, and by the looks of it, I had skill issues when it came to WordPress. Do you know where I don't have skill issues? Programming. I could have just coded the whole site up and would have been done by now. So that's what I went out to do. I just needed two things: a headless CMS and a static page generator.

Enter Directus & Next.js

At the introduction of @bryantgillespie I discovered Directus. I loved how, at the end of the day, all Directus does is manage your database tables for you in a transparent, 1:1 manner with a UI to update and edit the contents. It was simple but powerful. I also especially loved that it's self-hosted. Miss me with those cloud bills. It was perfect. I then paired it with Next.js. I love working with React, and this was the easiest choice I made. I also sprinkled some Tailwind CSS, and voila, we have a perfect recipe.

Phased Move

Moving the whole site to Directus + Next.js was daunting. While the landing pages number in the twenties, our product updates and blogs was a whole other ball game. However, there was an easy way out. Nginx!

We simply started working on a couple of pages at a time and "released " them. We then used Nginx to redirect those pages to the Next.js version of the site and the rest to WordPress. We did this over the span of a year, taking our time and doing it in between the features.

We first did all the landing pages as they don't need to be in Directus. Yes, you can manage them in Directus if you want to, but this content isn't going to change often. The effort required to map them into Directus felt like a waste of effort, so we just hardcoded them and shipped them.

The second round was our Events page. These pages followed the same data structure, and with only 12 of them, they were the perfect testing ground for us to figure out Directus. After a couple of tries, we nailed it and released it.

The third round was Product Update. We had 74 of them "Articles." I had my Digital Marketing person start manually copying the content from WordPress to Directus. Yes, we could have automated it, but considering the time, energy, and engineering effort required to make it happen, it would have been cheaper to just hire someone to manage the data entry for us. Secondly, I just wanted a clean slate. I don't want the old junk from WordPress or WordPress-related workarounds to be copied over. I also loved the idea of using Markdown to write these articles, for which Directus has fantastic support.

The fourth round was our Blog section—yes, the final boss at 101 pages. So we automated it! Just Kidding! We used some elbow grease and powered through it manually. Never underestimate the joy of doing mundane tasks. I quite enjoyed doing 10 pages at a time. It felt therapeutic. I don't know how my Digital Marketing felt about it, though. I am sure she was delighted!

And on 11/28/2024, it was finally fucking done!

Was it worth it?

100% yes! The site is blazing fast now. No more CSS, HTML, and JavaScript bloat. No more weird content/div structure. Directus made managing our dynamic content easy and both user-friendly and programmer-friendly. Tailwind Typography also ended up being an excellent addition to our Blog and Product Updates section. It was beautiful, and most importantly, it was readable. The best part? I no longer have to wage war with WordPress to twist its arm and bend it to my will.

I firmly believe WordPress is still an excellent technology for solving real problems. It's just no longer a fit for what we need. With that said, thank you, WordPress, for everything you've done for us. Sayonara!