https://store-images.s-microsoft.com/image/apps.33565.27052090-e04d-4b6a-aa82-4218b2bed741.aec956ea-e76e-4a60-b5ad-db4632a61b68.d7f13f77-16a8-487e-b556-8520d3ff4b8c
Ubuntu 22.04LTS Server VM with VSCode & Wordpress Playground
Home & Office Improvements Ltd
Ubuntu 22.04LTS Server VM with VSCode & Wordpress Playground
Home & Office Improvements Ltd
Ubuntu 22.04LTS Server VM with VSCode & Wordpress Playground
Home & Office Improvements Ltd
Home & Office Improvements HOI-VM with VSCode & WordPress Server ( open-source ) Extension Development Playground Enviroment for Wordpress Developers
Step 1: Deploying the Virtual Machine
Log in to Azure:
Go to the Azure Portal.
Enter your credentials to log in.
Create a New Virtual Machine:
In the Azure Portal, click on “Create a resource”.
Search for "Virtual Machine" and select it.
Click "Create".
Configure the Virtual Machine:
In the "Basics" tab, fill in the details such as subscription, resource group, and VM name.
Choose the region closest to you.
In the "Image" dropdown, select the custom image you created for the WordPress development environment.
Set up the size of the VM according to your needs.
Create and specify a username and password. This will be used to log into the VM.
Review and Create the VM:
Go through the remaining settings, adjusting as needed (network, management, advanced, tags).
Click "Review + create" to check your configurations.
Click "Create" to deploy your VM.
Step 2: Signing in to the VM
Access the VM:
Once the VM is deployed and running, navigate to it in the Azure Portal.
Click on "Connect" and choose "RDP" or "Bastion" based on your setup for remote access.
Use the IP address provided to connect using an RDP client (like Remote Desktop Connection in Windows).
Log in Using Credentials:
Use the username and password you set up during the VM creation process to log in.
Step 3: Using Visual Studio Code
Open VS Code:
Find and open Visual Studio Code on the VM’s desktop or application menu.
Navigate to Extensions:
Click on the Extensions icon (square icon) on the left sidebar in VS Code.
Locate the WordPress Extension:
In the Extensions view, type “WordPress” into the search field and press Enter.
Install WordPress Extension:
Find the WordPress extension (make sure it’s the correct one) and click on the 'Install' button.
Step 4: Setting Up WordPress
Open a Terminal in VS Code:
Open the integrated terminal in VS Code by going to the top menu and selecting Terminal > New Terminal.
Navigate to Your WordPress Project:
Use the command line to navigate to your WordPress project directory.
Start WordPress:
Run the command to start your local WordPress server (often something like wp server --port=8881).
Access WordPress:
Open a web browser and go to http://localhost:8881 to access your local WordPress site.