Build a Local WordPress Dev Stack in VS Code: Dev Containers + Composer Workflow

Setting up a proper development environment for WordPress can dramatically enhance productivity, reduce bugs, and simplify collaboration. With the increasing adoption of modern development tools, it’s now easier than ever to create isolated and reproducible local stacks using Visual Studio Code (VS Code) and Dev Containers. Coupled with Composer, a dependency manager for PHP, developers are empowered to handle WordPress as a more manageable and modular project. This article provides a comprehensive guide to building a local WordPress development environment using VS Code, Dev Containers, and Composer.

Why Use Dev Containers in WordPress Development?

Dev Containers, powered by Docker, allow developers to define and run a consistent development environment within VS Code. This means you can eliminate the “it works on my machine” problem by standardizing your entire development stack through a simple configuration file.

When building a WordPress site or plugin, having a Dockerized solution ensures every developer on the project uses the exact setup. Dev Containers also simplify testing across multiple PHP versions, run-time debugging, and allow quick onboarding for new contributors.

Benefits of Using Composer with WordPress

Composer makes dependency management for PHP seamless. For WordPress, it brings structure and clarity by allowing you to:

• Install WordPress core as a dependency rather than committing it to your repository.
• Include plugins, themes, and libraries directly through Composer packages.
• Maintain version control of every asset in your stack.

The synergy between Composer and Dev Containers aligns perfectly to create a robust environment without the clutter and inconsistencies of traditional local setups.

Prerequisites

• VS Code (latest version)
• Docker & Docker Desktop
• The VS Code Dev Containers Extension
• Familiarity with WP-CLI and Composer basics

Step 1: Setting Up Your Project Directory

Start by creating a folder for your WordPress project. Inside this folder, initialize it as a Composer project:

composer init

Add WordPress as a dependency using the johnpbloch/wordpress package, which allows WordPress core to be managed independently of your project files:

composer require johnpbloch/wordpress

Organize your directory like so:

• /wp – WordPress core managed by Composer
• /web – Web root (will include wp, themes, and plugins)
• /config – Custom configuration files

Step 2: Creating the Dev Container Configuration

To spin up your local Dev Container, add a .devcontainer folder to your root directory. Inside this folder, create two files:

devcontainer.json

{
  "name": "WordPress Dev",
  "dockerFile": "Dockerfile",
  "settings": {
    "php.validate.executablePath": "/usr/local/bin/php"
  },
  "extensions": [
    "felixfbecker.php-debug",
    "xdebug.php-pack"
  ],
  "forwardPorts": [80],
  "postCreateCommand": "composer install"
}

Dockerfile

FROM php:8.2-apache

RUN apt-get update && apt-get install -y \
    libzip-dev unzip git zip curl \
    && docker-php-ext-install zip mysqli

COPY --from=composer:latest /usr/bin/composer /usr/local/bin/composer

RUN a2enmod rewrite

This configuration sets up a PHP 8.2 environment with Apache, Composer, and necessary extensions suitable for WordPress development. It also forwards port 80, allowing your site to be accessible via localhost inside the container.

Step 3: Defining a Custom Entry Point with WP-CLI

WP-CLI is essential for managing WordPress from the command line. Within your Dockerfile or as a separate script, you can install WP-CLI globally in the container.

RUN curl -O https://raw.githubusercontent.com/wp-cli/builds/gh-pages/phar/wp-cli.phar \
    && chmod +x wp-cli.phar \
    && mv wp-cli.phar /usr/local/bin/wp

Once installed, you can automate tasks such as installation, plugin activation, and content generation. For example, a setup.sh script might look like:

#!/bin/bash
wp core download --path=web/wp
wp config create --dbname=wordpress --dbuser=root --dbpass=root --path=web
wp db create
wp core install --url="http://localhost" --title="My Site" --admin_user=admin --admin_password=pass --admin_email=admin@example.com

Step 4: Persisting Database and Volume Configuration

To persist your WordPress database, modify your docker-compose.yml (optional but recommended) to include MySQL and mount volumes:

version: "3.8"
services:
  wordpress:
    build: .
    ports:
      - "80:80"
    volumes:
      - .:/var/www/html
  db:
    image: mysql:5.7
    environment:
      MYSQL_DATABASE: wordpress
      MYSQL_ROOT_PASSWORD: root
    volumes:
      - db_data:/var/lib/mysql

volumes:
  db_data:

Using Docker Compose is especially useful when managing multiple services (e.g., Redis, Elasticsearch) in larger stacks.

Step 5: Launch and Development Inside VS Code

Now that everything is configured, open the folder in VS Code and click on the Dev Container prompt: “Reopen in Container”. After building the container, VS Code will mount your project inside the container while maintaining full access to source control and extensions.

This is where productivity skyrockets. Here are a few possibilities:

• Run Composer directly from the terminal.
• Use WP-CLI for scripting and automation.
• Build and test custom plugins/themes in real-time.
• Debug PHP applications using Xdebug with breakpoints.

Managing Themes and Plugins with Composer

Instead of installing themes or plugins manually, manage them with Composer by using WordPress Packagist:

{
  "repositories":[
    {
      "type": "composer",
      "url": "https://wpackagist.org"
    }
  ],
  "require": {
    "wpackagist-plugin/contact-form-7": "*",
    "wpackagist-theme/twentytwentyone": "*"
  }
}

This keeps third-party assets locked and under version control—making continuous integration and deployment far more predictable.

Wrap-Up

Combining Dev Containers with Composer transforms traditional WordPress development into a more modern, modular, and collaborative process. It addresses longstanding pain points like inconsistent environments, dependency management, and onboarding complexity.

While this setup may take a bit of initial configuration, the long-term benefits far outweigh the effort. The containerized stack ensures that every project is portable, reproducible, and optimized for team workflows.

FAQ

• Q: Can I use this setup on Windows and macOS?
  Yes, as long as Docker Desktop and VS Code are installed, the configuration is cross-platform via Dev Containers.
• Q: Is this suitable for production hosting?
  No. Dev Containers are purely for development. For production, consider using managed WordPress hosts or self-hosting with optimized Docker stacks.
• Q: Do I need to commit WordPress core into my repo?
  No. Using Composer ensures you install WordPress through dependencies. This keeps your repository clean and easier to maintain.
• Q: Can I use multisite with this setup?
  Absolutely. With minimal configuration in your wp-config.php and rewrite settings, multisite setups run smoothly within Dev Containers.