Setup a PHP Dev Enviroment with Laravel Valet and WSL 1 (Works with Ubuntu 20.04)

DISCLAIMER: This proccess only works with WSL 1, if you try doing it with WSL 2 this won't work because AcrylicUI blocks the port 53, which is needed by WSL 2 and Hyper-V

If you are a PHP developer using Windows as your OS of preference, with the time you my find some limitations when using some features that are only available in a Linux Enviroment, long time ago I had those problems.

Microsoft since Windows 10 they did the impossible, adding Linux support through Windows Subsystems of Linux (WSL)(If you are interested, you can check this link: https://docs.microsoft.com/en-us/windows/wsl/install-win10). Having this posibility you can setup a barely similar Linux Dev Enviroment without adding a secondary OS into your PC system, through this tutorial I whill guide you on how you can have Ubuntu as your PHP Dev Enviroment using WSL.

Installing WSL

Go and press Win + R and execute: Control, this will open the old known Panel Control.

After that go to Programs, inside the next window select: Turn Windows features on or off

Within in the new window popup, search until the end of the list and check: Windows Subsystems for Linux, press OK and wait until the feature is ready.

When is done, Windows will ask to restart the machine, do it.

Installing Ubuntu

After your Windows PC has been restarted, go and search in your Windows Store:

Or go into this link https://www.microsoft.com/en-us/p/ubuntu/9nblggh4msv6?activetab=pivot:overviewtab and click Get, it will send you in the Store to install Ubuntu, and wait until it's done.

After the download is done open it and wait until the install process is complete and follow the steps indicated to finish the the Ubuntu Setup.

WSL and PHP Setup

After your new Ubuntu Installation is up n running, follow the next steps:

1.- Run sudo visudo
2.- Go and set at the end of the file ALL ALL = (root) NOPASSWD: /usr/sbin/service and <your_username> ALL=(ALL) NOPASSWD: ALL and save. This will make you don't have to give your sudo password every time you use a sudo command.
3.- Run sudo add-apt-repository ppa:ondrej/php <- This will prepare the setup to install PHP
4.- Run sudo apt-get update && sudo apt-get upgrade <- Let's update the packages available
5.- Run sudo apt-get install network-manager libnss3-tools jq xsel build-essential libssl-dev zip unzip dnsmasq nginx mysql-server php-fpm php-cli php-mysql php-sqlite3 php-intl php-zip php-xml php-curl php-mbstring redis-server php-redis php-pear php-dev pkg-config libz-dev libzip-dev libmemcached-dev libmemcached11 libmemcachedutil2 libmagickwand-dev imagemagick memcached <- This will install php, git, curl, mysql and more useful tools needed. Be patience with this one, it will take a while.

MySQL Setup

After the long previous step is done, lets prepare our MySQL setup so we can use our root user in this new dev enviroment.

1.- Run sudo usermod -d /var/lib/mysql/ mysql
2.- Run sudo service mysql start <- Enable the mysql service
3.- Run sudo mysql <- Run mysql
4.- Run ALTER USER 'root'@'localhost' IDENTIFIED WITH mysql_native_password BY '<your_password_here>';
5.- Run FLUSH PRIVILEGES;
6.- Run exit
7.- Run sudo service mysql restart

Now you can use your root user in your .env.dev.

Node Setup

Since we can need doing some JavaScript development, we shall install Node into our system. If you visit the Node page, the new LTS version is 12.x, so we are going to install this one (this can be different in the future)

1.- curl -sL https://deb.nodesource.com/setup_12.x | sudo -E bash -
2.- sudo apt-get install nodejs -y

To check if we did it well, run node -v and npm -v, this will show your current version from your system:

At this you may be wondering that we are doing any normal setup, but as Anakin Skywalker said: This is where the fun begins. We just prepared our WSL into the installation of Laravel Valet. So, let proceed:

Laravel Valet Setup

Let's install composer, is needed same as npm with JS. Let's say is the NPM of PHP:

Composer

1.- cd ~ <- I recommend doing this in our home path of your normal user, normally /home/<your_username>
2.- Run wget https://getcomposer.org/installer
3.- Run php installer
4.- Run sudo mv composer.phar /usr/local/bin/composer

Bash

1.- Run nano ~/.bash_aliases and put export PATH=~/.config/composer/vendor/bin:$PATH <- This will move any composer config to be useful globally in your system.
2.- And restart your bash with source ~/.bashrc

Valet

1.- Firstly, run and install with composer global require valeryan/valet-wsl <- This can take a while

2.- After that, we need to install a new app in the Windows side, i'm talking about Acrylic DNS Proxy. What this app does is to establish a proxy communication between Windows and Laravel Valet to make this localhost works in your Windows side. Download it and install it.

3.- Once is installed just open it, this will make the local DNS service start running in the backgroud. And we need to set up the domain .test pointed into 127.0.0.1 DNS.

Go to File > Open Acrylic Host

And at the end of the file set: 127.0.0.1 *.test then save it with Ctrl + S. Press Yes to restart the DNS service.

4.- Next step we need to set the DNS to our main Internet port on our PC, to this go to this icon and right click over it, select Open Network & Internet Settings:

Next, select Change adapter options

Selecting this option will pop up a new window with a list of every network adapter in your PC, select the one you are using to the get access into the Internet. Then right click over it and select Properties, in my case I only have one adapter:

Double click in Internet Protocol Version 4 (TCP/IPv4)

With the new window pop up, we set in the DNS section: Use the following DNS server addresses and set this primary to point to our localhost: 127.0.0.1, just like in hte following image.

Then select OK and OK to close any floating window.

And final step in this one, open CMD or Powerline and run: ipconfig /flushdns We need to reset any previous DNS cached config.

Note: With the installation of Acrylic DNS, this will set any subdomain finished as .test to be localhost only, so be aware that any normal website with the .test will no work as intended.

5.- In the WSL side (Ubuntu), run valet install. Allow any access requested (both: Private and Public).

6.- This is a important step, wherever you have your PHP main folder switch in console through it and run valet park. This will make as the default valet folder, so any project you have in there will be visible in your browser.In my case is: /mnt/d/Desarrollo/php

At this point we are ready to do any php development through WSL, to make the test, at your current directory let's make a test folder, create one with any name your want, I'll use testing and inside create an index.php file and put anything you want

If you go in your browser into testing.test, it will work and will show:

And that's it! We have our PHP running in a Ubuntu server with Windows Subsystem for Linux.

Bonus

PhpMyAdmin

I use PhpMyAdmin as a visual administrator in my dev env, so I'll guide you on how to have it with these new PHP setup.

To do this run: sudo apt install phpmyadmin php-mbstring php-gettext

Select apache2

Select Yes

Then we add our own password to PhpMyAdmin can create any schema needed in the installation.

Auto Valet Start

As a bonus, we need to add into our .bashrc these next lines:

if ! ps -C nginx >/dev/null; then
sudo service mysql start
valet start
fi
cd /mnt/d/Desarrollo/php

The if checks if valet is running in the background, in case is not running starts valet, so, anytime you open your WSL will automatically start the valet service and mostly important, you can have any amount of WSL running and this won't restart valet any time you open a new WSL window.

References:
https://laravel.com/docs/6.x/valet
https://github.com/nodesource/distributions/blob/master/README.md
https://www.digitalocean.com/community/tutorials/how-to-install-and-secure-phpmyadmin-on-ubuntu-18-04