How do you create virtual hosts (that also use SSL) on localhost with MAMP and Apache?

Question

Suppose you have a local project at /Users/yourname/Sites/example and want to be able to use both http://example.local and https://example.local to reach it on your Mac, using MAMP (I'm using MAMP version 6.6).

Read the answer for the steps to take.

Answer 1

1) Add your custom domain to the hosts file

Open the Finder and choose the Go to folder command from the Go menu. Enter /private/etc/hosts as the path; this will open a Finder window where you will find the hosts file.

Open the hosts file and map your custom domain to 127.0.0.1 (localhost):

127.0.0.1 localhost
127.0.0.1 example.local

Now, when you visit http://example.local, the browser will redirect you to localhost and show your list of local sites (which is not what we want yet, but hey, this is just the first step).

2) Configure MAMP to use Apache's and MySql's default ports

Open MAMP, click on Preferences, then go the Ports tab. By default, MAMP uses port 8888 for Apache and 8889 for MySQL, but it gives you the option to use Apache's default port (80) as well as MySQL's default port (3306): click the 80 & 3306 button to use these ports rather than 8888 and 8889.

3) Enable virtual hosts in Apache

Go to and open the /Applications/MAMP/conf/apache/httpd.conf file. Look for this line:

# Include /Applications/MAMP/conf/apache/extra/httpd-vhosts.conf

Uncomment the line by removing the asterisk at the beginning: uncommenting the line enables virtual hosts. (If the line is already uncommented, you're good to go for this step).

4) Configure Apache to listen to port 80

While you have /Applications/MAMP/conf/apache/httpd.conf open, also look for this line:

Listen 8888

and change it to

Listen 80
Listen 443

In the previous step, you told MAMP to use port 80 for Apache, so the first line tells Apache to listen to port 80 rather than port 8888; the second line tells Apache to also listen to requests incoming on port 443: this is the port typically used by SSL connections, so it is an essential step to be able to reach your local site at https:// besides http://.

5) Create a SSL certificate for your local site

You need a SSL certificate to be able to reach your site at https://example.local as well. This can be easily done using the mkcert tool. You can read the instructions on Github, but basically it's about installing the tool, then running:

$ mkcert example.local

This generates two files: a certificate (example.local.pem) and a certificate key (example.local-key.pem).

Move these two files somewhere within your project. For example, you could create a hidden folder at the root of your project called .crt and put them in there.

6) Create a virtual host for your local site

Finally, it's time to actually create a virtual host for your local site. Go to and open the /Applications/MAMP/conf/apache/extra/httpd-vhosts.conf file and include the following:

// These first two lines tell Apache to check for virtual hosts 
// whenever a request comes in on port 80 (http://) or 443 (https://)

NameVirtualHost *:80
NameVirtualHost *:443

// This first directive tells Apache to serve the files at "/Users/yourname/Sites/example"
// whenever "http://example.local" is visited 

<VirtualHost *:80>
    ServerName example.local
    DocumentRoot "/Users/yourname/Sites/example"
</VirtualHost>

// This second directive tells Apache to serve the files at "/Users/yourname/Sites/example"
// whenever "https://example.local" is visited, and provides paths to the certificates
// we previously created 

<VirtualHost *:443>
    ServerName example.local
    DocumentRoot "/Users/yourname/Sites/example"
    SSLEngine On
    SSLCertificateFile "/Users/yourname/Sites/example/.crt/example.local.pem"
    SSLCertificateKeyFile "/Users/yourname/Sites/example/.crt/example.local-key.pem"
</VirtualHost>

That's it! Now you can view your site at both http://example.local and https://example.local

(Remember to adapt the paths to wherever your project and certificates are located though).

7) Need virtual hosts for multiple local sites?

Want to add virtual hosts for more local sites you have, eg. for a site you want to reach at http://test.local?

Go to /private/etc/hosts and add 127.0.0.1 test.local

127.0.0.1 localhost
127.0.0.1 example.local
127.0.0.1 test.local

Generate SSL certificates with mkcert test.local (like we did earlier on step 4).

Finally, update the virtual hosts file as follows:

NameVirtualHost *:80
NameVirtualHost *:443

<VirtualHost *:80>
    ServerName example.local
    DocumentRoot "/Users/yourname/Sites/example"
</VirtualHost>

<VirtualHost *:443>
    ServerName example.local
    DocumentRoot "/Users/yourname/Sites/example"
    SSLEngine On
    SSLCertificateFile "/Users/yourname/Sites/example/.crt/example.local.pem"
    SSLCertificateKeyFile "/Users/yourname/Sites/example/.crt/example.local-key.pem"
</VirtualHost>

// Basically, copy and paste the virtual hosts for the example project 
// and update the domain and paths accordingly

<VirtualHost *:80>
    ServerName test.local
    DocumentRoot "/Users/yourname/Sites/test"
</VirtualHost>

<VirtualHost *:443>
    ServerName test.local
    DocumentRoot "/Users/yourname/Sites/test"
    SSLEngine On
    SSLCertificateFile "/Users/yourname/Sites/test/.crt/test.local.pem"
    SSLCertificateKeyFile "/Users/yourname/Sites/test/.crt/test.local-key.pem"
</VirtualHost>

8) Bonus: add extra configuration to your virtual hosts

The VirtualHost directive can accept a number of extra instructions that tell Apache what to do when a certain request is received.

For instance, suppose our example project is a Node application that can be reached at http://localhost:3000, but we want to use http://example.local to access it. We would have to tell Apache to forward any request made to http://example.local to http://localhost:3000.

NameVirtualHost *:80
NameVirtualHost *:443

// This line loads a module that enables proxying (it's turned off by default)

LoadModule proxy_http_module modules/mod_proxy_http.so 

// The ProxyPass and ProxyPassReverse lines tell Apache 
// to forward the request to http:// and https://localhost:3000

<VirtualHost *:80>
    ServerName example.local
    DocumentRoot "/Users/yourname/Sites/example"
    ProxyPass / http://localhost:3000/ 
    ProxyPassReverse / http://localhost:3000/
</VirtualHost>

<VirtualHost *:443>
    ServerName example.local
    DocumentRoot "/Users/yourname/Sites/example"
    SSLEngine On
    SSLCertificateFile "/Users/yourname/Sites/example/.crt/example.local.pem"
    SSLCertificateKeyFile "/Users/yourname/Sites/example/.crt/example.local-key.pem"
    ProxyPass / http://localhost:3000/ 
    ProxyPassReverse / http://localhost:3000/
</VirtualHost>