Introduction
Visual Studio Code is one of the popular source code editor which can run on desktops Installed with Windows, macOS and Linux. It can be used for building websites, web applications, software and cloud applications. It is developed by the Microsoft team. It has builtin support for languages like Java, C++, PHP, Go , Python , Node.js , .NET etc. Visual Studio Code is a lightweight program. Also with the help of VS Code’s growing community we have Extensions available and by enabling it we get additional languages, themes, debuggers, commands, and more.
Why we use Visual Studio Code ?
1. Its simple and with powerful developer tooling, like IntelliSense code completion and debugging.
2. Available in most platforms.
3. VS Code has support for Git Hub and we can make actions like diffs, commits right from the editor itself.
4. VS Code helps you be instantly productive with syntax highlighting, bracket-matching, auto-indentation, box-selection, snippets, etc and includes an interactive debugger.
5. VS Code is an open-source project and its free to use.
In this article we discuss about installing Visual Studio Code on Ubuntu 20.04 and Use it for PHP coding as Docker Image. There are multiple ways to install Visual Studio Code. So lets get started.
Browse the url https://code.visualstudio.com/download in your browser
Click the .deb button because we are installing it in Ubuntu.
The VS code package will get downloaded automatically in your Downloads folder. Go to the folder and simply double click to install from the deb file.
Ubuntu Software will open. Click the install button. If it asks for password give the login user password.
This Completes the VS code install. To open, click on the applications icon in the lower left corner of Ubuntu 20 Desktop Screen.
At the top, type Visual Studio in the Search Box to find Visual Studio Code.
Click the icon to start Visual Studio Code.
Install PHP Visual Studio Code Extension
We are going to install extension named “PHP Intelephense” . Its a PHP code intelligence for Visual Studio Code. Then only if write php codes you will have auto suggestions from VS code editer.
First Launch VS Code.
Click the icon for extensions.
Search for “PHP Intelephense” in the search menu.
Click Install and extension should be installed automatically.
Another easy way to install this extension is
Launch VS Code Quick Open (Ctrl+P), paste the following command, and press enter.
Now disable the built-in PHP Language Features extension that comes with VS Code.
To disable this extension, type @builtin php in the Extensions search box.
Then click on the settings icon for the “PHP Language Features” extension, and click the Disable option in the drop-down menu.
Reload the VS editor to apply the changes.
How to run php code ?
Lets say we write a code in php or built an app using php code, how we can see the result?. For that we need to setup a PHP Server extension in the VS code and after that integrate installed PHP,Apache packages with them. Lets get started.
Launch VS Code Quick Open (Ctrl+P), paste the following command, and press enter.
This will install the php server extension named “PHP Server”.
Now lets install PHP, Apache Linux packages as docker images in order to be able to use with PHP Server extension we enabled above.
First install docker Engine package. For that issue below commands
Update the apt package index and install packages to allow apt to use a repository over HTTPS
Add Docker’s official GPG key and Add stable repository of docker.
install the latest version of Docker Engine
Now lets install Docker Compose. Its a tool that allows us to run multi-container application environments based on definitions set in a YAML file.
Run this command to download the current stable release of Docker Compose
Apply executable permissions to the binary and symlink to default binary path
Now Test the installation by checking the version.
Now create a folder named VisualStudio-LAMP and switched to that directory
In that create a file named docker-compose.yml and a folder named DocumentRoot
In the file named docker-compose.yml add below content.
Here we are installing a docker image named php:7.3-apache , mariadb:10.5.2 and phpmyadmin.
Below Mariadb variables value can be set as per your desire.
MYSQL_ROOT_PASSWORD: “rootpwd”
MYSQL_USER: ‘testuser’
MYSQL_PASSWORD: ‘testpassword’
MYSQL_DATABASE: ‘testdb’
Also we are binding the apache, php port to 80. If your PC port 80 is already using you can use any other ports.
Additionally the phpmyadmin docker image binding port is 80.
The document root for Apache image we set as the folder ” DocumentRoot ” that we created under VisualStudio-LAMP. This can also be changed as per your wish.
Document root folder is where we put the php files for testing.
Here the mariadb and phpmyadmin docker images are usaful when your php codes need a database.
Now start the docker image using below command. Below command will download and run the docker images in the PC we are using.
Once the docker images started. Run below command to list running docker images.
Now test the php working by issuing below version check docker command.
Now create a wrapper for php in our PC by creating below executable file
Open the file and add below content.
If you have logged in to the PC as a non root user, allow the root permissions by adding below line in file /etc/sudoers
Replace the USER in above line with your own user name.
Now the test the wrapper working by issuing php command directly in your PC terminal like php -v
It will show the results like below.
Now go the php server extension in VS code and make sure set values as below. Leave other settings as it is.
PHPserver Ip : localhost
PHP server Port : 80
Once Done Go to folder VisualStudio-LAMP/DocumentRoot/ and create a php file named index.php and inside add the phpinfo variable.
Select it and right click the mouse and choose “PHP server: Server Project”
Your local browser will open and will show the result. Once the testing done use “PHP server: Stop Server “. Then only you can test another php page.
Also you can stop your docker images by issuing below command.
Also you can stop your docker images by issuing below command.
Conclusion
This concludes how to install VS Code on Ubuntu 20.04 LTS. This guide also works for many of Ubuntu’s official flavours. We hope this article is informative. Leave your comments at the comment box.
Leave A Comment