DEV Community

Jack Darracott
Jack Darracott

Posted on

Setup a Local PHP & MySQL Development Environment using Windows Subsystem for Linux 2

#php #wsl #beginners

This post will guide you through setting up a local PHP development environment using MySQL on a Windows PC. We'll setup Windows to use WSL 2 and install the Ubuntu 20.04 LTS distribution. Then we'll install Git, PHP, Node and MySQL as well as install and configure Visual Studio Code and TablePlus.

Prerequisites

To use WSL 2, you must be running Windows 10:

  • For x64 systems: Version 1903 or higher, with Build 18362 or higher.
  • For ARM64 systems: Version 2004 or higher, with Build 19041 or higher.
  • Builds lower than 18362 do not support WSL 2. Use the Windows Update Assistant to update your version of windows.

Install WSL2

The Windows Subsystem for Linux (WSL) is a new Windows 10 feature than enables you to run native Linux command-line tools directly on Windows.

Open PowerShell as an administrator and enter the following commands:

Enable WSL

dism.exe /online /enable-feature /featurename:Microsoft-Windows-Subsystem-Linux /all /norestart
Enter fullscreen mode Exit fullscreen mode

Enable Virtual Machine Platform

dism.exe /online /enable-feature /featurename:VirtualMachinePlatform /all /norestart
Enter fullscreen mode Exit fullscreen mode

Once you've done this, you'll need to restart your PC. Then click here to download and install the Linux kernel update package.

Finally, open PowerShell as an administrator and set the default WSL version:

wsl --set-default-version 2
Enter fullscreen mode Exit fullscreen mode

Install Ubuntu 20.04 LTS

Ubuntu is a Linux distribution based on Debian and mostly composed of free and open-source software.

Open the Microsoft Store App and search for Ubuntu. Choose the 20.04 LTS Option and install.

microsoft store ubuntu 20.04 LTS

Once installed open the distribution from your programs:

ubuntu program start menu

As this is the first use of Ubuntu 20.04 LTS, you will be asked to set up a new user:

ubuntu 20.04 LTS new user

Finally, you'll need to update the Ubuntu 20.04 LTS Operating System:

Download available package information

sudo apt update
Enter fullscreen mode Exit fullscreen mode

Install available upgrades of all packages

sudo apt upgrade
Enter fullscreen mode Exit fullscreen mode

Install Git

Git is a distributed version-control system for tracking changes in source code during software development.

Install git

sudo apt-get install git-all
Enter fullscreen mode Exit fullscreen mode

Check install and version

git --version
Enter fullscreen mode Exit fullscreen mode

Install PHP

PHP is a general-purpose scripting language especially suited to web development.

Install PHP package

sudo apt install php
Enter fullscreen mode Exit fullscreen mode

Check install and version

php -v
Enter fullscreen mode Exit fullscreen mode

Install Composer

Composer is an application-level package manager for the PHP programming language that provides a standard format for managing dependencies of PHP software and required libraries.

Click here and copy the script from the downloads page:

composer download script

Paste the script into your Ubuntu 20.04 LTS terminal to download Composer. You'll then want to make Composer available globally:

sudo mv composer.phar /usr/local/bin/composer
Enter fullscreen mode Exit fullscreen mode

Check install and version

composer -V
Enter fullscreen mode Exit fullscreen mode

Install Node & NPM

Node.js is an open-source, cross-platform, back-end, JavaScript runtime environment that executes JavaScript code outside a web browser and npm is a package manager for the JavaScript programming language.

We'll use Node Version Manager(NVM) to manage Node and NPM. Use the following command to download and install:

wget -qO- https://raw.githubusercontent.com/nvm-sh/nvm/v0.37.0/install.sh | bash
Enter fullscreen mode Exit fullscreen mode

Check install and version

nvm -v
Enter fullscreen mode Exit fullscreen mode

You can then use NVM to install the latest version of node:

nvm install node
Enter fullscreen mode Exit fullscreen mode

Check install and version

node -v
Enter fullscreen mode Exit fullscreen mode 
npm -v
Enter fullscreen mode Exit fullscreen mode

Install Visual Studio Code

Visual Studio Code is a free source-code editor made by Microsoft for Windows, Linux and macOS.

The Remote - WSL extension lets you use VS Code on Windows to build Linux applications that run on the Windows Subsystem for Linux (WSL).

Click here to download and install the latest version of Visual Studio Code.

Once installed you will need to add the Remote - WSL extension:

visual studio code remote wsl extension

Once the Remote - WSL extension has been installed, you can open folders within your Ubuntu system within Visual Studio Code.

Install and Configure MySQL

Install MySql Server package

sudo apt install mysql-server
Enter fullscreen mode Exit fullscreen mode

Start the MySQL Server service

sudo service mysql start
Enter fullscreen mode Exit fullscreen mode

Open MySQL command-line client

sudo mysql
Enter fullscreen mode Exit fullscreen mode

You can now send commands to MySQL. First you will need to create a new user and assign permissions:

Create a new database user

CREATE USER 'jack'@'localhost' IDENTIFIED WITH mysql_native_password BY 'myPassword';
Enter fullscreen mode Exit fullscreen mode

Create a new application database

CREATE DATABASE MY_APP_DB;
Enter fullscreen mode Exit fullscreen mode

Give the user permissions the new application database

GRANT ALL PRIVILEGES ON MY_APP_DB.* TO 'jack'@'localhost';
Enter fullscreen mode Exit fullscreen mode

Exit the MySQL command-line client

exit;
Enter fullscreen mode Exit fullscreen mode

You can now log back into the MySQL command-line client as the user you have just created, use the newly created database and add a table.

Open MySQL command-line client

mysql -u jack -p
Enter fullscreen mode Exit fullscreen mode

Select the database you've just created

USE MY_APP_DB;
Enter fullscreen mode Exit fullscreen mode

Create a new table

CREATE TABLE users(
   id INT(6) UNSIGNED AUTO_INCREMENT PRIMARY KEY,
   name VARCHAR(30) NOT NULL,
   email VARCHAR(50)
);
Enter fullscreen mode Exit fullscreen mode

Add records to the table you've just created

INSERT INTO `users` (`name`, `email`) VALUES 
('Jack', 'jack@email.com'),
('Dave', 'dave@email.com'),
('Joey', 'joey@email.com');
Enter fullscreen mode Exit fullscreen mode

Exit the MySQL command-line client

exit;
Enter fullscreen mode Exit fullscreen mode

Install the PHP MySQL extension

sudo apt-get install php-mysql
Enter fullscreen mode Exit fullscreen mode

Install and Configure TablePlus

Click here to download the latest version of TablePlus.

Once installed open the application and select "Create a new connection..."

Enter the connection details, using the database and user you created previously:

tableplus mysql local connection details

Field Value
Name MY_APP_DB
Host 127.0.0.1
User jack
Password myPassword
Database MY_APP_DB

Test the connection then Save:

tableplus connection is okay

Once connected to the database, you'll see the records you created previously:

tableplus table view

Create a Test Application

You'll want to close any Ubuntu 20.04 LTS terminals you have open to allow any changes to take place. Once re-opened enter the following commands:

Create a new folder

mkdir my-test-application
Enter fullscreen mode Exit fullscreen mode

Change directory to the new folder

cd my-test-application
Enter fullscreen mode Exit fullscreen mode

Create a new file

touch index.php
Enter fullscreen mode Exit fullscreen mode

Open the directory in Visual Studio Code

code .
Enter fullscreen mode Exit fullscreen mode

This will open Visual Studio Code with the contents of the directory present in the workspace to the left of the screen:

visual studio wsl extension

Add the following to the index.php file:

<?php
$servername = "127.0.0.1";
$username = "jack";
$password = "myPassword";
$dbname = "MY_APP_DB";

// Create connection
$conn = new mysqli($servername, $username, $password, $dbname);
// Check connection
if ($conn->connect_error) {
  die("Connection failed: " . $conn->connect_error);
}

$sql = "SELECT id, name, email FROM users";
$result = $conn->query($sql);

if ($result->num_rows > 0) {
  // output data of each row
  while($row = $result->fetch_assoc()) {
    echo "id: " . $row["id"]. " - Name: " . $row["name"]. "<br>";
  }
} else {
  echo "0 results";
}
$conn->close();
?>
Enter fullscreen mode Exit fullscreen mode

Save the file in Visual Studio Code, then go back to your Ubuntu 20.04 LTS terminal and enter the following command:

php -S localhost:8000
Enter fullscreen mode Exit fullscreen mode

This will start a local development server. You can now open a web browser and navigate to localhost:8000.

localhost

Conclusion

You should now have everything you need to start developing on PHP. Enjoy!

Top comments (6)

Collapse
 
arslanali363 profile image
arslanali363 •

I encoutered an error once i attempt this "apt-get update"
Image description

Resolution:
/etc/resolv.conf was getting re-created for me every time. this fixed it for me:

Create a file: /etc/wsl.conf.
Put the following lines in the file
[network]
generateResolvConf = false
In a cmd window, run wsl --shutdown
Restart WSL2
Create a file: /etc/resolv.conf. If it exists, replace existing one with this new file.
Put the following lines in the file
nameserver 8.8.8.8
Repeat step 3 and 4. You will see git working fine now.

Collapse
 
habeeb_developer profile image
Habeeb Mohamed •

Thank you so much bro! simple and clean tutorial

Collapse
 
iamjonathanpumares profile image
Jonathan Pumares •

Thank you so much!
This tutorial is greatful 🚀🚀🚀

Collapse
 
thegreatfellow profile image
Shreyas Patil •

This really helped!
Thanks a lot!!

Collapse
 
ozwild profile image
Oscar Palencia •

Awesome!
Thanks for putting this together.

Collapse
 
arslanali363 profile image
arslanali363 •

Great guide, thanks

Read next

imsushant12 profile image

Conclusion of My Node.js Journey and a Sneak Peek into My Upcoming AWS Series

Sushant Gaurav -

techpulse55 profile image

Unlocking Tube Magic AI’s Potential: Features, Pricing, and Performance Review

Techpulse -

techpulse55 profile image

Unlocking Quickpix AI's Potential: Features, Pricing, and Performance Review

Techpulse -

me_bhavesh profile image

How to Verify gtag.js Implementation in GA4

Bhavesh Patel -