Setup a simple website using a Namecheap domain and XAMPP

Disclaimer - I am not a web developer and I do not have any authority on creating web content. This was an exercise for me on learning how hosting works. I couldn't find a tutorial online that explained all the steps I needed to so, so I am putting together this tutorial. 

Here are the steps to setup a very simple website using xampp and a Namecheap domain.

1. Obtain your external IP address

Go to http://whatismyip.com and get "Your IP" address

Take note of the external IP address

2. Configure URL forwarding

Go to the URL forwarding section in Namecheap domain configuration. 

Now set the values for the IP Address/URL and Record type as follows - 

A (Address) - Your IP
URL Frame - http://<your_ip>:8080/mysite

URL Forwarding section in Namecheap domain configuration

3. Obtain your internal IP address

Open the command prompt window and type - ipconfig and hit enter

Identify your network adapter and take note of IPv4 Address

4. Configure port forwarding

Log into the router configuration by going to this address in the browser - http://192.168.0.1/

Go to the Port Forwarding section, and add an entry to forward HTTP traffic for port 8080

Router port forwarding configuration

5. Configure Apache to serve on port 8080

Open the Xampp control panel, and click on Configure and then on Apache (httpd.conf)

XAMPP Control Panel

This should open the config file in notepad. Change the line Listen 80 line to Listen 8080

Apache httpd.conf 

After this change is saved, restart the Apache server. The control panel should now look like this -

XAMPP Control Panel after listen port change

6. Create your website directory

Now, create a folder called mysites in the server directory. The path will be as follows - 
D:\Program Files (x86)\xampp\htdocs\mysite

mysites folder in htdocs

7. Access your website

Now try accessing in the following URL in the browser -

http://localhost:8080/mysite/

Website access on the local server

This should display the index.html in the browser

Now access your Namecheap domain. For me, its www.patchrowcester.com. This should serve the index.html page in the server directory. 

Access website using domain name