Ngrok in Docker Desktop and Mermaidchart

Published: Oct 13, 2025 by Isaac Johnson

I recently saw a post on TLDR DevOps about NGrok’s new Docker Hub integration and had to check it out.

The other link, that was an advert in some newsletter I was reading, was for Mermaidchart. I use the live editor often but I never really explored their SaaS offering (which does have a free tier).

Let’s start with Ngrok…

Ngrok

I know of NGrok as a good tool for quickly exposing a local service running in Linux to the web as a reverse proxy. It comes up from time to time in demos.

I was curious to see how this compared with the easy to use CLI.

Install

We can find and install it from the Dockerhub extensions

/content/images/2025/10/ngrok-01.png

Once installed, just click Open - this did not require a restart or anything

/content/images/2025/10/ngrok-02.png

You’ll need to add an Authtoken to your Ngrok account. I’m in the free tier so I can say this works just fine without having to upgrade your account.

/content/images/2025/10/ngrok-03.png

You can now see in the upper right that the Ngrok agent is running. We are in a new “Ngrok” menu that is on the left

/content/images/2025/10/ngrok-04.png

Usage

Click the “+” sign to create a new endpoint for any running container

/content/images/2025/10/ngrok-05.png

We can use a few options, but really my goal with Ngrok is to expose to the world (usually for a demo). If you have a paid plan, then you can make custom URLs (free tier just gets dynamic ones)

/content/images/2025/10/ngrok-06.png

I’ll skip the traffic policy, but it is a nice way to wrap a service with a password, for instance

/content/images/2025/10/ngrok-07.png

I can now see my URL for the containerized app running locally on this Windows host

/content/images/2025/10/ngrok-08.png

And it works just great when I test it

/content/images/2025/10/ngrok-09.png

In the menu now, we can see a few options. Let’s look at the traffic inspector

/content/images/2025/10/ngrok-10.png

Here we can see the access IPs and response codes for anyone hitting this URL

/content/images/2025/10/ngrok-11.png

The “View in Ngrok Dashboard” takes us to our service in the Ngrok Dashboard and is an easy way to pause or stop our endpoint

/content/images/2025/10/ngrok-12.png

We can “Edit” to change to internal or kubernetes or even set some of the additional settings like pooling and metadata tags

/content/images/2025/10/ngrok-13.png

And, of course, if I “delete” it just removes the endpoint - it does not affect the running container or remove it from the list

/content/images/2025/10/ngrok-14.png

Anyone still using that URL would now see:

/content/images/2025/10/ngrok-15.png

Agent view and update

In the NGrok Dashboard, we can see our agents in the Agents pane

/content/images/2025/10/ngrok-17.png

I can see it’s version, egress IP and how long ago it was created

/content/images/2025/10/ngrok-18.png

Free vs Paid

There are some limits to the free account and it is worth mentioning they have a very reasonable $10/mo plan or ($96 annual which makes it $8/mo if you go that way):

/content/images/2025/10/ngrok-16.png

It would be nice for the HTTPS support (skipping the Interstitial page) and a custom domain.

Mermaid

I often use Mermaid.live to whip up and visualize MermaidJS diagrams

/content/images/2025/10/mermaid-01.png

However, this is just one part of the full Mermaidchart.com offering.

Let’s start by creating an account

/content/images/2025/10/mermaid-02.png

There is a survey to fill out

/content/images/2025/10/mermaid-03.png

It will suggest a free trial

/content/images/2025/10/mermaid-04.png

But that does kick over to stripe to auto-bill $120 in 7days.. so I think I’ll skip that

/content/images/2025/10/mermaid-05.png

We can now kick up a new diagram

/content/images/2025/10/mermaid-06.png

It’s really easy to do some interactive updates:

We can change themes. I see a few more here than I have in the live editor

/content/images/2025/10/mermaid-08.png

I wasn’t sure what to expect for AI help. I asked it to add a review sub-process and it consumed one of my 5 credits

One thing to consider when it comes to AI is that MermaidJS is a well-known standard.

You can ask any of the AI tools to create a decent diagram:

/content/images/2025/10/mermaid-10.png

Then drop it in Mermaid.live to view it

/content/images/2025/10/mermaid-11.png

Often times the only thing I change is to check TD (Top Down) vs LR (Left Right) for orientation to see which looks more presentable

/content/images/2025/10/mermaid-12.png

You can even use the actions to download it as a PNG or SVG

/content/images/2025/10/mermaid-13.png

Summary

Today we did a quick look at two very useful offerings - NGrok by way of Docker Desktop and Mermaidchart. I will definitely be adding Ngrok in Docker Desktop to all my hosts (that use Docker desktop) as it really makes exposing containers for demos and testing super easy. The fact that it works for free-tier users like myself is a real benefit.

I was pleasantly surprised how well Mermaidchart’s UI works. I often have a MermaidJS diagram that just needs some adjustments. I’m pretty comfortable doing those by hand, but being able to drag and drop some boxes and connectors then get the code is really handy. I’m not sure I’ll use the AI features, but there are some real advantages there. Additionally, the commercial offering is just $10 so it would be in my price range if I did want to add the paid version to my tools.

ngrok proxy docker dockerdesktop mermaid mermaidjs

Have something to add? Feedback? You can use the feedback form

Isaac Johnson

Isaac Johnson

Cloud Solutions Architect

Isaac is a CSA and DevOps engineer who focuses on cloud migrations and devops processes. He also is a dad to three wonderful daughters (hence the references to Princess King sprinkled throughout the blog).

Theme built by C.S. Rhymes