Create self signed cert for webpack dev server

readme.md

SSL

The app uses SSL to work properly on mobile also on development. Webpack creates a .pem certificates but this is unstrusted in windows and you get the prompt on every resfresh.

One way to create a self signed certificate and force webpack to use locally created .pem cert and key.

1. Install "mkcert" https://github.com/FiloSottile/mkcert#windows (if needed install via Chocolatey)

2. Create a local folder somewhere outside the project, on the desktop for example

3. Generate certificate https://github.com/FiloSottile/mkcert#mkcert (use your domain names instead of example.com as they are showing in their readme)

4. Rename the files to server.pem and key.pem

5. Copy the files to /ClientApp/node_modules/webpack-dev-server/ssl/

6. Edit /ClientApp/node_modules/webpack-dev-server/lib/Server.js

Line 650: var options2 = {
          key: fs.readFileSync(path.join(__dirname, '../ssl/key.pem'), 'utf8'),
          cert: fs.readFileSync(path.join(__dirname, '../ssl/server.pem'), 'utf8')
        };
this.listeningApp = https.createServer(options2, app);

This can be done via configuration but CreateReactApp doesen't let us do it. So untill they expose the options we can use this hack locally. There ary many other hack to configure create react app but this just shows a quick workaround. You can oslo do this on the own webpack-dev-server of course. You can use any filename and path you want as long as you provide the correct path in the config object shown above.