Install XAMPP and Microsoft Visual Studio Code on a Windows 10 PC (2022)

Some of the links in this article are "affiliate links", a link with a special tracking code. This means if you click on an affiliate link and purchase the item, we will receive an affiliate commission.

The price of the item is the same whether it is an affiliate link or not. Regardless, we only recommend products or services we believe will add value to our readers.

By using the affiliate links, you are helping support our Website, and we genuinely appreciate your support.

XAMPP

Why use XAMPP?

XAMPP allows you to make local websites on your Windows 10 PC. It provides the Apache web server, PHP, MariaDB, and phpMyAdmin.

Useful XAMPP Information

Once installed, the local website can be found at http://localhost/.

http://localhost/phpmyadmin to access phpMyAdmin.

The XAMPP dashboard can be found at http://localhost/dashboard.

C:\xampp\php\php.ini is the PHP initialization file path.

C:\xampp\php\php.exe is the PHP executable file path.

Installing XAMPP

Go to apachefriends.org in your Browser

go to apachefriends_org

Click on the XAMPP for Windows Button

Click XAMPP for Windows

The file will be downloaded.

XAMPP Installation File downloads

Click Open File

https://11714007canadainc.com/media/images/Click-Open-File.jpg
Bitnami Splash Page

You might get an antivirus warning. I have never had a problem, so I simply click Yes.

XAMPP antivirus warning

You may get a UAC warning. I have had no problem, so I simply click the OK button.

XAMPP UAC Warning

The setup wizard will start. Simply use the defaults. This usually means clicking Next many times.

XAMPP Setup Wizard Welcome
XAMPP Select Components
XAMPP Installation Folder
XAMPP Language
Bitnami for XAMPP
XAMPP Ready to Install
Welcome to XAMPP
XAMPP Unpacking Files
XAMPP Creating Uninstaller

Click Finish.

Completing the XAMPP Setup Wizard

XAMPP Setup

In order to changed the configuration of XAMPP, have XAMPP run as Administrator.

Enter xampp into Cortana.

XAMPP Set to Run as Administrator

Click on the XAMPP Control Panel app.

Click on XAMPP Control Panel App

Click on Open File Location.

Open File Location

Right-click on XAMPP Control Panel and click on Properties.

Go to XAMPP Control Panel Shortcut
Click on Properties

Click on Advanced.

XAMPP Click on Advanced

Put a checkmark next to Run as administrator, then click OK.

XAMPP Run as Administrator

To give permission for this, click Continue.

Click Continue

When the UAC appears, click Yes to all changes to your devices.

XAMPP UAC

Pin XAMPP to the taskbar. This will make starting XAMPP easier.

XAMPP Pin to Taskbar

Now, set up XAMPP’s configuration to start the servers automatically. Click on the Config button.

XAMPP Click Config

Put checkmarks for Apache and MySQL, then click Save.

XAMPP Click Apache MySQL Save

Now, quit and restart XAMPP.

XAMPP Click Quit
Start XAMPP
XAMPP UAC

Wait for the Apache and MySQL servers to start up. Wait for the server labels to turn green.

XAMPP Wait for Apache and MySQL Servers to turn Green

How to Stop XAMPP

Now that we have XAMPP running, how do we stop it when we no longer need it.

Even if XAMPP is not running, the servers themselves will be. To completely stop XAMPP and its servers, do the following.

Start XAMPP.

Stop all the servers by clicking the corresponding Stop buttons.

XAMPP Stop All Servers

Wait for the green colours to go away, then click the Quit button.

XAMPP Click Quit

XAMPP and its servers are now stopped.

Important XAMPP Information

Important XAMPP information

Microsoft Visual Studio Code

What is Microsoft Visual Studio Code?

Visual Studio Code is a streamlined code editor with support for development operations like debugging, task running, and version control. It aims to provide just the tools a developer needs for a quick code-build-debug cycle and leaves more complex workflows to fuller featured IDEs, such as Visual Studio IDE.

code.visualstudio.com

How to Install Microsoft Visual Studio Code on Windows 10

Go to https://code.visualstudio.com, in your web browser.

visit code.visualstudio.com

Click on the Download for Windows button. The installer will start to download.

Click Download

When the download is complete, the Open File link will appear. Click the Open File link.

Open File

The installer will start. Click the Run button.

Click Run

Accept the License Agreement and click the Next button. Select all the default buttons, usually this means clicking the Next button.

Accept the agreement.

I prefer to check all the Additional Icons.

Click all additional icons

Click the Install button.

Click Install

Microsoft Visual Studio Code will now install.

Preparing to install
extracting files
extracting files
creating registry entries
Creating shortcuts
Saving uninstall information

Click Finish. The installation is done! Microsoft Visual Studio Code will open.

Click Finish

I find it convenient to pin Microsoft Visual Studio Code to the Taskbar. Right-click on the VS Code icon in the taskbar and click on “Pin to taskbar”.

Pin to taskbar

Click the Get Started link.

click Get Started

Click the “open a folder” link.

click open a folder

Select a folder that will hold your VS Code files.

select a folder

Click the “Yes, I trust…” button.

click yes I trust button

Microsoft Visual Studio Code is installed!

VS Code is installed
Scroll to Top