Sometimes, the simplest solution is the simplest solution. In this case, I’ve tried just about every popular development setup for WordPress. MAMP is still the winner.
I had been using the WordPress docker environment that is available when working on the Gutenberg project. It’s mostly reliable, but makes my computer fan really tired. If you’re just getting started with Gutenberg or are a developer, it’s definitely the way to go. The instructions are on the GitHub repo.
Unfortunately, the build isn’t always reliable and when I’m working on a plugin, I need it to be so I don’t waste time figuring out if my code is bad, if the build is failing, if npm is working properly, or if the problem is the WordPress installation itself.
My setup
First things first: Install MAMP! I have used Both basic and Pro in the past. For now I’m sticking with basic as it does what I want.
Install WordPress
Next up, download and unzip WordPress.
Fire up MAMP and start the servers. A web page should pop up with useful tools. If not, click the “Open WebStart page” button. There is a bunch of useful information on this page. Note the MySQL user and password. Those are needed for the WordPress setup flow.
Time to set up a database. Click the link to phpMyAdmin. It’s under the Tools menu or in the MySQL section. Enter a name for the new WordPress database. I used “gutenberg.” Click “Create.”
Move the unzipped WordPress directory to the the MAMP folder located in your Applications directory. Specifically, move it to MAMP/htdocs.
Open a browser and load up http://localhost:8888/wordpress/. Follow the setup instructions.
Gutenberg
I prefer to keep all my cloned repos together in a Code directory. Gutenberg is a plugin and needs to be inside of the plugins directory of a WordPress installation to function. There is a way to have the WordPress installation _think_ that the Gutenberg directory is in the plugins folder when it really is in my Code directory. That’s called a symlink or “symbolic link.”
A symlink is relatively quick to set up if you’re familiar with terminal. If not, you’re going to need to do some searching on DuckDuckGo. I ran the command to set it up that looked something like this:
ln -s ~/Code/gutenberg ~/<path-to-your-wordpress>/wp-content/pluginsOnce the symlink is in place, Gutenberg should show up in Plugins in wp-admin. Activate and get to work!
Bonus notes
For those using VVV, it doesn’t play well with symlinks so for Gutenberg work (or any plugin/theme work IMO), it’s a no go unless you want to work directly from the plugins or themes directories. I don’t because it always feels a bit fragile. I prefer it for work on WordPress trunk so I still keep it around.