Level Up Your WordPress Development with wp-env

A WordPress development environment is a safe and private place where you can work on building or editing a WordPress site. It is not accessible to internet visitors, but as long as you’re working from your own computer, it functions pretty much just like any other WordPress site.

There are many different ways to set up a WordPress development environment. Some popular options include:

• Using a local server stack, such as MAMP or XAMPP
• Using a cloud-based development environment, such as Cloud9 or Codeanywhere
• Using a container-based development environment, such as Docker

But all of the above approaches require some level of technical knowledge or prerequisite setups. What if you could, with just a single command, spin up a new WordPress development environment locally in just a few secs? Introducing – wp-env! wp-env does just that! Let’s take a look at wp-env below.

What is wp-env

wp-env is a command-line tool that helps you set up a local WordPress environment for development and testing. It is a zero-config tool, which means that you don’t need to do any manual configuration to get started. To use wp-env, you simply need to install it and then run the wp-env create command. This will create a new WordPress environment in a directory of your choice.

wp-env comes with a number of features that make it a powerful tool for WordPress development. These features include:

• The ability to create multiple environments, each with its own set of settings
• The ability to quickly and easily switch between environments
• The ability to share environments with other developers
• The ability to run automated tests against your environment

wp-env is a free and open source tool. You can find more information about it on the wp-env website: https://make.wordpress.org/core/2020/03/03/wp-env-simple-local-environments-for-wordpress/

Here are some of the benefits of using wp-env:

• It is easy to use. You don’t need to be a command-line expert to use wp-env.
• It is flexible. You can create multiple environments, each with its own set of settings.
• It is portable. You can easily move your environments to different machines.
• It is secure. wp-env uses Docker to create isolated environments, which helps to protect your data.

Setting up wp-env

Prerequisites

wp-env relies on a few commonly used developer tools:

• Docker. wp-env is powered by Docker. There are instructions available for installing Docker on Windows (we recommend the WSL2 backend), macOS, and Linux.
• Node.js. wp-env is written as a Node script. We recommend using a Node version manager like nvm to install the latest LTS version. Alternatively, you can download it directly here.
• git. Git is used for downloading software from source control, such as WordPress, plugins, and themes. You can find the installation instructions here.

ALSO READ – Local by Flywheel Review

Installation

After confirming that the prerequisites are installed, you can install wp-env globally like so:

$ npm -g i @wordpress/env

This will install wp-env globally on your computer.

If your project already has a package.json, it’s also possible to use wp-env as a local package. First install wp-env locally as a dev dependency:

$ npm i @wordpress/env --save-dev

Next, we need to add this npm script to your package.json file

// package.json
"scripts": {
  "wp-env": "wp-env"
}

Additionally, we need to configure the environment by adding a .wp-env.json file in your project root and adjust it to your needs (see the Block Editor Handbook for reference):

// .wp-env.json
{
  "core": "WordPress/WordPress",
  "plugins": [ "." ]
}

To open your WordPress site, you need to visit:

• Frontend: http://localhost:8888/
• Backend: http://localhost:8888/wp-admin (Username: admin / Password: password)

Stopping the environment

To stop the environment, use the following command:

npm run wp-env stop

You can also find some other useful commands here:
https://developer.wordpress.org/block-editor/packages/packages-env/#command-reference

Troubleshooting

If you are unable to access the WordPress site created with wp-env, you can check for the following issues:

• Check wp-env is running: As wp-env uses docker containers, you can check for running docker containers using the command – docker ps. Check if  wordpress with port 8888, tests-wordpress with port 8889 and mariadb with port, 3306 containers are running

• Check the port number: By default, wp-env uses port 8888. So, the environment is accessible at http://localhost:8888. You can configure the port that wp-env uses so that it doesn’t clash with another server by specifying the WP_ENV_PORT environment variable when starting wp-env: $ WP_ENV_PORT=3333 wp-env start
• Restart docker: For restarting docker, right-click on the docker desktop icon in the Windows system tray and click on restart. Once restarted, start wp-env again.

• Reset wp-env environment: If nothing works, as a last resort, you can delete everything and start from scratch:

⚠️ WARNING: This will permanently delete any posts, pages, media, etc. in the local WordPress installation.

$ wp-env destroy
# This new instance is a fresh start with no existing data:
$ wp-env start

Verdict

If you are a WordPress developer who is looking for a quick and easy way to set up and manage local development environments, then wp-env is a great option. It is well-maintained and easy to use, and it can be customized to meet the needs of any project.

ALSO READ – Securing WordPress on AWS Lightsail