From df5892b657dcce7de7ebb7ac0e6983707638a3a1 Mon Sep 17 00:00:00 2001 From: Garrett W Date: Fri, 26 May 2023 22:42:31 +0000 Subject: [PATCH 01/10] add guide for setting up php codespaces --- ...ting-up-your-php-project-for-codespaces.md | 209 ++++++++++++++++++ 1 file changed, 209 insertions(+) create mode 100644 content/codespaces/setting-up-your-project-for-codespaces/adding-a-dev-container-configuration/setting-up-your-php-project-for-codespaces.md diff --git a/content/codespaces/setting-up-your-project-for-codespaces/adding-a-dev-container-configuration/setting-up-your-php-project-for-codespaces.md b/content/codespaces/setting-up-your-project-for-codespaces/adding-a-dev-container-configuration/setting-up-your-php-project-for-codespaces.md new file mode 100644 index 000000000000..61852046858b --- /dev/null +++ b/content/codespaces/setting-up-your-project-for-codespaces/adding-a-dev-container-configuration/setting-up-your-php-project-for-codespaces.md @@ -0,0 +1,209 @@ +--- +title: Setting up a PHP project for GitHub Codespaces +allowTitleToDifferFromFilename: true +shortTitle: Setting up a PHP project +intro: 'Get started with a PHP project in {% data variables.product.prodname_github_codespaces %} by creating a custom dev container configuration.' +versions: + fpt: '*' + ghec: '*' +redirect_from: + - /codespaces/getting-started-with-codespaces/getting-started-with-your-php-project-in-codespaces + - /codespaces/setting-up-your-project-for-codespaces/setting-up-your-php-project-for-codespaces +type: tutorial +topics: + - Codespaces + - Developer + - Set up +--- + +## Introduction + +This guide shows you how to set up an example PHP project {% data reusables.codespaces.setting-up-project-intro %} + +## Step 1: Open the project in a codespace + +1. Go to https://github.com/microsoft/vscode-remote-try-php. +{% data reusables.codespaces.use-this-template %} + +When you create a codespace, your project is created on a remote virtual machine that is dedicated to you. By default, the container for your codespace has many languages and runtimes including PHP. It also includes a common set of tools, such as Composer, XDebug, Apache, pecl, nvm, git, lynx, and curl. + +{% data reusables.codespaces.customize-vcpus-and-ram %} + +## Step 2: Add a dev container configuration + +The default development container, or "dev container," for {% data variables.product.prodname_github_codespaces %} will allow you to work successfully on a PHP project like [vscode-remote-try-php](https://github.com/microsoft/vscode-remote-try-php). However, we recommend that you configure your own dev container to include all of the tools and scripts your project needs. This will ensure a fully reproducible environment for all {% data variables.product.prodname_github_codespaces %} users in your repository. + +{% data reusables.codespaces.setup-custom-devcontainer %} +{% data reusables.codespaces.command-palette-container %} +1. Type `php` and click **PHP**. Other options are available if your project uses particular tools. For example, PHP & MariaDB. + + + +1. Choose the version of PHP you want to use for your project. In this case, select the version marked "(default)." + + + +1. A list of additional features you can install is displayed. + + + +{% data reusables.codespaces.overwrite-devcontainer-config %} +{% data reusables.codespaces.details-of-devcontainer-config %} + +```json +// For format details, see https://aka.ms/devcontainer.json. For config options, see the +// README at: https://github.com/devcontainers/templates/tree/main/src/php +{ + "name": "PHP", + // Or use a Dockerfile or Docker Compose file. More info: https://containers.dev/guide/dockerfile + "image": "mcr.microsoft.com/devcontainers/php:0-8.2", + + // Features to add to the dev container. More info: https://containers.dev/features. + // "features": {}, + + // Configure tool-specific properties. + "customizations": { + // Configure properties specific to VS Code. + "vscode": { + "settings": {}, + "extensions": [ + "streetsidesoftware.code-spell-checker" + ] + } + }, + + // Use 'forwardPorts' to make a list of ports inside the container available locally. + // "forwardPorts": [8000], + + // Use 'portsAttributes' to set default properties for specific forwarded ports. More info: https://code.visualstudio.com/docs/remote/devcontainerjson-reference. + "portsAttributes": { + "8000": { + "label": "Hello Remote World", + "onAutoForward": "notify" + } + } + + // Use 'postCreateCommand' to run commands after the container is created. + // "postCreateCommand": "sudo chmod a+x \"$(pwd)\" && sudo rm -rf /var/www/html && sudo ln -s \"$(pwd)\" /var/www/html", + + // Uncomment to connect as root instead. More info: https://aka.ms/dev-containers-non-root. + // "remoteUser": "root" +} +``` + +{% data reusables.codespaces.devcontainer-properties-1 %} +{% data reusables.codespaces.devcontainer-properties-2 %} +{% data reusables.codespaces.additional-container-config %} + +## Step 3: Modify your devcontainer.json file + +With your dev container configuration added and a basic understanding of what everything does, you can now make changes to customize your environment further. In this example, you'll add properties that will: +* Run `composer install`, after the dev container is created, to install the dependencies listed in the `composer.json` file. +* Automatically install a {% data variables.product.prodname_vscode_shortname %} extension in this codespace. + +1. In the `devcontainer.json` file, add a comma after the `portsAttributes` property. + + ```json{:copy} + // Use 'portsAttributes' to set default properties for specific forwarded ports. More info: https://code.visualstudio.com/docs/remote/devcontainerjson-reference. + "portsAttributes": { + "8000": { + "label": "Hello Remote World", + "onAutoForward": "notify" + } + }, + ``` + +1. Uncomment the `postCreateCommand` property and assign it the command `composer install`. + + ```json{:copy} + // Use 'postCreateCommand' to run commands after the container is created. + "postCreateCommand": "composer install", + ``` + +1. Edit the `customizations` property as follows to install the "Composer" extension. + + ```json{:copy} + // Configure tool-specific properties. + "customizations": { + // Configure properties specific to VS Code. + "vscode": { + "settings": {}, + "extensions": [ + "streetsidesoftware.code-spell-checker", + "ikappas.composer" + ] + } + }, + ``` + + The `devcontainer.json` file should now look similar to this, depending on which image you chose: + + ```json + // For format details, see https://aka.ms/devcontainer.json. For config options, see the + // README at: https://github.com/devcontainers/templates/tree/main/src/php + { + "name": "PHP", + // Or use a Dockerfile or Docker Compose file. More info: https://containers.dev/guide/dockerfile + "image": "mcr.microsoft.com/devcontainers/php:0-8.2", + + // Features to add to the dev container. More info: https://containers.dev/features. + // "features": {}, + + // Configure tool-specific properties. + "customizations": { + // Configure properties specific to VS Code. + "vscode": { + "settings": {}, + "extensions": [ + "streetsidesoftware.code-spell-checker", + "ikappas.composer" + ] + } + }, + + // Use 'forwardPorts' to make a list of ports inside the container available locally. + // "forwardPorts": [8000], + + // Use 'portsAttributes' to set default properties for specific forwarded ports. More info: https://code.visualstudio.com/docs/remote/devcontainerjson-reference. + "portsAttributes": { + "8000": { + "label": "Hello Remote World", + "onAutoForward": "notify" + } + }, + + // Use 'postCreateCommand' to run commands after the container is created. + "postCreateCommand": "composer install", + + // Uncomment to connect as root instead. More info: https://aka.ms/dev-containers-non-root. + // "remoteUser": "root" + } + ``` + +{% data reusables.codespaces.save-changes %} +{% data reusables.codespaces.rebuild-command %} +{% indented_data_reference reusables.codespaces.rebuild-reason %} + + After the dev container is rebuilt, and your codespace becomes available again, the `postCreateCommand` will have been run, installing your Composer dependencies, and the "Composer" extension will be available for use. + +## Step 4: Run your application + +In the previous section, you used the `postCreateCommand` to install a set of packages via the `composer install` command. With the dependencies now installed, you can run the application. + +1. In the Terminal of your codespace, enter `apache2ctl start`. + + + +1. When your project starts, you should see a "toast" notification message at the bottom right corner of {% data variables.product.prodname_vscode_shortname %}, telling you that your application is available on a forwarded port. To view the running application, click **Open in Browser**. + + + +## Step 5: Commit your changes + +{% data reusables.codespaces.committing-link-to-procedure %} + +## Next steps + +You should now be able to add a custom dev container configuration to your own PHP project. + +{% data reusables.codespaces.next-steps-adding-devcontainer %} From 74bea4fe4e6a67f1f07c6c3c47bda89b78ea900b Mon Sep 17 00:00:00 2001 From: Garrett W Date: Sat, 27 May 2023 01:26:30 +0000 Subject: [PATCH 02/10] attempting to add the new guide to the ToC would be nice if it were documented somewhere --- content/codespaces/guides.md | 1 + content/codespaces/index.md | 1 + 2 files changed, 2 insertions(+) diff --git a/content/codespaces/guides.md b/content/codespaces/guides.md index c594554447bb..9d1db8dddd69 100644 --- a/content/codespaces/guides.md +++ b/content/codespaces/guides.md @@ -15,6 +15,7 @@ includeGuides: - /codespaces/setting-up-your-project-for-codespaces/adding-a-dev-container-configuration/setting-up-your-python-project-for-codespaces - /codespaces/setting-up-your-project-for-codespaces/adding-a-dev-container-configuration/setting-up-your-dotnet-project-for-codespaces - /codespaces/setting-up-your-project-for-codespaces/adding-a-dev-container-configuration/setting-up-your-java-project-for-codespaces + - /codespaces/setting-up-your-project-for-codespaces/adding-a-dev-container-configuration/setting-up-your-php-project-for-codespaces - /codespaces/setting-up-your-project-for-codespaces/configuring-dev-containers/setting-a-minimum-specification-for-codespace-machines - /codespaces/setting-up-your-project-for-codespaces/configuring-dev-containers/adding-features-to-a-devcontainer-file - /codespaces/setting-up-your-project-for-codespaces/configuring-dev-containers/automatically-opening-files-in-the-codespaces-for-a-repository diff --git a/content/codespaces/index.md b/content/codespaces/index.md index 4f9a236abf50..97d41f27d9a4 100644 --- a/content/codespaces/index.md +++ b/content/codespaces/index.md @@ -25,6 +25,7 @@ featuredLinks: - /codespaces/setting-up-your-project-for-codespaces/adding-a-dev-container-configuration/setting-up-your-python-project-for-codespaces - /codespaces/setting-up-your-project-for-codespaces/adding-a-dev-container-configuration/setting-up-your-java-project-for-codespaces - /codespaces/setting-up-your-project-for-codespaces/adding-a-dev-container-configuration/setting-up-your-dotnet-project-for-codespaces + - /codespaces/setting-up-your-project-for-codespaces/adding-a-dev-container-configuration/setting-up-your-php-project-for-codespaces popularHeading: Set up your project changelog: label: codespaces From 3062deaf34db91d60cedb88d1f6d8bae8dbbc126 Mon Sep 17 00:00:00 2001 From: hubwriter Date: Thu, 1 Jun 2023 09:34:11 +0100 Subject: [PATCH 03/10] Add the new article to the index.md map topic file. --- .../adding-a-dev-container-configuration/index.md | 1 + 1 file changed, 1 insertion(+) diff --git a/content/codespaces/setting-up-your-project-for-codespaces/adding-a-dev-container-configuration/index.md b/content/codespaces/setting-up-your-project-for-codespaces/adding-a-dev-container-configuration/index.md index e43b614aa191..954f54803173 100644 --- a/content/codespaces/setting-up-your-project-for-codespaces/adding-a-dev-container-configuration/index.md +++ b/content/codespaces/setting-up-your-project-for-codespaces/adding-a-dev-container-configuration/index.md @@ -13,6 +13,7 @@ children: - /setting-up-your-nodejs-project-for-codespaces - /setting-up-your-dotnet-project-for-codespaces - /setting-up-your-java-project-for-codespaces + - /setting-up-your-php-project-for-codespaces - /setting-up-your-python-project-for-codespaces --- From bddbeefebc3c09a3185491b3638210c925220e01 Mon Sep 17 00:00:00 2001 From: Garrett W Date: Fri, 2 Jun 2023 00:04:26 +0000 Subject: [PATCH 04/10] incorporating suggested changes --- ...ting-up-your-php-project-for-codespaces.md | 86 ++++++++----------- 1 file changed, 35 insertions(+), 51 deletions(-) diff --git a/content/codespaces/setting-up-your-project-for-codespaces/adding-a-dev-container-configuration/setting-up-your-php-project-for-codespaces.md b/content/codespaces/setting-up-your-project-for-codespaces/adding-a-dev-container-configuration/setting-up-your-php-project-for-codespaces.md index 61852046858b..da117fca7ea1 100644 --- a/content/codespaces/setting-up-your-project-for-codespaces/adding-a-dev-container-configuration/setting-up-your-php-project-for-codespaces.md +++ b/content/codespaces/setting-up-your-project-for-codespaces/adding-a-dev-container-configuration/setting-up-your-php-project-for-codespaces.md @@ -35,7 +35,8 @@ The default development container, or "dev container," for {% data variables.pro {% data reusables.codespaces.setup-custom-devcontainer %} {% data reusables.codespaces.command-palette-container %} -1. Type `php` and click **PHP**. Other options are available if your project uses particular tools. For example, PHP & MariaDB. + +1. Type `php` and click **PHP**. Other options are available if your project uses particular tools. For example, **PHP & MariaDB**. @@ -43,7 +44,7 @@ The default development container, or "dev container," for {% data variables.pro -1. A list of additional features you can install is displayed. +1. A list of additional features you can install is displayed. We'll install {% data variables.product.prodname_cli %}, a tool for interacting with {% data variables.product.prodname_dotcom %} from the command line. To install this tool, type `github`, select `{% data variables.product.prodname_cli %}`, then click **OK**. @@ -62,29 +63,18 @@ The default development container, or "dev container," for {% data variables.pro // "features": {}, // Configure tool-specific properties. - "customizations": { - // Configure properties specific to VS Code. - "vscode": { - "settings": {}, - "extensions": [ - "streetsidesoftware.code-spell-checker" - ] - } - }, + // "customizations": {}, // Use 'forwardPorts' to make a list of ports inside the container available locally. - // "forwardPorts": [8000], - - // Use 'portsAttributes' to set default properties for specific forwarded ports. More info: https://code.visualstudio.com/docs/remote/devcontainerjson-reference. - "portsAttributes": { - "8000": { - "label": "Hello Remote World", - "onAutoForward": "notify" - } + "forwardPorts": [ + 8080 + ], + "features": { + "ghcr.io/devcontainers/features/github-cli:1": {} } // Use 'postCreateCommand' to run commands after the container is created. - // "postCreateCommand": "sudo chmod a+x \"$(pwd)\" && sudo rm -rf /var/www/html && sudo ln -s \"$(pwd)\" /var/www/html", + // "postCreateCommand": "sudo chmod a+x \"$(pwd)\" && sudo rm -rf /var/www/html && sudo ln -s \"$(pwd)\" /var/www/html" // Uncomment to connect as root instead. More info: https://aka.ms/dev-containers-non-root. // "remoteUser": "root" @@ -98,26 +88,15 @@ The default development container, or "dev container," for {% data variables.pro ## Step 3: Modify your devcontainer.json file With your dev container configuration added and a basic understanding of what everything does, you can now make changes to customize your environment further. In this example, you'll add properties that will: + * Run `composer install`, after the dev container is created, to install the dependencies listed in the `composer.json` file. * Automatically install a {% data variables.product.prodname_vscode_shortname %} extension in this codespace. -1. In the `devcontainer.json` file, add a comma after the `portsAttributes` property. +1. In the `devcontainer.json` file, delete the two commented-out lines about features: ```json{:copy} - // Use 'portsAttributes' to set default properties for specific forwarded ports. More info: https://code.visualstudio.com/docs/remote/devcontainerjson-reference. - "portsAttributes": { - "8000": { - "label": "Hello Remote World", - "onAutoForward": "notify" - } - }, - ``` - -1. Uncomment the `postCreateCommand` property and assign it the command `composer install`. - - ```json{:copy} - // Use 'postCreateCommand' to run commands after the container is created. - "postCreateCommand": "composer install", + // Features to add to the dev container. More info: https://containers.dev/features. + // "features": {}, ``` 1. Edit the `customizations` property as follows to install the "Composer" extension. @@ -127,15 +106,28 @@ With your dev container configuration added and a basic understanding of what ev "customizations": { // Configure properties specific to VS Code. "vscode": { - "settings": {}, "extensions": [ - "streetsidesoftware.code-spell-checker", "ikappas.composer" ] } }, ``` +1. Add a comma after the `features` property. + + ```json{:copy} + "features": { + "ghcr.io/devcontainers/features/github-cli:1": {} + }, + ``` + +1. Uncomment the `postCreateCommand` property and change its value to the command `composer install`. + + ```json{:copy} + // Use 'postCreateCommand' to run commands after the container is created. + "postCreateCommand": "composer install" + ``` + The `devcontainer.json` file should now look similar to this, depending on which image you chose: ```json @@ -146,34 +138,26 @@ With your dev container configuration added and a basic understanding of what ev // Or use a Dockerfile or Docker Compose file. More info: https://containers.dev/guide/dockerfile "image": "mcr.microsoft.com/devcontainers/php:0-8.2", - // Features to add to the dev container. More info: https://containers.dev/features. - // "features": {}, - // Configure tool-specific properties. "customizations": { // Configure properties specific to VS Code. "vscode": { - "settings": {}, "extensions": [ - "streetsidesoftware.code-spell-checker", "ikappas.composer" ] } }, // Use 'forwardPorts' to make a list of ports inside the container available locally. - // "forwardPorts": [8000], - - // Use 'portsAttributes' to set default properties for specific forwarded ports. More info: https://code.visualstudio.com/docs/remote/devcontainerjson-reference. - "portsAttributes": { - "8000": { - "label": "Hello Remote World", - "onAutoForward": "notify" - } + "forwardPorts": [ + 8080 + ], + "features": { + "ghcr.io/devcontainers/features/github-cli:1": {} }, // Use 'postCreateCommand' to run commands after the container is created. - "postCreateCommand": "composer install", + "postCreateCommand": "composer install" // Uncomment to connect as root instead. More info: https://aka.ms/dev-containers-non-root. // "remoteUser": "root" From 94303ce6f69445162766efceeecada052f444601 Mon Sep 17 00:00:00 2001 From: Garrett W Date: Sat, 22 Jul 2023 04:51:37 +0000 Subject: [PATCH 05/10] corrected instructions --- ...ting-up-your-php-project-for-codespaces.md | 30 ++++++++----------- 1 file changed, 12 insertions(+), 18 deletions(-) diff --git a/content/codespaces/setting-up-your-project-for-codespaces/adding-a-dev-container-configuration/setting-up-your-php-project-for-codespaces.md b/content/codespaces/setting-up-your-project-for-codespaces/adding-a-dev-container-configuration/setting-up-your-php-project-for-codespaces.md index da117fca7ea1..af4aac6723ae 100644 --- a/content/codespaces/setting-up-your-project-for-codespaces/adding-a-dev-container-configuration/setting-up-your-php-project-for-codespaces.md +++ b/content/codespaces/setting-up-your-project-for-codespaces/adding-a-dev-container-configuration/setting-up-your-php-project-for-codespaces.md @@ -38,15 +38,9 @@ The default development container, or "dev container," for {% data variables.pro 1. Type `php` and click **PHP**. Other options are available if your project uses particular tools. For example, **PHP & MariaDB**. - - 1. Choose the version of PHP you want to use for your project. In this case, select the version marked "(default)." - - -1. A list of additional features you can install is displayed. We'll install {% data variables.product.prodname_cli %}, a tool for interacting with {% data variables.product.prodname_dotcom %} from the command line. To install this tool, type `github`, select `{% data variables.product.prodname_cli %}`, then click **OK**. - - +1. A list of additional features you can install is displayed. We'll install {% data variables.product.prodname_cli %}, a tool for interacting with {% data variables.product.prodname_dotcom %} from the command line. To install this tool, type `github`, select `{% data variables.product.prodname_cli %}`, then click **OK**, then select **Keep defaults**. {% data reusables.codespaces.overwrite-devcontainer-config %} {% data reusables.codespaces.details-of-devcontainer-config %} @@ -57,7 +51,7 @@ The default development container, or "dev container," for {% data variables.pro { "name": "PHP", // Or use a Dockerfile or Docker Compose file. More info: https://containers.dev/guide/dockerfile - "image": "mcr.microsoft.com/devcontainers/php:0-8.2", + "image": "mcr.microsoft.com/devcontainers/php:1-8.2-bullseye", // Features to add to the dev container. More info: https://containers.dev/features. // "features": {}, @@ -89,7 +83,7 @@ The default development container, or "dev container," for {% data variables.pro With your dev container configuration added and a basic understanding of what everything does, you can now make changes to customize your environment further. In this example, you'll add properties that will: -* Run `composer install`, after the dev container is created, to install the dependencies listed in the `composer.json` file. +* Run `composer install`, after the dev container is created, to install the dependencies listed in a `composer.json` file. * Automatically install a {% data variables.product.prodname_vscode_shortname %} extension in this codespace. 1. In the `devcontainer.json` file, delete the two commented-out lines about features: @@ -121,11 +115,11 @@ With your dev container configuration added and a basic understanding of what ev }, ``` -1. Uncomment the `postCreateCommand` property and change its value to the command `composer install`. +1. Uncomment the `postCreateCommand` property and change its value to run the command `composer install` if the `composer.json` file exists. ```json{:copy} // Use 'postCreateCommand' to run commands after the container is created. - "postCreateCommand": "composer install" + "postCreateCommand": "if [ -f composer.json ];then composer install;fi" ``` The `devcontainer.json` file should now look similar to this, depending on which image you chose: @@ -136,7 +130,7 @@ With your dev container configuration added and a basic understanding of what ev { "name": "PHP", // Or use a Dockerfile or Docker Compose file. More info: https://containers.dev/guide/dockerfile - "image": "mcr.microsoft.com/devcontainers/php:0-8.2", + "image": "mcr.microsoft.com/devcontainers/php:1-8.2-bullseye", // Configure tool-specific properties. "customizations": { @@ -157,7 +151,7 @@ With your dev container configuration added and a basic understanding of what ev }, // Use 'postCreateCommand' to run commands after the container is created. - "postCreateCommand": "composer install" + "postCreateCommand": "if [ -f composer.json ];then composer install;fi" // Uncomment to connect as root instead. More info: https://aka.ms/dev-containers-non-root. // "remoteUser": "root" @@ -172,15 +166,15 @@ With your dev container configuration added and a basic understanding of what ev ## Step 4: Run your application -In the previous section, you used the `postCreateCommand` to install a set of packages via the `composer install` command. With the dependencies now installed, you can run the application. +In the previous section, you used the `postCreateCommand` to install a set of packages via the `composer install` command. With the dependencies now installed, you can run the application. However, in this scenario we first need to tweak the ports that Apache will listen on. By default, it is configured to use port 80, but in Codespaces, that port is not available -- so we will use port 8080 instead. -1. In the Terminal of your codespace, enter `apache2ctl start`. +1. In the Terminal of your codespace, enter `sudo sed -i 's/Listen 80$//' /etc/apache2/ports.conf`. - +1. Still in the Terminal, enter `sudo sed -i 's/80/8080/' /etc/apache2/sites-enabled/000-default.conf`. -1. When your project starts, you should see a "toast" notification message at the bottom right corner of {% data variables.product.prodname_vscode_shortname %}, telling you that your application is available on a forwarded port. To view the running application, click **Open in Browser**. +1. And finally, in the Terminal, enter `apache2ctl start`. - +1. When your project starts, you should see a "toast" notification message at the bottom right corner of {% data variables.product.prodname_vscode_shortname %}, telling you that your application is available on a forwarded port. To view the running application, click **Open in Browser**. ## Step 5: Commit your changes From 2e825ead07d2cd76492bd165fb30deac317a05a0 Mon Sep 17 00:00:00 2001 From: hubwriter Date: Mon, 24 Jul 2023 08:28:15 +0100 Subject: [PATCH 06/10] Adjust the json markers --- .../setting-up-your-php-project-for-codespaces.md | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/content/codespaces/setting-up-your-project-for-codespaces/adding-a-dev-container-configuration/setting-up-your-php-project-for-codespaces.md b/content/codespaces/setting-up-your-project-for-codespaces/adding-a-dev-container-configuration/setting-up-your-php-project-for-codespaces.md index af4aac6723ae..b916be4c3bc5 100644 --- a/content/codespaces/setting-up-your-project-for-codespaces/adding-a-dev-container-configuration/setting-up-your-php-project-for-codespaces.md +++ b/content/codespaces/setting-up-your-project-for-codespaces/adding-a-dev-container-configuration/setting-up-your-php-project-for-codespaces.md @@ -88,14 +88,14 @@ With your dev container configuration added and a basic understanding of what ev 1. In the `devcontainer.json` file, delete the two commented-out lines about features: - ```json{:copy} + ```json // Features to add to the dev container. More info: https://containers.dev/features. // "features": {}, ``` 1. Edit the `customizations` property as follows to install the "Composer" extension. - ```json{:copy} + ```json copy // Configure tool-specific properties. "customizations": { // Configure properties specific to VS Code. @@ -109,7 +109,7 @@ With your dev container configuration added and a basic understanding of what ev 1. Add a comma after the `features` property. - ```json{:copy} + ```json "features": { "ghcr.io/devcontainers/features/github-cli:1": {} }, @@ -117,7 +117,7 @@ With your dev container configuration added and a basic understanding of what ev 1. Uncomment the `postCreateCommand` property and change its value to run the command `composer install` if the `composer.json` file exists. - ```json{:copy} + ```json copy // Use 'postCreateCommand' to run commands after the container is created. "postCreateCommand": "if [ -f composer.json ];then composer install;fi" ``` From 4ec7e1e9409f453497a50c137d358887456667ef Mon Sep 17 00:00:00 2001 From: Garrett W Date: Mon, 24 Jul 2023 13:09:21 -0500 Subject: [PATCH 07/10] add suggested wording changes Co-authored-by: hubwriter --- .../setting-up-your-php-project-for-codespaces.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/content/codespaces/setting-up-your-project-for-codespaces/adding-a-dev-container-configuration/setting-up-your-php-project-for-codespaces.md b/content/codespaces/setting-up-your-project-for-codespaces/adding-a-dev-container-configuration/setting-up-your-php-project-for-codespaces.md index b916be4c3bc5..9b6746bc28e4 100644 --- a/content/codespaces/setting-up-your-project-for-codespaces/adding-a-dev-container-configuration/setting-up-your-php-project-for-codespaces.md +++ b/content/codespaces/setting-up-your-project-for-codespaces/adding-a-dev-container-configuration/setting-up-your-php-project-for-codespaces.md @@ -166,7 +166,7 @@ With your dev container configuration added and a basic understanding of what ev ## Step 4: Run your application -In the previous section, you used the `postCreateCommand` to install a set of packages via the `composer install` command. With the dependencies now installed, you can run the application. However, in this scenario we first need to tweak the ports that Apache will listen on. By default, it is configured to use port 80, but in Codespaces, that port is not available -- so we will use port 8080 instead. +In the previous section, you used the `postCreateCommand` to install a set of packages via the `composer install` command. With the dependencies now installed, you can run the application. However, in this scenario we first need to change the ports that Apache will listen on. We're forwarding port 8080, so we'll instruct Apache to use this port rather than the default port 80. 1. In the Terminal of your codespace, enter `sudo sed -i 's/Listen 80$//' /etc/apache2/ports.conf`. From 757f2db6b7a01b56d565d2a1faf771fd0a307103 Mon Sep 17 00:00:00 2001 From: Garrett W Date: Mon, 24 Jul 2023 13:11:44 -0500 Subject: [PATCH 08/10] change formatting of terminal commands Co-authored-by: hubwriter --- ...tting-up-your-php-project-for-codespaces.md | 18 +++++++++++++++--- 1 file changed, 15 insertions(+), 3 deletions(-) diff --git a/content/codespaces/setting-up-your-project-for-codespaces/adding-a-dev-container-configuration/setting-up-your-php-project-for-codespaces.md b/content/codespaces/setting-up-your-project-for-codespaces/adding-a-dev-container-configuration/setting-up-your-php-project-for-codespaces.md index 9b6746bc28e4..a74cf4e5eac0 100644 --- a/content/codespaces/setting-up-your-project-for-codespaces/adding-a-dev-container-configuration/setting-up-your-php-project-for-codespaces.md +++ b/content/codespaces/setting-up-your-project-for-codespaces/adding-a-dev-container-configuration/setting-up-your-php-project-for-codespaces.md @@ -168,11 +168,23 @@ With your dev container configuration added and a basic understanding of what ev In the previous section, you used the `postCreateCommand` to install a set of packages via the `composer install` command. With the dependencies now installed, you can run the application. However, in this scenario we first need to change the ports that Apache will listen on. We're forwarding port 8080, so we'll instruct Apache to use this port rather than the default port 80. -1. In the Terminal of your codespace, enter `sudo sed -i 's/Listen 80$//' /etc/apache2/ports.conf`. +1. In the Terminal of your codespace, enter: -1. Still in the Terminal, enter `sudo sed -i 's/80/8080/' /etc/apache2/sites-enabled/000-default.conf`. +```shell +sudo sed -i 's/Listen 80$//' /etc/apache2/ports.conf +``` + +1. Then, enter: + +```shell +sudo sed -i 's/80/8080/' /etc/apache2/sites-enabled/000-default.conf +``` + +1. Then start the Apache control interface: -1. And finally, in the Terminal, enter `apache2ctl start`. +```shell +apache2ctl start +``` 1. When your project starts, you should see a "toast" notification message at the bottom right corner of {% data variables.product.prodname_vscode_shortname %}, telling you that your application is available on a forwarded port. To view the running application, click **Open in Browser**. From 98e7ec686b75912e1cc9f3812ed47c8a735ef8f6 Mon Sep 17 00:00:00 2001 From: Garrett W Date: Mon, 31 Jul 2023 21:06:57 +0000 Subject: [PATCH 09/10] final tweaks to get Apache working w/o complaints --- ...ting-up-your-php-project-for-codespaces.md | 30 +++++++++---------- 1 file changed, 15 insertions(+), 15 deletions(-) diff --git a/content/codespaces/setting-up-your-project-for-codespaces/adding-a-dev-container-configuration/setting-up-your-php-project-for-codespaces.md b/content/codespaces/setting-up-your-project-for-codespaces/adding-a-dev-container-configuration/setting-up-your-php-project-for-codespaces.md index a74cf4e5eac0..74ac6ee362f6 100644 --- a/content/codespaces/setting-up-your-project-for-codespaces/adding-a-dev-container-configuration/setting-up-your-php-project-for-codespaces.md +++ b/content/codespaces/setting-up-your-project-for-codespaces/adding-a-dev-container-configuration/setting-up-your-php-project-for-codespaces.md @@ -115,11 +115,11 @@ With your dev container configuration added and a basic understanding of what ev }, ``` -1. Uncomment the `postCreateCommand` property and change its value to run the command `composer install` if the `composer.json` file exists. +1. Uncomment the `postCreateCommand` property and add some text to the end to run the command `composer install` if a `composer.json` file exists. (The existing commands are just some setup procedures that allow Apache to access the files in the workspace.) ```json copy // Use 'postCreateCommand' to run commands after the container is created. - "postCreateCommand": "if [ -f composer.json ];then composer install;fi" + "postCreateCommand": "sudo chmod a+x \"$(pwd)\" && sudo rm -rf /var/www/html && sudo ln -s \"$(pwd)\" /var/www/html; if [ -f composer.json ];then composer install;fi" ``` The `devcontainer.json` file should now look similar to this, depending on which image you chose: @@ -151,7 +151,7 @@ With your dev container configuration added and a basic understanding of what ev }, // Use 'postCreateCommand' to run commands after the container is created. - "postCreateCommand": "if [ -f composer.json ];then composer install;fi" + "postCreateCommand": "sudo chmod a+x \"$(pwd)\" && sudo rm -rf /var/www/html && sudo ln -s \"$(pwd)\" /var/www/html; if [ -f composer.json ];then composer install;fi" // Uncomment to connect as root instead. More info: https://aka.ms/dev-containers-non-root. // "remoteUser": "root" @@ -162,29 +162,29 @@ With your dev container configuration added and a basic understanding of what ev {% data reusables.codespaces.rebuild-command %} {% indented_data_reference reusables.codespaces.rebuild-reason %} - After the dev container is rebuilt, and your codespace becomes available again, the `postCreateCommand` will have been run, installing your Composer dependencies, and the "Composer" extension will be available for use. + After the dev container is rebuilt, and your codespace becomes available again, the `postCreateCommand` will have been run, installing any Composer dependencies, and the "Composer" extension will be available for use. ## Step 4: Run your application -In the previous section, you used the `postCreateCommand` to install a set of packages via the `composer install` command. With the dependencies now installed, you can run the application. However, in this scenario we first need to change the ports that Apache will listen on. We're forwarding port 8080, so we'll instruct Apache to use this port rather than the default port 80. +In the previous section, you modified the `postCreateCommand` to install a set of packages via the `composer install` command. With the dependencies now installed, you can run the application. However, in this scenario we first need to change the ports that Apache will listen on. We're forwarding port 8080, so we'll instruct Apache to use this port rather than the default port 80. 1. In the Terminal of your codespace, enter: -```shell -sudo sed -i 's/Listen 80$//' /etc/apache2/ports.conf -``` + ```shell + sudo sed -i 's/Listen 80$//' /etc/apache2/ports.conf + ``` 1. Then, enter: -```shell -sudo sed -i 's/80/8080/' /etc/apache2/sites-enabled/000-default.conf -``` + ```shell + sudo sed -i 's//ServerName 127.0.0.1\n/' /etc/apache2/sites-enabled/000-default.conf + ``` -1. Then start the Apache control interface: +1. Then start Apache using its control tool: -```shell -apache2ctl start -``` + ```shell + apache2ctl start + ``` 1. When your project starts, you should see a "toast" notification message at the bottom right corner of {% data variables.product.prodname_vscode_shortname %}, telling you that your application is available on a forwarded port. To view the running application, click **Open in Browser**. From 284319550c47db7547d8ae8603984f16433f57d4 Mon Sep 17 00:00:00 2001 From: hubwriter Date: Wed, 2 Aug 2023 11:42:28 +0100 Subject: [PATCH 10/10] Add copy button to shell commands --- .../setting-up-your-php-project-for-codespaces.md | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/content/codespaces/setting-up-your-project-for-codespaces/adding-a-dev-container-configuration/setting-up-your-php-project-for-codespaces.md b/content/codespaces/setting-up-your-project-for-codespaces/adding-a-dev-container-configuration/setting-up-your-php-project-for-codespaces.md index 74ac6ee362f6..37b01885c958 100644 --- a/content/codespaces/setting-up-your-project-for-codespaces/adding-a-dev-container-configuration/setting-up-your-php-project-for-codespaces.md +++ b/content/codespaces/setting-up-your-project-for-codespaces/adding-a-dev-container-configuration/setting-up-your-php-project-for-codespaces.md @@ -170,19 +170,19 @@ In the previous section, you modified the `postCreateCommand` to install a set o 1. In the Terminal of your codespace, enter: - ```shell + ```shell copy sudo sed -i 's/Listen 80$//' /etc/apache2/ports.conf ``` 1. Then, enter: - ```shell + ```shell copy sudo sed -i 's//ServerName 127.0.0.1\n/' /etc/apache2/sites-enabled/000-default.conf ``` 1. Then start Apache using its control tool: - ```shell + ```shell copy apache2ctl start ```