Creating subdomains and custom server names with MAMP

My server of choice is Apache, but I’m no web administrator, so I use MAMP a great quick install Apache, MySQL and PHP stack. Recently I have found the need for local subdomains like dev.localhost. With a local subdomain you can more accurately simulate your live environment because you can link absolutely to the root of your server. These simple directions are specific to the MAMP configuration, but the same steps can be used on any Apache WAMP and LAMP setups with the exception of the location of the configuration file, so lets get started.

Open the finder and go to:

Applications/MAMP/conf/apache/

The file you want to edit is httpd.conf, if you are not using MAMP you can search for this file and then follow the directions below.

Open the httpd.conf in the editor of your choice. Once you have it open search for “Listen 80“. Paste the example below into your config being careful to either paste over Listen 80 or do not copy the Listen 80 part from the example below. These directions are assuming a default MAMP httpd.conf. Replace username with your own username.

Listen 80

NameVirtualHost *
<VirtualHost *>
ServerName dev.localhost
DocumentRoot /Users/username/Sites/dev
<Directory />
Options FollowSymLinks
AllowOverride None
</Directory>
<Directory /Users/username/Sites/dev>
Options Indexes FollowSymLinks MultiViews
AllowOverride All
Order allow,deny
allow from all
</Directory>
</VirtualHost>

<VirtualHost *>
ServerName coolsite
DocumentRoot /Users/username/Sites/coolsite
<Directory />
Options FollowSymLinks
AllowOverride None
</Directory>
<Directory /Users/username/Sites/coolsite>
Options Indexes FollowSymLinks MultiViews
AllowOverride All
Order allow,deny
allow from all
</Directory>
</VirtualHost>

<VirtualHost *>
ServerName localhost
DocumentRoot /Users/username/Sites/
<Directory />
Options FollowSymLinks
AllowOverride None
</Directory>
<Directory /Users/username/Sites/>
Options Indexes FollowSymLinks MultiViews
AllowOverride All
Order allow,deny
allow from all
</Directory>
</VirtualHost>

So what we have here is three different server names and paths. You can use subdomains like dev.localhost or you can even use a full name like coolsite. The reason we specify localhost and point it to the root of the sites folder is so localhost still works properly when you type it in the browser.

There is one step left. Open the terminal from your Applications/Utilities directory in the finder or search for it in spotlight. You will need to edit your hosts file, I use the VI editor, but if you haven’t used VI before, I recommend using Nano instead.

Type one of the following into the terminal.

$ sudo vi /private/etc/hosts

or

$ sudo nano /private/etc/hosts

The sudo will prompt you for your password, enter it and the file should open. If you don’t use sudo and enter your password you will not be able to save your changes. You should now see your host file, look for the line 127.0.0.1 localhost. Enter the info below being careful not to change anything else in your hosts file, it may be empty or it could have something other programs or people have put in there.

127.0.0.1 localhost
127.0.0.1 dev.localhost
127.0.0.1 coolsite

As you can see these correspond with the names you entered in the httpd.conf file. Now you will need to stop and start your server via MAMP or command line. Once you have stopped and started the MAMP stack, your new server names should load when typed into the browser. This is a great way for testing your sites and in some cases may be the only way to test them. You can use any names you wish and setup as many server names as you wish.