DEV Community

Cover image for Adding https to your localhost
Nikita Makhov
Nikita Makhov

Posted on

Adding https to your localhost

Had some troubles with configuring https certificate for my fresh local install of Next.js about a week ago. Luckily, I've found a way, how to deal with it.

First of all, you need to install (if not) Homebrew. Homebrew is a package manager for Mac OS. If you have it, let's install mkcert:

brew install mkcert
Enter fullscreen mode Exit fullscreen mode

Then we need to create new local CA (Certificate Authority):

mkcert -install
Enter fullscreen mode Exit fullscreen mode

After that we'll create certificates for localhost:

mkcert localhost
Enter fullscreen mode Exit fullscreen mode

If everything is fine (usually it is), you will see something like this:

mkcert create certificate screen

Then we need to install local-ssl-proxy. The package will proxy all requests from https to http with given certificates which we generated before.

npm install -g local-ssl-proxy
Enter fullscreen mode Exit fullscreen mode

Final step. We must start local-ssl-proxy:

local-ssl-proxy --source 3010 --target 3000 --cert localhost.pem --key localhost-key.pem
Enter fullscreen mode Exit fullscreen mode

setup local-ssl-proxy screen

And then you can navigate to your server via https://localhost:3010.

This guide will especially useful for those who already uses Storyblok Beta V2. They suddenly forbade http protocol and now you can only use https. But they made great instructions, which I've transformed into note for myself to remember.

Top comments (2)

Collapse
 
Sloan, the sloth mascot
Comment deleted
Collapse
 
defite profile image
Nikita Makhov

Hit ctrl + c, I guess?