# Accessing Ports and UI

Katacoda allows ports running include the environment to be made available to users. This is designed for displaying dashboards and UI elements running inside a container.

Within the markdown for a step, use a URL shown below that will be updated when the environment is connected.

# Markdown Example

Include the following placeholders

Render port 8500: https://[[HOST_SUBDOMAIN]]-8500-[[KATACODA_HOST]].environments.katacoda.com/

Render port 80: https://[[HOST_SUBDOMAIN]]-80-[[KATACODA_HOST]].environments.katacoda.com/

Display page allowing user to select port: https://[[HOST_SUBDOMAIN]]-[[KATACODA_HOST]].environments.katacoda.com/

https://katacoda.com/scenario-examples/scenarios/placeholders

# Using Placeholders in Scripts

https://katacoda.com/scenario-examples/scenarios/placeholders

# Display Dashboard Tabs

"environment": {
  "showdashboard": true,
  "dashboards": [{"name": "Display 80", "port": 80}, {"name": "Display 8080", "port": 8080}],
}

https://katacoda.com/scenario-examples/scenarios/displaying-web-ui

# Displaying Dashboard In-line With Scenario

https://katacoda.com/scenario-examples/scenarios/dashboard-tabs-iframe

Screenshots can be included as images in the sidebar.

# Port Binding

The listening process must be configured to listen on all IPs and not just localhost or 127.0.0.1.

# Angular

With the Angular Live Development Server you can specify this using ng serve --host 0.0.0.0.

Note, with Angular Live Development Server the Host parameter is also checked. When running within Katacoda, this check should also be disabled with the following parameter.

ng serve --host 0.0.0.0 --disable-host-check

# Kubernetes

If you are using kubectl port-forward please read how to make it publicly accessible.