create_certificate_for_domain.sh

#!/usr/bin/env bash
BASEDIR=$(dirname "$0")
cd "$BASEDIR"

COMMON_NAME=${1:-localhost}

SUBJECT="/C=UA/ST=None/L=None/O=None/OU=Dev/CN=$COMMON_NAME"
NUM_OF_DAYS=3650

echo -e 'authorityKeyIdentifier=keyid,issuer
basicConstraints=CA:FALSE
keyUsage = digitalSignature, nonRepudiation, keyEncipherment, dataEncipherment
subjectAltName = @alt_names

[alt_names]
DNS.1 = %%DOMAIN%%
DNS.2 = *.%%DOMAIN%%
IP.1 = 0.0.0.0' | sed s/%%DOMAIN%%/$COMMON_NAME/g> v3.ext

openssl genrsa -des3 -passout pass:x -out server.pass.key 2048
openssl rsa -passin pass:x -in server.pass.key -out server.key
openssl req -subj "$SUBJECT" -new -key server.key -out server.csr
openssl x509 -req -sha256 -extfile v3.ext -days $NUM_OF_DAYS -in server.csr -signkey server.key -out server.crt

echo "Enter root password:";
sudo security add-trusted-cert -d -r trustRoot -k /Library/Keychains/System.keychain server.crt

cp server.key server.pem
cat server.crt >> server.pem

# Clean
rm server.pass.key
rm server.csr
rm v3.ext
rm server.key

Generate self-signed certificate.md

Genearate and add to the OsX Keychain the self-signed certificate for Create React App

Usage example

For localhost and ip 0.0.0.0 by default

create_certificate_for_domain.sh

For exact domain name and ip 0.0.0.0

create_certificate_for_domain.sh domainname

Shell script is plased in the folder named 'cert' at the root of project You could change default placement and reflect changes in the package.json file

{
  "scripts": {
    "prestart": "cp ./cert/server.pem ./node_modules/webpack-dev-server/ssl/server.pem"
  }
}

package.json

{
  "scripts": {
    "prestart": "cp ./cert/server.pem ./node_modules/webpack-dev-server/ssl/server.pem"
  }
}