How to Set Up a PHP Development Environment in VS Code with Docker Desktop A Step-by-Step Guide

Topics: PHP, Docker, Docker Desktop, Visual Studio Code, PHP Development, VS Code Tutorials, Docker Configuration, PHP Environment Setup, Software Development, Web Development Tools

Here’s a detailed, hands-on guide for setting up a PHP Project in VS Code using Docker Desktop with a comprehensive table of contents:

---

Table of Contents

1. Introduction
2. Prerequisites
3. Installing Necessary Tools
4. Creating the Project Directory
5. Creating the Dockerfile
6. Setting Up docker-compose
7. Setting Up VS Code
8. Writing a Simple PHP Application
9. Running the Application with Docker
10. Debugging PHP in VS Code with Docker
11. Summary and Best Practices

---

1. Introduction

This tutorial guides you through setting up and running a PHP project in VS Code using Docker Desktop. It includes writing a simple PHP application, containerizing it with Docker, and debugging with VS Code.

---

2. Prerequisites

1. Basic knowledge of PHP.
2. A computer with:
   • Docker Desktop installed.
   • VS Code installed.
3. Installed VS Code extensions:
   • Docker
   • PHP Intelephense
   • PHP Debug

---

3. Installing Necessary Tools

1. Install Docker Desktop:
   Download and install from Docker’s website.
2. Install VS Code:
   Download from Visual Studio Code.
3. Install VS Code Extensions:
   Open the Extensions tab (Ctrl+Shift+X) and install:
   • Docker: For managing Docker containers and images.
   • PHP Intelephense: For PHP syntax highlighting and autocomplete.
   • PHP Debug: For PHP debugging.

---

4. Creating the Project Directory

1. Open your terminal or file explorer.
2. Create a project directory:

   mkdir php_docker_project
   cd php_docker_project

3. Inside the directory, create a folder structure:

   mkdir -p src
   touch src/index.php

---

5. Creating the Dockerfile

1. Create a Dockerfile in the root directory:

   # Use the official PHP image
   FROM php:8.2-apache
   
   # Copy the project files into the container
   COPY ./src /var/www/html
   
   # Expose port 80
   EXPOSE 80

2. Save the file.

---

6. Setting Up docker-compose

1. Create a docker-compose.yml file in the root directory:

   version: '3.8'
   services:
    php-apache:
      build:
        context: .
      ports:
        - "8080:80"
      volumes:
        - ./src:/var/www/html

2. Save the file.

---

7. Setting Up VS Code

1. Open the php_docker_project folder in VS Code:

   code .

2. Add a .vscode folder and create a settings.json file:

   {
      "php.validate.executablePath": "/usr/local/bin/php",
      "docker.files.associations": {
          "*.php": "php"
      }
   }

3. Install the PHP Debug extension and configure debugging (details in Section 10).

---

8. Writing a Simple PHP Application

1. Edit the src/index.php file:

   <?php
   echo "Hello from Dockerized PHP!";
   ?>

2. Save the file.

---

9. Running the Application with Docker

1. Build and start the Docker container:

   docker-compose up --build

2. Open a browser and navigate to http://localhost:8080. You should see:

   Hello from Dockerized PHP!

---

10. Debugging PHP in VS Code with Docker

1. Install Xdebug in Docker Container:
   Update the Dockerfile:

   RUN pecl install xdebug 
      && docker-php-ext-enable xdebug
   
   # Copy Xdebug configuration
   COPY ./xdebug.ini /usr/local/etc/php/conf.d/xdebug.ini

2. Create a xdebug.ini file in the project root:

   zend_extension=xdebug
   xdebug.mode=debug
   xdebug.start_with_request=yes
   xdebug.client_host=host.docker.internal
   xdebug.client_port=9003

3. Add a launch.json file in the .vscode folder:

   {
      "version": "0.2.0",
      "configurations": [
          {
              "name": "Listen for Xdebug",
              "type": "php",
              "request": "launch",
              "port": 9003,
              "pathMappings": {
                  "/var/www/html": "${workspaceFolder}/src"
              }
          }
      ]
   }

4. Rebuild the Docker container:

   docker-compose up --build

5. Set breakpoints in src/index.php, then start debugging in VS Code (F5).

---

11. Summary and Best Practices

• Containerize early: Build and test PHP applications in Docker to ensure consistency across environments.
• Use docker-compose: Simplify the process of managing containers.
• Leverage extensions: Use VS Code extensions to enhance PHP development and debugging.
• Write clean, modular code: Organize files and separate concerns (e.g., src for source code).

This approach provides a scalable, flexible setup for PHP development with Docker and VS Code.

---

Stay Connected!

• Connect with me on LinkedIn to discuss ideas or projects.
• Check out my Portfolio for exciting projects.
• Give my GitHub repositories a star ⭐ on GitHub if you find them useful!

Your support and feedback mean a lot! 😊