Alias Hostname

How to create an Alias for your Local Website (bye localhost!)

Tired of having localhost in your URLs? Do you want to have a more professional-looking URL in your browser? It is so easy to set up, you won’t be able to live code without it anymore! So let’s have a look, shall we?

Meh, localhost is fine…

Okay, no problem! Let me just give you the reasons why I use aliases:

  • Cleaner URLs: visually easier to see what’s going on in the URL,
  • No more configuration errors (ports, …),
  • No routing errors with a development environment closer to the production environment: you will have the exact same URLs in development and production.
    It is especially useful when working with MVC-like frameworks or WordPress, for instance.

Alright, let’s change that hostname

Changing the hostname from localhost to mywebsite.com.local is an easy 2-steps process when you are using a web server like Apache, for example. And may be reduced to step 1 otherwise.

Step 1: editing Hosts file

Open the hosts file:

// for Unix/MacOS: /etc/hosts
// for Windows: C:\Windows\System32\drivers\etc\hosts
$ sudo vim /etc/hosts

Add the IP address and hostname:

127.0.0.1    mywebsite.com.local

Save and quit:

// type Esc, then:
:x

Step 2: editing the Virtual Host file

Open the Virtual Hosts file at: /Applications/MAMP/conf/apache/extra/httpd-vhosts.conf (you can make a backup copy, just in case ;) )

Add the following:

<VirtualHost *>
	ServerName mywebsite.com.local
	ServerAlias mywebsite.com.local
	DocumentRoot "/Applications/MAMP/htdocs/mywebsite"

	<Directory "/Applications/MAMP/htdocs/mywebsite/">
		Options FollowSymLinks MultiViews
		AllowOverride All
		Order allow,deny
		allow from all
	</Directory>
</VirtualHost>

Of course, you will need to adapt the name and route to match your config.

And last but not least, make sure the httpd-vhosts.conf file is included (not commented out) in /Applications/MAMP/conf/apache/httpd.conf.

💡 Last tip: using .com.local as an extension is a safe choice, it will keep the general aesthetic of the URL, but clearly indicates the purpose of the hostname. Plus it is safe as an extension for the third-party tools you may use!

I hope it helps, feel free to buy me a coffee (or tea) to support the blog 🙂

One thought on “How to create an Alias for your Local Website (bye localhost!)

Leave a Comment

You want to leave a comment? Sweet! Please do so, but keep in mind that all comments are moderated and rel="nofollow" is in use. So no fake comment or advertisement will be approved. And don't worry, your email address won't be published. Thanks!

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>