Categories
Web Development

Running multiple websites on your local development machine

There’s no place like 127.0.0.1 or localhost. You know that you can run only one website on localhost. But what if you have multiple projects and while developing you want to run more than one at the same time? One way you can do is by using a different port for each of them so you can access your projects on
http://localhost
http://localhost:8080
http://localhost:8081 etc.

But there’s another way. You can access your web projects like real websites, which they actually are. So you can have http://mywebsite.local
http://local.mywebsite.com
http://mysecondwebsite.yash
or anything that catches your fancy.

This is possible using hosts file.

You see, when you type any URL in your browser’s address bar, the browser runs a DNS query and fetches IP address for the entered domain. Every computer has a local file called hosts file in which you can specify the IP address for a domain and if the browser (actually OS) finds a domain there, it won’t query the global name servers for the IP of the domain. So if you tell your OS that http://local.mywebsite.com is located at 127.0.0.1 then it won’t look for that domain on the world wide web and instead route the requests for that website to your local computer.

In fact, if you are using local.somesite.com – or any valid global TLD (Top Level Domain), then you can simply add an A record for the local subdomain in the domain’s DNS records and point it to 127.0.0.1.

The location of the hosts file
Windows 10 – C:\Windows\System32\Drivers\etc\hosts
Mac and Linux – /etc/hosts

Open this file in any text editor with administrator/root privileges and enter the entry for your local domain in the following format

127.0.0.1 mywebsite.local

Save the file. Now we need to purge the OS’s DNS cache.

On Windows, open a new command prompt and run
ipconfig /flushdns

On Mac, open terminal and run
sudo killall -HUP mDNSResponder

On Linux, depending on which DNS service your distro is running the command is different.
See this post for more details

This is half the work done, you have just pointed the domain to your local machine. Now you need to prepare your local web server – IIS, Apache or Nginx to handle the request.

IIS
If you have already created the website, right click on the website, select Edit bindings. Click on Add.
Select Type = http, IP Address = All Unassigned and Port= 80. Add your local domain in Host name like mywebsite.local or local.mywebsite.com and click on OK to save it.

If you have not created a website in IIS yet, create a website and specify mywebsite.local as host name while creating.

Apache/Nginx
Create a website in Apache/Nginx using their respective config files. Make sure you specify the host name as mywebsite.local. Save the config and restart apache/nginx.

Now your local webserver is ready to serve requests to http://mywebsite.local

Open http://mywebsite.local in your favourite browser and check it out.