DEV Community

Rich Kurtzman
Rich Kurtzman

Posted on

Create a headless WordPress with Gatsby

Image description
WordPress is widely regarded as one of the most popular content management systems in the world.

In fact, as of late 2021, WordPress powered 35% of the top 1 million websites in the world. That’s remarkable!

Why is it so popular?

First and foremost, it’s free to download and use. However, if you want to customize it, WordPress does charge a fee for their templates and plug-ins.

Beyond being free, WordPress’s ubiquity means if you’re a content creator on the internet, you’ve probably used it before.

And if you haven’t, that’s no problem because it’s extremely user-friendly. Plus, it’s versatile enough to not only work as a great as a blog, but for many different possible projects.

Downsides to WordPress

However, there are serious downsides to using WordPress.

One is security simply because it’s so popular. The logic used by hackers is, if it’s popular, it makes more sense to figure out how to hack inside. Then, once discovered, the process can be repeated.

Another downside is that WordPress sites have slow download times. That means the audience is waiting for the site to load and could become disinterested and leave. Their use of redundant code and heavy themes certainly hurt their sites’ speeds.

Finally, the necessity of plugins is a third drawback. Using many plugins at once will result in lethargic loading times. On top of that, many crucial plugins are only accessible by paying a yearly subscription fee. That means your “free” site is now much more to operate a year.

Solution: Headless WordPress

Luckily, there’s a way around all of those issues we just illustrated above.

It’s called a “headless WordPress.”

Headless might sound scary, but it just refers to using WordPress to manage the content, but a different framework to display the content.

For this example, we’re going to use Gatsby for many reasons.

Gatsby, being a static site generator, is not only faster to load than a WordPress site, but it’s also easier to update and well suited for SEO optimization.

One of the best parts of static site generators is their ability to pre-render a site. That prefetched data means not only a fast initial visit and download of a site, but using the site is much smoother and more responsive to the visitor as well.

That prefetched data also helps with SEO because with SPAs (single page applications), a blank HTML page from the server. That’s because the page is rendered in real time in the browser.

On the back end, single pages and applications can still be made with React and the site and all its pages are prerendered and sent to the server. So, after that initial visit, the site actually acts more like an SPA.

Also, security is improved by using a headless WordPress – and specifically, Gatsby – because the static site generator means there’s no data stored on servers. There’s no “reachable database” as Gastby explains in their technical documentation.

Finally, Gatsby allows you to take that information from WordPress and integrate it in many customizable ways across an entire site. That means using other CMS or web services, too.

Use Gatsby, host on Fathym

If you’re a blogger or have any kind of content-based site using WordPress, you may want to break free. Gatsby is a truly free option to run a headless WordPress, and then you can even host that site on Fathym for free (to start before upgrading).

Because Gatsby is much faster than traditional WordPress sites, it’s a better user experience and there’s a possibility your site will be faster than the competition’s too.

Join Fathym

Transfer your WordPress website over to Fathym today and try it out for free with Gatsby. And once you see the improved speed and user experience, we have a feeling you’ll stick around.

Top comments (0)