A super straight forward workflow for using Devkit to push a wordpress headless demo to a live WP Engine install. We’re going to be using an existing project called Celestial (source) that uses WordPress’s theme convention to load the react.js code.
Full WP Engine Devkit quick-start Guide here.
Time needed: 45 minutes.
- Install X-Code:
- Install Homebrew:
ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"
- Download and install Docker:
- Install WPE-Cli (Devkit):
brew install wpengine/wpe-cli/wpe-cli
- Initialise WPE-Cli:
- Load Devkit bash:
Node.js is bundled into Devkit. Loading it’s bash will give you access to it so you can run things like
- Create a new local install:
wpe projects new INSTALLNAME
Replace INSTALLNAME with your name of choice.
- Go to INSTALLNAME directory:
- Navigate to /wp-content/themes/ and install the Celestial demo theme:
git clone https://github.com/m-muhsin/celestial.git
- Go into that directory and grab React DOM (theme dependancy):
npm install --save react react-dom
- Also grab Webpack (another theme dependancy):
npm install -g webpack-cli
- Go into the theme directory (wp-content/themes/celestial/ in this case) and compile the theme:
npm run build
- OPTIONAL | Run it locally and take a peek:
- Pair up the local install with the WP Engine install (running these in local ROOT install directory):
wpe config prod_install WPEINSTALLNAME
…where WPEINSTALLNAME is the name of the install on the WP Engine side.
- Finish the configuration:
wpe config push_environment prod
- Push the install from local to the install on the WP Engine server: