Create A Simple PHP Server Using VSCode Tasks

Learn how to use Visual Studio Code tasks to build a PHP server without XAMPP or WAMP. In this tutorial, we will create 2 tasks in VS Code. One will create our PHP server in the terminal, the other will then launch Chrome and open our server. The end result is a quick and easy PHP dev environment that launches automatically with a quick key combination.

View This On YouTube

Launch a build task on Windows:

CTRL + SHIFT + B

Launch a build task on Mac:

CMD + SHIFT + B

Create A Task File in VSCode

When you are in VSCode, you can launch your tasks by using the key combinations above. It will either run your current build tasks or ask you to create a new one if you have not previously created one.

If you do not use the key combinations, you can go to Terminal > Run Build Task to go to the same place.

Click the "Configure Build Task" option that appears.

Once you are in your tasks.json you should see a default command that looks like this:

{
    "label": "echo",
    "type": "shell",
    "command": "echo Hello"
}

This can be left in this file but you need to add the following in order to get your task for the PHP server to work properly.

PHP Server

In the same file, you can now add the following lines of code to create a simple PHP server. Make sure your json commands are comma separated. So each time you add a new task, add a comma after the previous task, like this:

{
    "label": "echo",
    "type": "shell",
    "command": "echo Hello"
},

Now you can add your server task.

{
    "label": "php-server",
    "type": "shell",
    "command": "php -S localhost:8000",
    "group": {
        "kind": "build",
        "isDefault": true
    }
}

You can test this by running your build tasks using the key combination or the Terminal menu option. This should start a local PHP server at the address localhost:8000.

Keep in mind, this tutorial allows you to render PHP code but does not come equipped with a database or some other services you would expect with something like WAMP or MAMP. This is to simply run your PHP code without an external service. You can still use your PHP code to hit external APIs but it does not spin up your own database.

Launch Chrome

To make this a little easier to work with while I am developing, I like to make it open my browser to the newly created server. You can do this by create a new task and pointing it to your Chrome (or other browser) .exe file.

Add the following as a task in your json file.

{
    "label": "launch-chrome",
    "type": "shell",
    "command": "chrome.exe http://localhost:8000/",
    "options": {
        "cwd": "C:\\Program Files (x86)\\Google\\Chrome\\Application"
    }
}

Make sure your "cwd" is pointing to your browers's exe file. Mine currently resides in the following folder:
C:\Program Files (x86)\Google\Chrome\Application

Now you should have either 2 or 3 tasks in this json file. If you run the build tasks, it will not open the browser, this is because that task is not tied into anything else. We need to add the following code to your server build task to make them work together.

"dependsOn": [
    "launch-chrome"
]

The server build task should now look like this:

{
    "label": "php-server",
    "type": "shell",
    "command": "php -S localhost:8000",
    "group": {
        "kind": "build",
        "isDefault": true
    },
    "dependsOn": [
        "launch-chrome"
    ]
},

Now you can run your build task and it should start the server, then open Chrome if everything is setup as it should be.

Final Code

This is what my json looks like. If you are starting fresh, your should look like this as well. If you have tasks already, just make sure the previous code was added to the existing tasks and you select the build you want to run.

{
    // See https://go.microsoft.com/fwlink/?LinkId=733558
    // for the documentation about the tasks.json format
    "version": "2.0.0",
    "tasks": [
        {
            "label": "echo",
            "type": "shell",
            "command": "echo Hello"
        },
        {
            "label": "php-server",
            "type": "shell",
            "command": "php -S localhost:8000",
            "group": {
                "kind": "build",
                "isDefault": true
            },
            "dependsOn": [
                "launch-chrome"
            ]
        },
        {
            "label": "launch-chrome",
            "type": "shell",
            "command": "chrome.exe http://localhost:8000/",
            "options": {
                "cwd": "C:\\Program Files (x86)\\Google\\Chrome\\Application"
            }
        },
    ]
}

Read more articles on DevDrawer