How to Run Your WordPress Site On Local, Gatsby and Netlify… For FREE!

How to Run Your WordPress Site On Local, Gatsby and Netlify… For FREE!

Yes! This is a click-bait-y title. BUT, I wanted to see if this was possible, and it is!

If you’ve ever wanted a fast and secure WordPress site, here is one way to do it.

NOTE: I would NOT recommend this (probably) for a live site. Maybe there’s a slightly different way of going about this, but I currently do not have my site on this set up because I would not call this a “stable” setup.

Onward…

A Quick Video

The Steps

To accomplish a “free” (no money out of your pocket) site with WordPress, Gatsby and Netlify, you need to do the following:

  1. Set up your site on Local by Flywheel
  2. Pull down this repository to your computer
  3. Turn on the ngrok link and add that to the gatsby-config.js file
  4. Save the file and run gatsby develop to make sure things compile.
  5. Set up your environment in netlify by following the setup wizard.
  6. As long as the ngrok site is live, you can deploy (e.g add a new post and deploy)
  7. Deploy and re-deploy as necessary.

That’s really it, it’s super simple.

Here’s the demo site: https://cranky-hypatia-4fe7f5.netlify.com/

And here’s the Github repo for the starter: https://github.com/n8finch/wp-starter-netlify-local-by-flywheel-demo

Fork it and do whatever!

Some Thoughts on This Setup

There are pros and cons of this setup.

Pros:

  • Your site is super secure, no one can access a database, hack it, etc.
  • You have control over everything.
  • You’re on Gatsby, so you’re getting a great experience out of the box.

Cons:

  • You need to back up your local install, somehow, however you want to.
  • ngrok is probably not the most reliable way to compile your site, especially if it’s more than just a blog or “brochure” site
  • All of your media needs to be hosted somewhere else (I’d recommend Cloudinary for images, and if you have audio or video, there’s plenty of services for that).
  • If you have anything that’s not static (shopping cart, membership site, some kind of LMS, etc.), there’s going to be an issue with you getting real-time data and interactions.

Is This For Me?

Basically, if you have a static blog or site that doesn’t require any interaction, this might be a great setup for you. It wouldn’t take too much work to get images hosted on Cloudinary, or another CDN.

Currently, I don’t have this workflow set up for myself, and I don’t think I want to run things this way just yet, maybe in the future!

I think an ideal set up for me would be to use Local with a Flywheel remote site that would run backups, SSL, and put images on a CDN for me… Maybe I’ll get a wishlist together for another article!

BUT, it’s a great way to start playing with Gatsby, Netlify, deployments, the content mesh, etc.

I could see myself moving to something like this in the future, but not today.

Any thoughts, let me know @n8finch.

Have fun!


Photo by frank mckenna on Unsplash

Up Next

Hello Gatsby! This blog is now headless WordPress…

Hello Gatsby! This blog is now headless WordPress…