I'm assuming you're putting your SSL documents in `/etc/apache2/ssl`, but you can put them anywhere and replace the references in the following commands. 

## Set up localhost.conf:

Add this to `/etc/apache/ssl/localhost.conf`:

```
[req]
default_bits = 1024
distinguished_name = req_distinguished_name
req_extensions = v3_req

[req_distinguished_name]

[v3_req]
basicConstraints = CA:FALSE
keyUsage = nonRepudiation, digitalSignature, keyEncipherment
subjectAltName = @alt_names

[alt_names]
DNS.1 = localhost
```

## Commands

Run these commands:
```sh
sudo openssl genrsa -out /etc/apache2/ssl/localhost.key 2048
sudo openssl rsa -in /etc/apache2/ssl/localhost.key -out /etc/apache2/ssl/localhost.key.rsa
sudo openssl req -new -key /etc/apache2/ssl/localhost.key.rsa -subj /CN=localhost -out /etc/apache2/ssl/localhost.csr -config /etc/apache2/ssl/localhost.conf
sudo openssl x509 -req -extensions v3_req -days 3650 -in /etc/apache2/ssl/localhost.csr -signkey /etc/apache2/ssl/localhost.key.rsa -out /etc/apache2/ssl/localhost.crt -extfile /etc/apache2/ssl/localhost.conf
sudo security add-trusted-cert -d -r trustRoot -k /Library/Keychains/System.keychain /etc/apache2/ssl/localhost.crt
```
Restart Apache: `sudo apachectl restart`

Done.

## Bonus: BrowserSync works over HTTPS

The whole reason I got into this was to get browserSync to work over HTTPS. This will allow you to use browserSync in your gulpfile.js with the following added browserSync command:

```js
browserSync.init({
  https: {
    key: "/etc/apache2/ssl/localhost.key",
    cert: "/etc/apache2/ssl/localhost.crt"
  },
});
```