The Red Hat OpenShift Container Platform web console provides a graphical user interface to visualize your project data and perform administrative, management, and troubleshooting tasks. The web console runs as pods on the control plane nodes in the openshift-console project. It is managed by a console-operator pod. Both Administrator and Developer perspectives are supported.
Both Administrator and Developer perspectives enable you to create quick start tutorials for OpenShift Container Platform. A quick start is a guided tutorial with user tasks and is useful for getting oriented with an application, Operator, or other product offering.
The Administrator perspective enables you to view the cluster inventory, capacity, general and specific utilization information, and the stream of important events, all of which help you to simplify planning and troubleshooting tasks. Both project administrators and cluster administrators can view the Administrator perspective.
Cluster administrators can also open an embedded command-line terminal instance with the web terminal Operator in OpenShift Container Platform 4.7 and later.
Note
The default web console perspective that is shown depends on the role of the user. The Administrator perspective is displayed by default if the user is recognized as an administrator.
The Administrator perspective provides workflows specific to administrator use cases, such as the ability to:
Manage workload, storage, networking, and cluster settings.
Install and manage Operators using the Operator Hub.
Add identity providers that allow users to log in and manage user access through roles and role bindings.
View and manage a variety of advanced settings such as cluster updates, partial cluster updates, cluster Operators, custom resource definitions (CRDs), role bindings, and resource quotas.
Access and manage monitoring features such as metrics, alerts, and monitoring dashboards.
View and manage logging, metrics, and high-status information about the cluster.
Visually interact with applications, components, and services associated with the Administrator perspective in OpenShift Container Platform.
The Developer perspective offers several built-in ways to deploy applications, services, and databases. In the Developer perspective, you can:
View real-time visualization of rolling and recreating rollouts on the component.
View the application status, resource utilization, project event streaming, and quota consumption.
Share your project with others.
Troubleshoot problems with your applications by running Prometheus Query Language (PromQL) queries on your project and examining the metrics visualized on a plot. The metrics provide information about the state of a cluster and any user-defined workloads that you are monitoring.
Cluster administrators can also open an embedded command-line terminal instance in the web console in OpenShift Container Platform 4.7 and later.
Note
The default web console perspective that is shown depends on the role of the user. The Developer perspective is displayed by default if the user is recognised as a developer.
The Developer perspective provides workflows specific to developer use cases, such as the ability to:
Create and deploy applications on OpenShift Container Platform by importing existing codebases, images, and container files.
Visually interact with applications, components, and services associated with them within a project and monitor their deployment and build status.
Group components within an application and connect the components within and across applications.
Create workspaces to edit your application code using Eclipse Che.
You can use the Topology view to display applications, components, and workloads of your project. If you have no workloads in the project, the Topology view will show some links to create or import them. You can also use the Quick Search to import components directly.
You can access the Administrator and Developer perspective from the web console as follows:
Prerequisites
To access a perspective, ensure that you have logged in to the web console. Your default perspective is automatically determined by the permission of the users. The Administrator perspective is selected for users with access to all projects, while the Developer perspective is selected for users with limited access to their own projects
The OpenShift Container Platform web console is a user interface accessible from a web browser. Developers can use the web console to visualize, browse, and manage the contents of projects.
The web console runs as a pod on the control plane node. The static assets required to run the web console are served by the pod.
After you install OpenShift Container Platform using the openshift-install create cluster command, you can find the web console URL and login credentials for the installed cluster in the CLI output of the installation program. For example:
Example output
INFO Install complete!
INFO Run 'export KUBECONFIG=<your working directory>/auth/kubeconfig' to manage the cluster with 'oc', the OpenShift CLI.
INFO The cluster is ready when 'oc login -u kubeadmin -p <provided>' succeeds (wait a few minutes).
INFO Access the OpenShift web-console here: https://console-openshift-console.apps.demo1.openshift4-beta-abcorp.com
INFO Login to the console with user: kubeadmin, password: <provided>
INFO Install complete!
INFO Run 'export KUBECONFIG=<your working directory>/auth/kubeconfig' to manage the cluster with 'oc', the OpenShift CLI.
INFO The cluster is ready when 'oc login -u kubeadmin -p <provided>' succeeds (wait a few minutes).
INFO Access the OpenShift web-console here: https://console-openshift-console.apps.demo1.openshift4-beta-abcorp.com
INFO Login to the console with user: kubeadmin, password: <provided>
Copy to ClipboardCopied!Toggle word wrapToggle overflow
Use those details to log in and access the web console.
For existing clusters that you did not install, you can use oc whoami --show-console to see the web console URL.
Important
The dir parameter specifies the assets directory, which stores the manifest files, the ISO image, and the auth directory. The auth directory stores the kubeadmin-password and kubeconfig files. As a kubeadmin user, you can use the kubeconfig file to access the cluster with the following setting: export KUBECONFIG=<install_directory>/auth/kubeconfig. The kubeconfig is specific to the generated ISO image, so if the kubeconfig is set and the oc command fails, it is possible that the system did not boot with the generated ISO image. To perform debugging, during the bootstrap process, you can log in to the console as the core user by using the contents of the kubeadmin-password file.
Access the OpenShift Container Platform dashboard, which captures high-level information about the cluster, by navigating to Home → Overview from the OpenShift Container Platform web console.
The OpenShift Container Platform dashboard provides various cluster information, captured in individual dashboard cards.
The OpenShift Container Platform dashboard consists of the following cards:
Details provides a brief overview of informational cluster details.
Status include ok, error, warning, in progress, and unknown. Resources can add custom status names.
Cluster ID
Provider
Version
Cluster Inventory details number of resources and associated statuses. It is helpful when intervention is required to resolve problems, including information about:
Number of nodes
Number of pods
Persistent storage volume claims
Bare metal hosts in the cluster, listed according to their state (only available in metal3 environment)
Status helps administrators understand how cluster resources are consumed. Click on a resource to jump to a detailed page listing pods and nodes that consume the largest amount of the specified cluster resource (CPU, memory, or storage).
Cluster Utilization shows the capacity of various resources over a specified period of time, to help administrators understand the scale and frequency of high resource consumption, including information about:
CPU time
Memory allocation
Storage consumed
Network resources consumed
Pod count
Activity lists messages related to recent activity in the cluster, such as pod creation or virtual machine migration to another host.
You can view a graphical representation of available resources in the Topology view of the web console Developer perspective.
If a resource has a message about resource limitations or quotas being reached, a yellow border appears around the resource name. Click the resource to open a side panel to see the message. If the Topology view has been zoomed out, a yellow dot indicates that a message is available.
If you are using List View from the View Shortcuts menu, resources appear as a list. The Alerts column indicates if a message is available.
You can change the default preferences for your profile to meet your requirements. You can set your default project, topology view (graph or list), editing medium (form or YAML), language preferences, and resource type.
The changes made to the user preferences are automatically saved.
You can set the default user preferences for your cluster.
Procedure
Log in to the OpenShift Container Platform web console using your login credentials.
Use the masthead to access the user preferences under the user profile.
In the General section:
In the Theme field, you can set the theme that you want to work in. The console defaults to the selected theme each time you log in.
In the Perspective field, you can set the default perspective you want to be logged in to. You can select the Administrator or the Developer perspective as required. If a perspective is not selected, you are logged into the perspective you last visited.
In the Project field, select a project you want to work in. The console defaults to the project every time you log in.
In the Topology field, you can set the topology view to default to the graph or list view. If not selected, the console defaults to the last view you used.
In the Create/Edit resource method field, you can set a preference for creating or editing a resource. If both the form and YAML options are available, the console defaults to your selection.
In the Language section, select Default browser language to use the default browser language settings. Otherwise, select the language that you want to use for the console.
In the Notifications section, you can toggle display notifications created by users for specific projects on the Overview page or notification drawer.
In the Applications section:
You can view the default Resource type. For example, if the OpenShift Serverless Operator is installed, the default resource type is Serverless Deployment. Otherwise, the default resource type is Deployment.
You can select another resource type to be the default resource type from the Resource Type field.
Specify the URL of the page to load when a user logs out of the web console. If you do not specify a value, the user returns to the login page for the web console. Specifying a logoutRedirect URL allows your users to perform single logout (SLO) through the identity provider to destroy their single sign-on session.
From the Action drop-down list, select Customize, which opens the Cluster configuration page.
On the General tab, in the Quick starts section, you can select items in either the Enabled or Disabled list, and move them from one list to the other by using the arrow buttons.
To enable or disable a single quick start, click the quick start, then use the single arrow buttons to move the quick start to the appropriate list.
To enable or disable multiple quick starts at once, press Ctrl and click the quick starts you want to move. Then, use the single arrow buttons to move the quick starts to the appropriate list.
To enable or disable all quick starts at once, click the double arrow buttons to move all of the quick starts to the appropriate list.
You can customize the OpenShift Container Platform web console to set a custom logo, product name, links, notifications, and command-line downloads. This is especially helpful if you need to tailor the web console to meet specific corporate or government requirements.
You can create custom branding by adding a custom logo or custom product name. You can set both or one without the other, as these settings are independent of each other.
Prerequisites
You must have administrator privileges.
Create a file of the logo that you want to use. The logo can be a file in any common image format, including GIF, JPG, PNG, or SVG, and is constrained to a max-height of 60px. Image size must not exceed 1 MB due to constraints on the ConfigMap object size.
Procedure
Import your logo file into a config map in the openshift-config namespace:
Copy to ClipboardCopied!Toggle word wrapToggle overflow
Once the Operator configuration is updated, it will sync the custom logo config map into the console namespace, mount it to the console pod, and redeploy.
Check for success. If there are any issues, the console cluster Operator will report a Degraded status, and the console Operator configuration will also report a CustomLogoDegraded status, but with reasons like KeyOrFilenameInvalid or NoImageProvided.
To check the clusteroperator, run:
oc get clusteroperator console -o yaml
$oc get clusteroperator console -o yaml
Copy to ClipboardCopied!Toggle word wrapToggle overflow
To check the console Operator configuration, run:
oc get consoles.operator.openshift.io -o yaml
$oc get consoles.operator.openshift.io -o yaml
Copy to ClipboardCopied!Toggle word wrapToggle overflow
Valid location settings are HelpMenu, UserMenu, ApplicationMenu, and NamespaceDashboard.
To make the custom link appear in all namespaces, follow this example:
apiVersion: console.openshift.io/v1
kind: ConsoleLink
metadata:
name: namespaced-dashboard-link-for-all-namespaces
spec:
href: 'https://www.example.com'
location: NamespaceDashboard
text: This appears in all namespaces
apiVersion: console.openshift.io/v1
kind: ConsoleLink
metadata:name: namespaced-dashboard-link-for-all-namespaces
spec:href:'https://www.example.com'location: NamespaceDashboard
text: This appears in all namespaces
Copy to ClipboardCopied!Toggle word wrapToggle overflow
To make the custom link appear in only some namespaces, follow this example:
apiVersion: console.openshift.io/v1
kind: ConsoleLink
metadata:
name: namespaced-dashboard-for-some-namespaces
spec:
href: 'https://www.example.com'
location: NamespaceDashboard
# This text will appear in a box called "Launcher" under "namespace" or "project" in the web console
text: Custom Link Text
namespaceDashboard:
namespaces:
# for these specific namespaces
- my-namespace
- your-namespace
- other-namespace
apiVersion: console.openshift.io/v1
kind: ConsoleLink
metadata:name: namespaced-dashboard-for-some-namespaces
spec:href:'https://www.example.com'location: NamespaceDashboard
# This text will appear in a box called "Launcher" under "namespace" or "project" in the web consoletext: Custom Link Text
namespaceDashboard:namespaces:# for these specific namespaces- my-namespace
- your-namespace
- other-namespace
Copy to ClipboardCopied!Toggle word wrapToggle overflow
To make the custom link appear in the application menu, follow this example:
apiVersion: console.openshift.io/v1
kind: ConsoleLink
metadata:
name: application-menu-link-1
spec:
href: 'https://www.example.com'
location: ApplicationMenu
text: Link 1
applicationMenu:
section: My New Section
# image that is 24x24 in size
imageURL: https://via.placeholder.com/24
apiVersion: console.openshift.io/v1
kind: ConsoleLink
metadata:name: application-menu-link-1spec:href:'https://www.example.com'location: ApplicationMenu
text: Link 1
applicationMenu:section: My New Section
# image that is 24x24 in sizeimageURL: https://via.placeholder.com/24
Copy to ClipboardCopied!Toggle word wrapToggle overflow
For console and downloads routes, custom routes functionality uses the ingress config route configuration API. If the console custom route is set up in both the ingress config and console-operator config, then the new ingress config custom route configuration takes precedent. The route configuration with the console-operator config is deprecated.
You can customize the console route by setting the custom hostname and TLS certificate in the spec.componentRoutes field of the cluster Ingress configuration.
Prerequisites
You have logged in to the cluster as a user with administrative privileges.
You have created a secret in the openshift-config namespace containing the TLS certificate and key. This is required if the domain for the custom hostname suffix does not match the cluster domain suffix. The secret is optional if the suffix matches.
Tip
You can create a TLS secret by using the oc create secret tls command.
Procedure
Edit the cluster Ingress configuration:
oc edit ingress.config.openshift.io cluster
$oc edit ingress.config.openshift.io cluster
Copy to ClipboardCopied!Toggle word wrapToggle overflow
Set the custom hostname and optionally the serving certificate and key:
Reference to a secret in the openshift-config namespace that contains a TLS certificate (tls.crt) and key (tls.key). This is required if the domain for the custom hostname suffix does not match the cluster domain suffix. The secret is optional if the suffix matches.
Save the file to apply the changes.
Note
Add a DNS record for the custom console route that points to the application ingress load balancer.
You can customize the download route by setting the custom hostname and TLS certificate in the spec.componentRoutes field of the cluster Ingress configuration.
Prerequisites
You have logged in to the cluster as a user with administrative privileges.
You have created a secret in the openshift-config namespace containing the TLS certificate and key. This is required if the domain for the custom hostname suffix does not match the cluster domain suffix. The secret is optional if the suffix matches.
Tip
You can create a TLS secret by using the oc create secret tls command.
Procedure
Edit the cluster Ingress configuration:
oc edit ingress.config.openshift.io cluster
$oc edit ingress.config.openshift.io cluster
Copy to ClipboardCopied!Toggle word wrapToggle overflow
Set the custom hostname and optionally the serving certificate and key:
Reference to a secret in the openshift-config namespace that contains a TLS certificate (tls.crt) and key (tls.key). This is required if the domain for the custom hostname suffix does not match the cluster domain suffix. The secret is optional if the suffix matches.
Save the file to apply the changes.
Note
Add a DNS record for the custom downloads route that points to the application ingress load balancer.
Create Terms of Service information with custom login pages. Custom login pages can also be helpful if you use a third-party login provider, such as GitHub or Google, to show users a branded page that they trust and expect before being redirected to the authentication provider. You can also render custom error pages during the authentication process.
Note
Customizing the error template is limited to identity providers (IDPs) that use redirects, such as request header and OIDC-based IDPs. It does not have an effect on IDPs that use direct password authentication, such as LDAP and htpasswd.
Prerequisites
You must have administrator privileges.
Procedure
Run the following commands to create templates you can modify:
oc adm create-login-template > login.html
$oc adm create-login-template > login.html
Copy to ClipboardCopied!Toggle word wrapToggle overflow
If you are connected to a service that helps you browse your logs, but you need to generate URLs in a particular way, then you can define a template for your link.
Prerequisites
You must have administrator privileges.
Procedure
From Administration → Custom Resource Definitions, click on ConsoleExternalLogLink.
Select Instances tab
Click Create Console External Log Link and edit the file:
apiVersion: console.openshift.io/v1
kind: ConsoleExternalLogLink
metadata:
name: example
spec:
hrefTemplate: >-
https://example.com/logs?resourceName=${resourceName}&containerName=${containerName}&resourceNamespace=${resourceNamespace}&podLabels=${podLabels}
text: Example Logs
apiVersion: console.openshift.io/v1
kind: ConsoleExternalLogLink
metadata:name: example
spec:hrefTemplate:>-
https://example.com/logs?resourceName=${resourceName}&containerName=${containerName}&resourceNamespace=${resourceNamespace}&podLabels=${podLabels}text: Example Logs
Copy to ClipboardCopied!Toggle word wrapToggle overflow
From Administration → Custom Resource Definitions, click on ConsoleNotification.
Select Instances tab
Click Create Console Notification and edit the file:
apiVersion: console.openshift.io/v1
kind: ConsoleNotification
metadata:
name: example
spec:
text: This is an example notification message with an optional link.
location: BannerTop
link:
href: 'https://www.example.com'
text: Optional link text
color: '#fff'
backgroundColor: '#0088ce'
apiVersion: console.openshift.io/v1
kind: ConsoleNotification
metadata:name: example
spec:text: This is an example notification message with an optional link.
location: BannerTop
1
link:href:'https://www.example.com'text: Optional link text
color:'#fff'backgroundColor:'#0088ce'
Copy to ClipboardCopied!Toggle word wrapToggle overflow
You can configure links for downloading the CLI with custom link text and URLs, which can point directly to file packages or to an external page that provides the packages.
Prerequisites
You must have administrator privileges.
Procedure
Navigate to Administration → Custom Resource Definitions.
Select ConsoleCLIDownload from the list of Custom Resource Definitions (CRDs).
Click the YAML tab, and then make your edits:
apiVersion: console.openshift.io/v1
kind: ConsoleCLIDownload
metadata:
name: example-cli-download-links
spec:
description: |
This is an example of download links
displayName: example
links:
- href: 'https://www.example.com/public/example.tar'
text: example for linux
- href: 'https://www.example.com/public/example.mac.zip'
text: example for mac
- href: 'https://www.example.com/public/example.win.zip'
text: example for windows
apiVersion: console.openshift.io/v1
kind: ConsoleCLIDownload
metadata:name: example-cli-download-links
spec:description:|
This is an example of download linksdisplayName: example
links:-href:'https://www.example.com/public/example.tar'text: example for linux
-href:'https://www.example.com/public/example.mac.zip'text: example for mac
-href:'https://www.example.com/public/example.win.zip'text: example for windows
Copy to ClipboardCopied!Toggle word wrapToggle overflow
You can dynamically add YAML examples to any Kubernetes resources at any time.
Prerequisites
You must have cluster administrator privileges.
Procedure
From Administration → Custom Resource Definitions, click on ConsoleYAMLSample.
Click YAML and edit the file:
apiVersion: console.openshift.io/v1
kind: ConsoleYAMLSample
metadata:
name: example
spec:
targetResource:
apiVersion: batch/v1
kind: Job
title: Example Job
description: An example Job YAML sample
yaml: |
apiVersion: batch/v1
kind: Job
metadata:
name: countdown
spec:
template:
metadata:
name: countdown
spec:
containers:
- name: counter
image: centos:7
command:
- "bin/bash"
- "-c"
- "for i in 9 8 7 6 5 4 3 2 1 ; do echo $i ; done"
restartPolicy: Never
apiVersion: console.openshift.io/v1
kind: ConsoleYAMLSample
metadata:name: example
spec:targetResource:apiVersion: batch/v1
kind: Job
title: Example Job
description: An example Job YAML sample
yaml:|
apiVersion: batch/v1
kind: Job
metadata:
name: countdown
spec:
template:
metadata:
name: countdown
spec:
containers:
- name: counter
image: centos:7
command:
- "bin/bash"
- "-c"
- "for i in 9 8 7 6 5 4 3 2 1 ; do echo $i ; done"
restartPolicy: Never
Copy to ClipboardCopied!Toggle word wrapToggle overflow
Use spec.snippet to indicate that the YAML sample is not the full YAML resource definition, but a fragment that can be inserted into the existing YAML document at the user’s cursor.
The OpenShift Container Platform web console provides two perspectives by default, Administrator and Developer. You might have more perspectives available depending on installed console plugins. As a cluster administrator, you can show or hide a perspective for all users or for a specific user role. Customizing perspectives ensures that users can view only the perspectives that are applicable to their role and tasks. For example, you can hide the Administrator perspective from unprivileged users so that they cannot manage cluster resources, users, and projects. Similarly, you can show the Developer perspective to users with the developer role so that they can create, deploy, and monitor applications.
You can also customize the perspective visibility for users based on role-based access control (RBAC). For example, if you customize a perspective for monitoring purposes, which requires specific permissions, you can define that the perspective is visible only to users with required permissions.
Each perspective includes the following mandatory parameters, which you can edit in the YAML view:
id: Defines the ID of the perspective to show or hide
visibility: Defines the state of the perspective along with access review checks, if needed
state: Defines whether the perspective is enabled, disabled, or needs an access review check
Note
By default, all perspectives are enabled. When you customize the user perspective, your changes are applicable to the entire cluster.
As a cluster administrator, you have the ability to organize and manage the Developer catalog or its sub-catalogs. You can enable or disable the sub-catalog types or disable the entire developer catalog.
The developerCatalog.types object includes the following parameters that you must define in a snippet to use them in the YAML view:
state: Defines if a list of developer catalog types should be enabled or disabled.
enabled: Defines a list of developer catalog types (sub-catalogs) that are visible to users.
disabled: Defines a list of developer catalog types (sub-catalogs) that are not visible to users.
You can enable or disable the following developer catalog types (sub-catalogs) using the YAML view or the form view.
Dynamic plugins are loaded and interpreted from remote sources at runtime. One way to deliver and expose dynamic plugins to the console is through OLM Operators. The Operator creates a deployment on the platform with an HTTP server to host the plugin and exposes it using a Kubernetes service.
Dynamic plugins allow you to add custom pages and other extensions to your console user interface at runtime. The ConsolePlugin custom resource registers plugins with the console, and a cluster administrator enables plugins in the console Operator configuration.
Copy to ClipboardCopied!Toggle word wrapToggle overflow
Avoid selectors that could affect markup outside of your plugins components, such as element selectors. These are not APIs and are subject to change. Using them might break your plugin. Avoid selectors like element selectors that could affect markup outside of your plugins components.
Provide valid JavaScript Multipurpose Internet Mail Extension (MIME) type using the Content-Type response header for all assets served by your plugin web server. Each plugin deployment should include a web server that hosts the generated assets of the given plugin.
You must build your plugin with Webpack using Webpack version 5 and later.
You should prefix CSS class names with your plugin name to avoid collisions. For example, my-plugin__heading and my-plugin_\_icon.
You should maintain a consistent look, feel, and behavior with other console pages.
You should avoid selectors that could affect markup outside of your plugin components, such as element selectors. These are not APIs and are subject to change.
You must provide a valid JavaScript Multipurpose Internet Mail Extension (MIME) type using the Content-Type response header for all assets served by your plugin web server. Each plugin deployment should include a web server that hosts the generated assets of the given plugin.
When creating your plugin, follow these guidelines for using PatternFly:
Use PatternFly components and PatternFly CSS variables. Core PatternFly components are available through the SDK. Using PatternFly components and variables help your plugin look consistent in future console versions.
Use Patternfly 4.x if you are using OpenShift Container Platform versions 4.14 and earlier.
Use Patternfly 5.x if you are using OpenShift Container Platform 4.15 or later.
Avoid using other CSS libraries such as Bootstrap or Tailwind. They might conflict with PatternFly and not match the rest of the console. Plugins should only include styles that are specific to their user interfaces to be evaluated on top of base PatternFly styles. Avoid importing styles such as @patternfly/react-styles/*/.css or any styles from the @patternfly/patternfly package in your plugin.
The console application is responsible for loading base styles for all supported PatternFly version(s).
Optional: To test your plugin locally, run the OpenShift Container Platform web console in a container. You can use either Docker or Podman 3.2.0 or later.
Procedure
Prefix the name with plugin__ to avoid any naming conflicts. The plugin template uses the plugin__console-plugin-template namespace by default, and you must update when you rename your plugin for example, plugin__my-plugin. You can use the useTranslation hook, for example:
Loads all the plugin’s localization resources from the i18n namespace after the dynamic plugin during loading.
Use the format %plugin__console-plugin-template~My Label% for labels in console-extensions.json. The console replaces the value with the message for the current language from the plugin__console-plugin-template namespace. For example:
To get started using the dynamic plugin, you must set up your environment to write a new OpenShift Container Platform dynamic plugin. For an example of how to write a new plugin, see Adding a tab to the pods page.
You can run the plugin using a local development environment. The OpenShift Container Platform web console runs in a container connected to the cluster you have logged into.
Prerequisites
You must have cloned the console-plugin-template repository, which contains a template for creating plugins.
You must have Docker v3.2.0 or later or Podman v3.2.0 or later installed and running.
Procedure
Open two terminal windows.
In one terminal window, run the following command to install the dependencies for your plugin using yarn.
yarn install
$yarninstall
Copy to ClipboardCopied!Toggle word wrapToggle overflow
After installing, run the following command to start yarn.
yarn run start
$yarn run start
Copy to ClipboardCopied!Toggle word wrapToggle overflow
In another terminal window, login to the OpenShift Container Platform through the CLI.
oc login
$oc login
Copy to ClipboardCopied!Toggle word wrapToggle overflow
Run the OpenShift Container Platform web console in a container connected to the cluster you have logged into by running the following command:
yarn run start-console
$yarn run start-console
Copy to ClipboardCopied!Toggle word wrapToggle overflow
Note
The yarn run start-console command runs an amd64 image and might fail when run with Apple Silicon and Podman. You can work around it with qemu-user-static by running the following commands:
Copy to ClipboardCopied!Toggle word wrapToggle overflow
Verification
Visit localhost:9000 to view the running plugin. Inspect the value of window.SERVER_FLAGS.consolePlugins to see the list of plugins which load at runtime.
After pushing an image with your changes to a registry, you can deploy the plugin to a cluster using a Helm chart.
Prerequisites
You must have the location of the image containing the plugin that was previously pushed.
Note
You can specify additional parameters based on the needs of your plugin. The values.yaml file provides a full set of supported parameters.
Procedure
To deploy your plugin to a cluster, install a Helm chart with the name of the plugin as the Helm release name into a new namespace or an existing namespace as specified by the -n command-line option. Provide the location of the image within the plugin.image parameter by using the following command:
Copy to ClipboardCopied!Toggle word wrapToggle overflow
Where:
n <my-plugin-namespace>
Specifies an existing namespace to deploy your plugin into.
--create-namespace
Optional: If deploying to a new namespace, use this parameter.
--set plugin.image=my-plugin-image-location
Specifies the location of the image within the plugin.image parameter.
Note
If you are deploying on OpenShift Container Platform 4.10 and later, it is recommended to exclude configurations related to pod security by adding the parameter --set plugin.securityContext.enabled=false.
Optional: You can specify any additional parameters by using the set of supported parameters in the charts/openshift-console-plugin/values.yaml file.
plugin:name:""description:""image:""imagePullPolicy: IfNotPresent
replicas:2port:9443securityContext:enabled:truepodSecurityContext:enabled:truerunAsNonRoot:trueseccompProfile:type: RuntimeDefault
containerSecurityContext:enabled:trueallowPrivilegeEscalation:falsecapabilities:drop:- ALL
resources:requests:cpu: 10m
memory: 50Mi
basePath: /
certificateSecretName:""serviceAccount:create:trueannotations:{}name:""patcherServiceAccount:create:trueannotations:{}name:""jobs:patchConsoles:enabled:trueimage:"registry.redhat.io/openshift4/ose-tools-rhel8@sha256:e44074f21e0cca6464e50cb6ff934747e0bd11162ea01d522433a1a1ae116103"podSecurityContext:enabled:truerunAsNonRoot:trueseccompProfile:type: RuntimeDefault
containerSecurityContext:enabled:trueallowPrivilegeEscalation:falsecapabilities:drop:- ALL
resources:requests:cpu: 10m
memory: 50Mi
Copy to ClipboardCopied!Toggle word wrapToggle overflow
Verification
View the list of enabled plugins by navigating from Administration → Cluster Settings → Configuration → Consoleoperator.openshift.io → Console plugins or by visiting the Overview page.
Note
It can take a few minutes for the new plugin configuration to appear. If you do not see your plugin, you might need to refresh your browser if the plugin was recently enabled. If you receive any errors at runtime, check the JS console in browser developer tools to look for any errors in your plugin code.
If you need to make HTTP requests to an in-cluster service from your plugin, you can declare a service proxy in its ConsolePlugin resource by using the spec.proxy array field. The console backend exposes the /api/proxy/plugin/<plugin-name>/<proxy-alias>/<request-path>?<optional-query-parameters> endpoint to proxy the communication between the plugin and the service. A proxied request uses a service CA bundle by default. The service must use HTTPS.
Note
The plugin must use the consolefetch API to make requests from its JavaScript code or some requests might fail. For more information, see "Dynamic plugin API".
For each entry, you must specify an endpoint and alias of the proxy under the endpoint and alias fields. For the Service proxy type, you must set the endpoint type field to Service and the service must include values for the name, namespace, and port fields. For example, /api/proxy/plugin/helm/helm-charts/releases?limit=10 is a proxy request path from the helm plugin with a helm-charts service that lists ten helm releases.
If the service proxy request must contain the logged-in user’s OpenShift Container Platform access token, you must set the authorization field to UserToken.
Note
If the service proxy request does not contain the logged-in user’s OpenShift Container Platform access token, set the authorization field to None.
There are different customizations you can make to the OpenShift Container Platform web console. The following procedure adds a tab to the Pod details page as an example extension to your plugin.
Note
The OpenShift Container Platform web console runs in a container connected to the cluster you have logged into. See "Dynamic plugin development" for information to test the plugin before creating your own.
Procedure
Visit the console-plugin-template repository containing a template for creating plugins in a new tab.
Copy to ClipboardCopied!Toggle word wrapToggle overflow
Write a message to display on a new custom tab on the Pods page by creating a new file src/components/ExampleTab.tsx and adding the following script:
import * as React from 'react';
export default function ExampleTab() {
return (
<p>This is a custom tab added to a resource using a dynamic plugin.</p>
);
}
import * as React from 'react';
export default function ExampleTab() {
return (
<p>This is a custom tab added to a resource using a dynamic plugin.</p>
);
}
Copy to ClipboardCopied!Toggle word wrapToggle overflow
Install a Helm chart with the name of the plugin as the Helm release name into a new namespace or an existing namespace as specified by the -n command-line option to deploy your plugin on a cluster. Provide the location of the image within the plugin.image parameter by using the following command:
The context ID helps to narrow the scope of contributed actions to a particular area of the application. Examples include topology and helm.
filter
CodeRef<(scope: any, action: Action) ⇒ boolean>
no
A function that will filter actions based on some conditions.
scope: The scope in which actions should be provided for. A hook might be required if you want to remove the ModifyCount action from a deployment with a horizontal pod autoscaler (HPA).
This extension can be used for plugins to contribute a handler that can filter specific catalog items. For example, the plugin can contribute a filter that filters helm charts from specific provider.
Expand
Name
Value Type
Optional
Description
catalogId
string | string[]
no
The unique identifier for the catalog this provider contributes to.
type
string
no
Type ID for the catalog item type.
filter
CodeRef<(item: CatalogItem) ⇒ boolean>
no
Filters items of a specific type. Value is a function that takes CatalogItem[] and returns a subset based on the filter criteria.
This extension allows plugins to contribute a provider for a catalog item type. For example, a Helm Plugin can add a provider that fetches all the Helm Charts. This extension can also be used by other plugins to add more items to a specific catalog item type.
Expand
Name
Value Type
Optional
Description
catalogId
string | string[]
no
The unique identifier for the catalog this provider contributes to.
This extension allows plugins to contribute a new type of catalog item. For example, a Helm plugin can define a new catalog item type as HelmCharts that it wants to contribute to the Developer Catalog.
This extension allows plugins to contribute extra metadata like custom filters or groupings for any catalog item type. For example, a plugin can attach a custom filter for HelmCharts that can filter based on chart provider.
This extension identifies a resource used to manage the configuration of the cluster. A link to the resource will be added to the Administration → Cluster Settings → Configuration page.
Expand
Name
Value Type
Optional
Description
id
string
no
Unique identifier for the cluster config resource instance.
name
string
no
The name of the cluster config resource instance.
model
ExtensionK8sModel
no
The model which refers to a cluster config resource.
namespace
string
no
The namespace of the cluster config resource instance.
This extension can be used to contribute a navigation item that points to a cluster resource details page. The K8s model of that resource can be used to define the navigation item.
Expand
Name
Value Type
Optional
Description
id
string
no
A unique identifier for this item.
model
ExtensionK8sModel
no
The model for which this navigation item links to.
perspective
string
yes
The perspective ID to which this item belongs to. If not specified, contributes to the default perspective.
section
string
yes
Navigation section to which this item belongs to. If not specified, render this item as a top-level link.
dataAttributes
{ [key: string]: string; }
yes
Adds data attributes to the DOM.
startsWith
string[]
yes
Mark this item as active when the URL starts with one of these paths.
insertBefore
string | string[]
yes
Insert this item before the item referenced here. For arrays, the first one found in order is used.
insertAfter
string | string[]
yes
Insert this item after the item referenced here. For arrays, the first one found in order is used. insertBefore takes precedence.
name
string
yes
Overrides the default name. If not supplied the name of the link will equal the plural value of the model.
This extension can be used to contribute a navigation item that points to a namespaced resource details page. The K8s model of that resource can be used to define the navigation item.
Expand
Name
Value Type
Optional
Description
id
string
no
A unique identifier for this item.
model
ExtensionK8sModel
no
The model for which this navigation item links to.
perspective
string
yes
The perspective ID to which this item belongs to. If not specified, contributes to the default perspective.
section
string
yes
Navigation section to which this item belongs to. If not specified, render this item as a top-level link.
dataAttributes
{ [key: string]: string; }
yes
Adds data attributes to the DOM.
startsWith
string[]
yes
Mark this item as active when the URL starts with one of these paths.
insertBefore
string | string[]
yes
Insert this item before the item referenced here. For arrays, the first one found in order is used.
insertAfter
string | string[]
yes
Insert this item after the item referenced here. For arrays, the first one found in order is used. insertBefore takes precedence.
name
string
yes
Overrides the default name. If not supplied the name of the link will equal the plural value of the model.
This extension allows plugins to provide a custom component (i.e., wizard or form) for specific resources, which will be rendered, when users try to create a new resource instance.
Expand
Name
Value Type
Optional
Description
model
ExtensionK8sModel
no
The model for which this create resource page will be rendered
Adds a new details item to the default resource summary on the details page.
Expand
Name
Value Type
Optional
Description
model
ExtensionK8sModel
no
The subject resource’s API group, version, and kind.
id
string
no
A unique identifier.
column
DetailsItemColumn
no
Determines if the item will appear in the 'left' or 'right' column of the resource summary on the details page. Default: 'right'
title
string
no
The details item title.
path
string
yes
An optional, fully-qualified path to a resource property to used as the details item value. Only primitive type values can be rendered directly. Use the component property to handle other data types.
An optional React component that will render the details item value.
sortWeight
number
yes
An optional sort weight, relative to all other details items in the same column. Represented by any valid JavaScriptNumber. Items in each column are sorted independently, lowest to highest. Items without sort weightsare sorted after items with sort weights.
This component can be used to register a listener function receiving telemetry events. These events include user identification, page navigation, and other application specific events. The listener may use this data for reporting and analytics purposes.
This extension can be used to add a group on the console user-preferences page. It will appear as a vertical tab option on the console user-preferences page.
Expand
Name
Value Type
Optional
Description
id
string
no
ID used to identify the user preference group.
label
string
no
The label of the user preference group
insertBefore
string
yes
ID of user preference group before which this group should be placed
insertAfter
string
yes
ID of user preference group after which this group should be placed
This extension allows plugins to contribute an add action item to the add page of developer perspective. For example, a Serverless plugin can add a new action item for adding serverless functions to the add page of developer console.
Expand
Name
Value Type
Optional
Description
id
string
no
ID used to identify the action.
label
string
no
The label of the action.
description
string
no
The description of the action.
href
string
no
The href to navigate to.
groupId
string
yes
IDs used to identify the action groups the action would belong to.
icon
CodeRef<React.ReactNode>
yes
The perspective display icon.
accessReview
AccessReviewResourceAttributes[]
yes
Optional access review to control the visibility or enablement of the action.
This extension allows plugins to contibute a group in the add page of developer console. Groups can be referenced by actions, which will be grouped together in the add action page based on their extension definition. For example, a Serverless plugin can contribute a Serverless group and together with multiple add actions.
Expand
Name
Value Type
Optional
Description
id
string
no
ID used to identify the action group
name
string
no
The title of the action group
insertBefore
string
yes
ID of action group before which this group should be placed
insertAfter
string
yes
ID of action group after which this group should be placed
This extension can be used to specify extra build environment variable fields under the builder image selector in the developer console git import form. When set, the fields will override environment variables of the same name in the build section.
Expand
Name
Value Type
Optional
Description
imageStreamName
string
no
Name of the image stream to provide custom environment variables for
Hook that provides the currently active perspective and a callback for setting the active perspective. It returns a tuple containing the current active perspective and setter callback.
React hook for consuming Console extensions with resolved CodeRef properties. This hook accepts the same argument(s) as useExtensions hook and returns an adapted list of extension instances, resolving all code references within each extension’s properties.
Initially, the hook returns an empty array. After the resolution is complete, the React component is re-rendered with the hook returning an adapted list of extensions. When the list of matching extensions changes, the resolution is restarted. The hook continues to return the previous result until the resolution completes.
The hook’s result elements are guaranteed to be referentially stable across re-renders. It returns a tuple containing a list of adapted extension instances with resolved code references, a boolean flag indicating whether the resolution is complete, and a list of errors detected during the resolution.
Example
const [navItemExtensions, navItemsResolved] = useResolvedExtensions<NavItem>(isNavItem);
// process adapted extensions and render your component
const [navItemExtensions, navItemsResolved] = useResolvedExtensions<NavItem>(isNavItem);
// process adapted extensions and render your component
Copy to ClipboardCopied!Toggle word wrapToggle overflow
Expand
Parameter Name
Description
typeGuards
A list of callbacks that each accept a dynamic plugin extension as an argument and return a boolean flag indicating whether or not the extension meets desired type constraints
A component that creates a Navigation bar for a page. Routing is handled as part of the component. console.tab/horizontalNav can be used to add additional content to any horizontal navigation.
A hook that provides a list of user-selected active TableColumns.
Example
// See implementation for more details on TableColumn type
const [activeColumns, userSettingsLoaded] = useActiveColumns({
columns,
showNamespaceOverride: false,
columnManagementID,
});
return userSettingsAreLoaded ? <VirtualizedTable columns={activeColumns} {...otherProps} /> : null
// See implementation for more details on TableColumn type
const [activeColumns, userSettingsLoaded] = useActiveColumns({
columns,
showNamespaceOverride: false,
columnManagementID,
});
return userSettingsAreLoaded ? <VirtualizedTable columns={activeColumns} {...otherProps} /> : null
Copy to ClipboardCopied!Toggle word wrapToggle overflow
Expand
Parameter Name
Description
options
Which are passed as a key-value map
\{TableColumn[]} options.columns
An array of all available TableColumns
{boolean} [options.showNamespaceOverride]
(optional) If true, a namespace column is included, regardless of column management selections
{string} [options.columnManagementID]
(optional) A unique ID used to persist and retrieve column management selections to and from user settings. Usually a group/version/kind (GVK) string for a resource.
A tuple containing the current user selected active columns (a subset of options.columns), and a boolean flag indicating whether user settings have been loaded.
// See implementation for more details on RowFilter and FilterValue types
const [staticData, filteredData, onFilterChange] = useListPageFilter(
data,
rowFilters,
staticFilters,
);
// ListPageFilter updates filter state based on user interaction and resulting filtered data can be rendered in an independent component.
return (
<>
<ListPageHeader .../>
<ListPagBody>
<ListPageFilter data={staticData} onFilterChange={onFilterChange} />
<List data={filteredData} />
</ListPageBody>
</>
)
// See implementation for more details on RowFilter and FilterValue types
const [staticData, filteredData, onFilterChange] = useListPageFilter(
data,
rowFilters,
staticFilters,
);
// ListPageFilter updates filter state based on user interaction and resulting filtered data can be rendered in an independent component.
return (
<>
<ListPageHeader .../>
<ListPagBody>
<ListPageFilter data={staticData} onFilterChange={onFilterChange} />
<List data={filteredData} />
</ListPageBody>
</>
)
Copy to ClipboardCopied!Toggle word wrapToggle overflow
Expand
Parameter Name
Description
data
An array of data points
loaded
indicates that data has loaded
onFilterChange
callback function for when filter is updated
rowFilters
(optional) An array of RowFilter elements that define the available filter options
nameFilterPlaceholder
(optional) placeholder for name filter
labelFilterPlaceholder
(optional) placeholder for label filter
hideLabelFilter
(optional) only shows the name filter instead of both name and label filter
A hook that manages filter state for the ListPageFilter component. It returns a tuple containing the data filtered by all static filters, the data filtered by all static and row filters, and a callback that updates rowFilters.
Example
// See implementation for more details on RowFilter and FilterValue types
const [staticData, filteredData, onFilterChange] = useListPageFilter(
data,
rowFilters,
staticFilters,
);
// ListPageFilter updates filter state based on user interaction and resulting filtered data can be rendered in an independent component.
return (
<>
<ListPageHeader .../>
<ListPagBody>
<ListPageFilter data={staticData} onFilterChange={onFilterChange} />
<List data={filteredData} />
</ListPageBody>
</>
)
// See implementation for more details on RowFilter and FilterValue types
const [staticData, filteredData, onFilterChange] = useListPageFilter(
data,
rowFilters,
staticFilters,
);
// ListPageFilter updates filter state based on user interaction and resulting filtered data can be rendered in an independent component.
return (
<>
<ListPageHeader .../>
<ListPagBody>
<ListPageFilter data={staticData} onFilterChange={onFilterChange} />
<List data={filteredData} />
</ListPageBody>
</>
)
Copy to ClipboardCopied!Toggle word wrapToggle overflow
Expand
Parameter Name
Description
data
An array of data points
rowFilters
(optional) An array of RowFilter elements that define the available filter options
staticFilters
(optional) An array of FilterValue elements that are statically applied to the data
Hook that retrieves the k8s model for provided K8sGroupVersionKind from redux. It returns an array with the first item as k8s model and second item as inFlight status.
Copy to ClipboardCopied!Toggle word wrapToggle overflow
Expand
Parameter Name
Description
groupVersionKind
group, version, kind of k8s resource K8sGroupVersionKind is preferred alternatively can pass reference for group, version, kind which is deprecated, i.e, group/version/kind (GVK) K8sResourceKindReference.
Hook that retrieves all current k8s models from redux. It returns an array with the first item as the list of k8s model and second item as inFlight status.
Hook that retrieves the k8s resource along with status for loaded and error. It returns an array with first item as resource(s), second item as loaded status and third item as error state if any.
Hook that retrieves the k8s resources along with their respective status for loaded and error. It returns a map where keys are as provided in initResouces and value has three properties data, loaded and error.
A custom wrapper around fetch that adds console specific headers and allows for retries and timeouts.It also validates the response status code and throws appropriate error or logs out the user if required. It returns a promise that resolves to the response.
A custom wrapper around fetch that adds console specific headers and allows for retries and timeouts. It also validates the response status code and throws appropriate error or logs out the user if required. It returns the response as a JSON object. Uses consoleFetch internally. It returns a promise that resolves to the response as JSON object.
Expand
Parameter Name
Description
url
The URL to fetch
method
The HTTP method to use. Defaults to GET
options
The options to pass to fetch
timeout
The timeout in milliseconds
cluster
The name of the cluster to make the request to. Defaults to the active cluster the user has selected
A custom wrapper around fetch that adds console specific headers and allows for retries and timeouts. It also validates the response status code and throws appropriate error or logs out the user if required. It returns the response as a text. Uses consoleFetch internally. It returns a promise that resolves to the response as text.
Expand
Parameter Name
Description
url
The URL to fetch
options
The options to pass to fetch
timeout
The timeout in milliseconds
cluster
The name of the cluster to make the request to. Defaults to the active cluster the user has selected
A function that creates impersonation and multicluster related headers for API requests using current redux state. It returns an object containing the appropriate impersonation and clustr requst headers, based on redux state.
Expand
Parameter Name
Description
targetCluster
Override the current active cluster with the provided targetCluster
It fetches a resource from the cluster, based on the provided options. If the name is provided it returns one resource else it returns all the resources matching the model. It returns a promise that resolves to the response as JSON object with a resource if the name is providedelse it returns all the resources matching the model. In case of failure, the promise gets rejected with HTTP error response.
Expand
Parameter Name
Description
options
Which are passed as key-value pairs in the map
options.model
k8s model
options.name
The name of the resource, if not provided then it looks for all the resources matching the model.
options.ns
The namespace to look into, should not be specified for cluster-scoped resources.
options.path
Appends as subpath if provided
options.queryParams
The query parameters to be included in the URL.
options.requestInit
The fetch init object to use. This can have request headers, method, redirect, etc. See Interface RequestInit for more.
It creates a resource in the cluster, based on the provided options. It returns a promise that resolves to the response of the resource created. In case of failure promise gets rejected with HTTP error response.
It updates the entire resource in the cluster, based on providedoptions. When a client needs to replace an existing resource entirely, they can use k8sUpdate. Alternatively can use k8sPatch to perform the partial update. It returns a promise that resolves to the response of the resource updated. In case of failure promise gets rejected with HTTP error response.
Expand
Parameter Name
Description
options
Which are passed as key-value pair in the map
options.model
k8s model
options.data
Payload for the k8s resource to be updated
options.ns
Namespace to look into, it should not be specified for cluster-scoped resources.
It patches any resource in the cluster, based on provided options. When a client needs to perform the partial update, they can use k8sPatch. Alternatively can use k8sUpdate to replace an existing resource entirely. See Data Tracker for more. It returns a promise that resolves to the response of the resource patched. In case of failure promise gets rejected with HTTP error response.
Expand
Parameter Name
Description
options
Which are passed as key-value pairs in the map.
options.model
k8s model
options.resource
The resource to be patched.
options.data
Only the data to be patched on existing resource with the operation, path, and value.
It deletes resources from the cluster, based on the provided model, resource. The garbage collection works based on Foreground|Background can be configured with propagationPolicy property in provided model or passed in json. It returns a promise that resolves to the response of kind Status. In case of failure promise gets rejected with HTTP error response.
Provides a group, version, and kind for a resource. It returns the group, version, kind for the provided resource. If the resource does not have an API group, group "core" is returned. If the resource has an invalid apiVersion, then it throws an Error.
Provides a group, version, and kind for a k8s model. This returns the group, version, kind for the provided model. If the model does not have an apiGroup, group "core" is returned.
Array of ReactNode rendered on the toolbar links section on top of the editor.
onChange
Callback for on code change event.
onSave
Callback called when the command CTRL / CMD + S is triggered.
ref
React reference to { editor?: IStandaloneCodeEditor }. Using the editor property, you are able to access to all methods to control the editor. For more information, visit Interface IStandaloneCodeEditor.
A lazy loaded YAML editor for Kubernetes resources with hover help and completion. The component use the YAMLEditor and add on top of it more functionality likeresource update handling, alerts, save, cancel and reload buttons, accessibility and more. Unless onSave callback is provided, the resource update is automatically handled.It should be wrapped in a React.Suspense component.
Sets up a poll to Prometheus for a single query. It returns a tuple containing the query response, a boolean flag indicating whether the response has completed, and any errors encountered during the request or post-processing of the request.
Expand
Parameter Name
Description
{PrometheusEndpoint} props.endpoint
one of the PrometheusEndpoint (label, query, range, rules, targets)
{string} [props.query]
(optional) Prometheus query string. If empty or undefined, polling is not started.
{number} [props.delay]
(optional) polling delay interval (ms)
{number} [props.endTime]
(optional) for QUERY_RANGE enpoint, end of the query range
A component to render timestamp. The timestamps are synchronized between invidual instances of the Timestamp component. The provided timestamp is formatted according to user locale.
Expand
Parameter Name
Description
timestamp
the timestamp to render. Format is expected to be ISO 8601 (used by Kubernetes), epoch timestamp, or an instance of a Date.
simple
render simple version of the component omitting icon and tooltip.
A component that renders a horizontal toolbar with a namespace dropdown menu in the leftmost position. Additional components can be passed in as children and is rendered to the right of the namespace dropdown. This component is designed to be used at the top of the page. It should be used on pages where the user needs to be able to change the active namespace, such as on pages with k8s resources.
Copy to ClipboardCopied!Toggle word wrapToggle overflow
Expand
Parameter Name
Description
onNamespaceChange
(optional) A function that is executed when a namespace option is selected. It accepts the new namespace in the form of a string as its only argument. The active namespace is updated automatically when an option is selected, but additional logic can be applied via this function. When the namespace is changed, the namespace parameter in the URL is changed from the previous namespace to the newly selected namespace.
isDisabled
(optional) A boolean flag that disables the namespace dropdown if set to true. This option only applies to the namespace dropdown and has no effect on child components.
children
(optional) Additional elements to be rendered inside the toolbar to the right of the namespace dropdown.
Creates full page ErrorBoundaryFallbackPage component to display the "Oh no! Something went wrong." message along with the stack trace and other helpful debugging information. This is to be used inconjunction with an component.
Copy to ClipboardCopied!Toggle word wrapToggle overflow
Expand
Parameter Name
Description
customDataSource
(optional) Base URL of an API endpoint that handles PromQL queries. If provided, this is used instead of the default API for fetching data.
defaultSamples
(optional) The default number of data samples plotted for each data series. If there are many data series, QueryBrowser might automatically pick a lower number of data samples than specified here.
defaultTimespan
(optional) The default timespan for the graph in milliseconds - defaults to 1,800,000 (30 minutes).
disabledSeries
(optional) Disable (do not display) data series with these exact label / value pairs.
disableZoom
(optional) Flag to disable the graph zoom controls.
filterLabels
(optional) Optionally filter the returned data series to only those that match these label / value pairs.
fixedEndTime
(optional) Set the end time for the displayed time range rather than showing data up to the current time.
formatSeriesTitle
(optional) Function that returns a string to use as the title for a single data series.
GraphLink
(optional) Component for rendering a link to another page (for example getting more information about this query).
hideControls
(optional) Flag to hide the graph controls for changing the graph timespan, and so on.
isStack
(optional) Flag to display a stacked graph instead of a line graph. If showStackedControl is set, it is still possible for the user to switch to a line graph.
namespace
(optional) If provided, data is only returned for this namespace (only series that have this namespace label).
onZoom
(optional) Callback called when the graph is zoomed.
pollInterval
(optional) If set, determines how often the graph is updated to show the latest data (in milliseconds).
queries
Array of PromQL queries to run and display the results in the graph.
showLegend
(optional) Flag to enable displaying a legend below the graph.
showStackedControl
Flag to enable displaying a graph control for switching between stacked graph mode and line graph mode.
timespan
(optional) The timespan that should be covered by the graph in milliseconds.
units
(optional) Units to display on the Y-axis and in the tooltip.
Deprecated: Use useAccessReview from @console/dynamic-plugin-sdk instead. Hook that provides allowed status about user access to a given resource. It returns the isAllowed boolean value.
Deprecated: This hook is not related to console functionality. Hook that ensures a safe asynchronnous setting of React state in case a given component could be unmounted. It returns an array with a pair of state value and its set function.
Refer to this list of troubleshooting tips if you run into issues loading your plugin.
Verify that you have enabled your plugin in the console Operator configuration and your plugin name is the output by running the following command:
oc get console.operator.openshift.io cluster -o jsonpath='{.spec.plugins}'
$oc get console.operator.openshift.io cluster -ojsonpath='{.spec.plugins}'
Copy to ClipboardCopied!Toggle word wrapToggle overflow
Verify the enabled plugins on the status card of the Overview page in the Administrator perspective. You must refresh your browser if the plugin was recently enabled.
Verify your plugin service is healthy by:
Verifying your plugin pod status is running and your containers are ready.
Verifying the service label selector matches the pod and the target port is correct.
Curl the plugin-manifest.json from the service in a terminal on the console pod or another pod on the cluster.
Verify your ConsolePlugin resource name (consolePlugin.name) matches the plugin name used in package.json.
Verify your service name, namespace, port, and path are declared correctly in the ConsolePlugin resource.
Verify your plugin service uses HTTPS and service serving certificates.
Verify any certificates or connection errors in the console pod logs.
Verify the feature flag your plugin relys on is not disabled.
Verify your plugin does not have any consolePlugin.dependencies in package.json that are not met.
This can include console version dependencies or dependencies on other plugins. Filter the JS console in your browser for your plugin’s name to see messages that are logged.
Verify there are no typos in the nav extension perspective or section IDs.
Your plugin may be loaded, but nav items missing if IDs are incorrect. Try navigating to a plugin page directly by editing the URL.
Verify there are no network policies that are blocking traffic from the console pod to your plugin service.
If necessary, adjust network policies to allow console pods in the openshift-console namespace to make requests to your service.
Verify the list of dynamic plugins to be loaded in your browser in the Console tab of the developer tools browser.
Evaluate window.SERVER_FLAGS.consolePlugins to see the dynamic plugin on the Console frontend.
You can install the web terminal by using the Web Terminal Operator listed in the OpenShift Container Platform OperatorHub. When you install the Web Terminal Operator, the custom resource definitions (CRDs) that are required for the command line configuration, such as the DevWorkspace CRD, are automatically installed. The web console creates the required resources when you open the web terminal.
In the Administrator perspective of the web console, navigate to Operators → OperatorHub.
Use the Filter by keyword box to search for the Web Terminal Operator in the catalog, and then click the Web Terminal tile.
Read the brief description about the Operator on the Web Terminal page, and then click Install.
On the Install Operator page, retain the default values for all fields.
The fast option in the Update Channel menu enables installation of the latest release of the Web Terminal Operator.
The All namespaces on the cluster option in the Installation Mode menu enables the Operator to watch and be available to all namespaces in the cluster.
The openshift-operators option in the Installed Namespace menu installs the Operator in the default openshift-operators namespace.
The Automatic option in the Approval Strategy menu ensures that the future upgrades to the Operator are handled automatically by the Operator Lifecycle Manager.
Click Install.
In the Installed Operators page, click the View Operator to verify that the Operator is listed on the Installed Operators page.
Note
The Web Terminal Operator installs the DevWorkspace Operator as a dependency.
After the Operator is installed, refresh your page to see the command-line terminal icon (
) in the masthead of the console.
You can configure timeout and image settings for the web terminal, either for your current session or for all user sessions if you are a cluster administrator.
You can launch an embedded command-line terminal instance in the web console. This terminal instance is preinstalled with common CLI tools for interacting with the cluster, such as oc, kubectl,odo, kn, tkn, helm, and subctl. It also has the context of the project you are working on and automatically logs you in using your credentials.
After the Web Terminal Operator is installed, you can access the web terminal. After the web terminal is initialized, you can use the preinstalled CLI tools like oc, kubectl, odo, kn, tkn, helm, and subctl in the web terminal. You can re-run commands by selecting them from the list of commands you have run in the terminal. These commands persist across multiple terminal sessions. The web terminal remains open until you close it or until you close the browser window or tab.
Prerequisites
You have access to an OpenShift Container Platform cluster and are logged into the web console.
The Web Terminal Operator is installed on your cluster.
Procedure
To launch the web terminal, click the command-line terminal icon (
) in the masthead of the console. A web terminal instance is displayed in the Command line terminal pane. This instance is automatically logged in with your credentials.
If a project has not been selected in the current session, select the project where the DevWorkspace CR must be created from the Project drop-down list. By default, the current project is selected.
Note
One DevWorkspace CR defines the web terminal of one user. This CR contains details about the user’s web terminal status and container image components.
The DevWorkspace CR is created only if it does not already exist.
The openshift-terminal project is the default project used for cluster administrators. They do not have the option to choose another project. The Web Terminal Operator installs the DevWorkspace Operator as a dependency.
Optional: Set the web terminal timeout for the current session:
Click Timeout.
In the field that appears, enter the timeout value.
From the drop-down list, select a timeout interval of Seconds, Minutes, Hours, or Milliseconds.
Optional: Select a custom image for the web terminal to use.
Click Image.
In the field that appears, enter the URL of the image that you want to use.
Click Start to initialize the web terminal using the selected project.
Click + to open multiple tabs within the web terminal in the console.
The web terminal might fail to start if the cluster has network policies configured. To start a web terminal instance, the Web Terminal Operator must communicate with the web terminal’s pod to verify it is running, and the OpenShift Container Platform web console needs to send information to automatically log in to the cluster within the terminal. If either step fails, the web terminal fails to start and the terminal panel is in a loading state until a context deadline exceeded error occurs.
To avoid this issue, ensure that the network policies for namespaces that are used for terminals allow ingress from the openshift-console and openshift-operators namespaces.
The following samples show NetworkPolicy objects for allowing ingress from the openshift-console and openshift-operators namespaces.
Allowing ingress from the openshift-console namespace
Uninstalling the Web Terminal Operator does not remove any of the custom resource definitions (CRDs) or managed resources that are created when the Operator is installed. For security purposes, you must manually uninstall these components. By removing these components, you save cluster resources because terminals do not idle when the Operator is uninstalled.
Uninstalling the web terminal is a two-step process:
Uninstall the Web Terminal Operator and related custom resources (CRs) that were added when you installed the Operator.
Uninstall the DevWorkspace Operator and its related custom resources that were added as a dependency of the Web Terminal Operator.
You can uninstall the web terminal by removing the Web Terminal Operator and custom resources used by the Operator.
Prerequisites
You have access to an OpenShift Container Platform cluster with cluster administrator permissions.
You have installed the oc CLI.
Procedure
In the Administrator perspective of the web console, navigate to Operators → Installed Operators.
Scroll the filter list or type a keyword into the Filter by name box to find the Web Terminal Operator.
Click the Options menu
for the Web Terminal Operator, and then select Uninstall Operator.
In the Uninstall Operator confirmation dialog box, click Uninstall to remove the Operator, Operator deployments, and pods from the cluster. The Operator stops running and no longer receives updates.
To completely uninstall the web terminal, you must also remove the DevWorkspace Operator and custom resources used by the Operator.
Important
The DevWorkspace Operator is a standalone Operator and may be required as a dependency for other Operators installed in the cluster. Follow the steps below only if you are sure that the DevWorkspace Operator is no longer needed.
Prerequisites
You have access to an OpenShift Container Platform cluster with cluster administrator permissions.
You have installed the oc CLI.
Procedure
Remove the DevWorkspace custom resources used by the Operator, along with any related Kubernetes objects:
Copy to ClipboardCopied!Toggle word wrapToggle overflow
Warning
If this step is not complete, finalizers make it difficult to fully uninstall the Operator.
Remove the CRDs used by the Operator:
Warning
The DevWorkspace Operator provides custom resource definitions (CRDs) that use conversion webhooks. Failing to remove these CRDs can cause issues in the cluster.
Copy to ClipboardCopied!Toggle word wrapToggle overflow
Note
If you remove the devworkspace-webhook-server deployment without removing the mutating and validating webhooks, you can not use oc exec commands to run commands in a container in the cluster. After you remove the webhooks you can use the oc exec commands again.
Remove any remaining services, secrets, and config maps. Depending on the installation, some resources included in the following commands may not exist in the cluster.
oc delete all --selector app.kubernetes.io/part-of=devworkspace-operator,app.kubernetes.io/name=devworkspace-webhook-server -n openshift-operators
$oc delete all --selector app.kubernetes.io/part-of=devworkspace-operator,app.kubernetes.io/name=devworkspace-webhook-server -n openshift-operators
Copy to ClipboardCopied!Toggle word wrapToggle overflow
Copy to ClipboardCopied!Toggle word wrapToggle overflow
Uninstall the DevWorkspace Operator:
In the Administrator perspective of the web console, navigate to Operators → Installed Operators.
Scroll the filter list or type a keyword into the Filter by name box to find the DevWorkspace Operator.
Click the Options menu
for the Operator, and then select Uninstall Operator.
In the Uninstall Operator confirmation dialog box, click Uninstall to remove the Operator, Operator deployments, and pods from the cluster. The Operator stops running and no longer receives updates.
Set the managementState parameter value to Removed to disable the web console. The other valid values for this parameter are Managed, which enables the console under the cluster’s control, and Unmanaged, which means that you are taking control of web console management.
If you are creating quick start tutorials for the OpenShift Container Platform web console, follow these guidelines to maintain a consistent user experience across all quick starts.
A quick start is a guided tutorial with user tasks. In the web console, you can access quick starts under the Help menu. They are especially useful for getting oriented with an application, Operator, or other product offering.
A quick start primarily consists of tasks and steps. Each task has multiple steps, and each quick start has multiple tasks. For example:
OpenShift Container Platform introduces the quick start custom resource, which is defined by a ConsoleQuickStart object. Operators and administrators can use this resource to contribute quick starts to the cluster.
Prerequisites
You must have cluster administrator privileges.
Procedure
To create a new quick start, run:
$ oc get -o yaml consolequickstart spring-with-s2i > my-quick-start.yaml
$ oc get -o yaml consolequickstart spring-with-s2i > my-quick-start.yaml
Copy to ClipboardCopied!Toggle word wrapToggle overflow
Run:
$ oc create -f my-quick-start.yaml
$ oc create -f my-quick-start.yaml
Copy to ClipboardCopied!Toggle word wrapToggle overflow
Update the YAML file using the guidance outlined in this documentation.
...
summary:
failed: Try the steps again.
success: Your Spring application is running.
title: Run the Spring application
conclusion: >-
Your Spring application is deployed and ready.
...summary:failed: Try the steps again.
success: Your Spring application is running.
title: Run the Spring application
conclusion:>-
Your Spring application is deployed and ready.
1
Copy to ClipboardCopied!Toggle word wrapToggle overflow
apiVersion: console.openshift.io/v1
kind: ConsoleQuickStart
metadata:
name: spring-with-s2i
spec:
description: 'Import a Spring Application from git, build, and deploy it onto OpenShift.'
...
apiVersion: console.openshift.io/v1
kind: ConsoleQuickStart
metadata:name: spring-with-s2i
spec:description:'Import a Spring Application from git, build, and deploy it onto OpenShift.'
1
...
Copy to ClipboardCopied!Toggle word wrapToggle overflow
apiVersion: console.openshift.io/v1
kind: ConsoleQuickStart
metadata:
name: spring-with-s2i
spec:
description: 'Import a Spring Application from git, build, and deploy it onto OpenShift.'
displayName: Get started with Spring
durationMinutes: 10
apiVersion: console.openshift.io/v1
kind: ConsoleQuickStart
metadata:name: spring-with-s2i
spec:description:'Import a Spring Application from git, build, and deploy it onto OpenShift.'displayName: Get started with Spring
1
durationMinutes:10
Copy to ClipboardCopied!Toggle word wrapToggle overflow
Viewing the durationMinutes element in the YAML file
apiVersion: console.openshift.io/v1
kind: ConsoleQuickStart
metadata:
name: spring-with-s2i
spec:
description: 'Import a Spring Application from git, build, and deploy it onto OpenShift.'
displayName: Get started with Spring
durationMinutes: 10
apiVersion: console.openshift.io/v1
kind: ConsoleQuickStart
metadata:name: spring-with-s2i
spec:description:'Import a Spring Application from git, build, and deploy it onto OpenShift.'displayName: Get started with Spring
durationMinutes:10
1
Copy to ClipboardCopied!Toggle word wrapToggle overflow
...
spec:
description: 'Import a Spring Application from git, build, and deploy it onto OpenShift.'
displayName: Get started with Spring
durationMinutes: 10
icon: >-
data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGlkPSJMYXllcl8xIiBkYXRhLW5hbWU9IkxheWVyIDEiIHZpZXdCb3g9IjAgMCAxMDI0IDEwMjQiPjxkZWZzPjxzdHlsZT4uY2xzLTF7ZmlsbDojMTUzZDNjO30uY2xzLTJ7ZmlsbDojZDhkYTlkO30uY2xzLTN7ZmlsbDojNThjMGE4O30uY2xzLTR7ZmlsbDojZmZmO30uY2xzLTV7ZmlsbDojM2Q5MTkxO308L3N0eWxlPjwvZGVmcz48dGl0bGU+c25vd2Ryb3BfaWNvbl9yZ2JfZGVmYXVsdDwvdGl0bGU+PHBhdGggY2xhc3M9ImNscy0xIiBkPSJNMTAxMi42OSw1OTNjLTExLjEyLTM4LjA3LTMxLTczLTU5LjIxLTEwMy44LTkuNS0xMS4zLTIzLjIxLTI4LjI5LTM5LjA2LTQ3Ljk0QzgzMy41MywzNDEsNzQ1LjM3LDIzNC4xOCw2NzQsMTY4Ljk0Yy01LTUuMjYtMTAuMjYtMTAuMzEtMTUuNjUtMTUuMDdhMjQ2LjQ5LDI0Ni40OSwwLDAsMC0zNi41NS0yNi44LDE4Mi41LDE4Mi41LDAsMCwwLTIwLjMtMTEuNzcsMjAxLjUzLDIwMS41MywwLDAsMC00My4xOS0xNUExNTUuMjQsMTU1LjI0LDAsMCwwLDUyOCw5NS4yYy02Ljc2LS42OC0xMS43NC0uODEtMTQuMzktLjgxaDBsLTEuNjIsMC0xLjYyLDBhMTc3LjMsMTc3LjMsMCwwLDAtMzEuNzcsMy4zNSwyMDguMjMsMjA4LjIzLDAsMCwwLTU2LjEyLDE3LjU2LDE4MSwxODEsMCwwLDAtMjAuMjcsMTEuNzUsMjQ3LjQzLDI0Ny40MywwLDAsMC0zNi41NywyNi44MUMzNjAuMjUsMTU4LjYyLDM1NSwxNjMuNjgsMzUwLDE2OWMtNzEuMzUsNjUuMjUtMTU5LjUsMTcyLTI0MC4zOSwyNzIuMjhDOTMuNzMsNDYwLjg4LDgwLDQ3Ny44Nyw3MC41Miw0ODkuMTcsNDIuMzUsNTIwLDIyLjQzLDU1NC45LDExLjMxLDU5MywuNzIsNjI5LjIyLTEuNzMsNjY3LjY5LDQsNzA3LjMxLDE1LDc4Mi40OSw1NS43OCw4NTkuMTIsMTE4LjkzLDkyMy4wOWEyMiwyMiwwLDAsMCwxNS41OSw2LjUyaDEuODNsMS44Ny0uMzJjODEuMDYtMTMuOTEsMTEwLTc5LjU3LDE0My40OC0xNTUuNiwzLjkxLTguODgsNy45NS0xOC4wNSwxMi4yLTI3LjQzcTUuNDIsOC41NCwxMS4zOSwxNi4yM2MzMS44NSw0MC45MSw3NS4xMiw2NC42NywxMzIuMzIsNzIuNjNsMTguOCwyLjYyLDQuOTUtMTguMzNjMTMuMjYtNDkuMDcsMzUuMy05MC44NSw1MC42NC0xMTYuMTksMTUuMzQsMjUuMzQsMzcuMzgsNjcuMTIsNTAuNjQsMTE2LjE5bDUsMTguMzMsMTguOC0yLjYyYzU3LjItOCwxMDAuNDctMzEuNzIsMTMyLjMyLTcyLjYzcTYtNy42OCwxMS4zOS0xNi4yM2M0LjI1LDkuMzgsOC4yOSwxOC41NSwxMi4yLDI3LjQzLDMzLjQ5LDc2LDYyLjQyLDE0MS42OSwxNDMuNDgsMTU1LjZsMS44MS4zMWgxLjg5YTIyLDIyLDAsMCwwLDE1LjU5LTYuNTJjNjMuMTUtNjQsMTAzLjk1LTE0MC42LDExNC44OS0yMTUuNzhDMTAyNS43Myw2NjcuNjksMTAyMy4yOCw2MjkuMjIsMTAxMi42OSw1OTNaIi8+PHBhdGggY2xhc3M9ImNscy0yIiBkPSJNMzY0LjE1LDE4NS4yM2MxNy44OS0xNi40LDM0LjctMzAuMTUsNDkuNzctNDAuMTFhMjEyLDIxMiwwLDAsMSw2NS45My0yNS43M0ExOTgsMTk4LDAsMCwxLDUxMiwxMTYuMjdhMTk2LjExLDE5Ni4xMSwwLDAsMSwzMiwzLjFjNC41LjkxLDkuMzYsMi4wNiwxNC41MywzLjUyLDYwLjQxLDIwLjQ4LDg0LjkyLDkxLjA1LTQ3LjQ0LDI0OC4wNi0yOC43NSwzNC4xMi0xNDAuNywxOTQuODQtMTg0LjY2LDI2OC40MmE2MzAuODYsNjMwLjg2LDAsMCwwLTMzLjIyLDU4LjMyQzI3Niw2NTUuMzQsMjY1LjQsNTk4LDI2NS40LDUyMC4yOSwyNjUuNCwzNDAuNjEsMzExLjY5LDI0MC43NCwzNjQuMTUsMTg1LjIzWiIvPjxwYXRoIGNsYXNzPSJjbHMtMyIgZD0iTTUyNy41NCwzODQuODNjODQuMDYtOTkuNywxMTYuMDYtMTc3LjI4LDk1LjIyLTIzMC43NCwxMS42Miw4LjY5LDI0LDE5LjIsMzcuMDYsMzEuMTMsNTIuNDgsNTUuNSw5OC43OCwxNTUuMzgsOTguNzgsMzM1LjA3LDAsNzcuNzEtMTAuNiwxMzUuMDUtMjcuNzcsMTc3LjRhNjI4LjczLDYyOC43MywwLDAsMC0zMy4yMy01OC4zMmMtMzktNjUuMjYtMTMxLjQ1LTE5OS0xNzEuOTMtMjUyLjI3QzUyNi4zMywzODYuMjksNTI3LDM4NS41Miw1MjcuNTQsMzg0LjgzWiIvPjxwYXRoIGNsYXNzPSJjbHMtNCIgZD0iTTEzNC41OCw5MDguMDdoLS4wNmEuMzkuMzksMCwwLDEtLjI3LS4xMWMtMTE5LjUyLTEyMS4wNy0xNTUtMjg3LjQtNDcuNTQtNDA0LjU4LDM0LjYzLTQxLjE0LDEyMC0xNTEuNiwyMDIuNzUtMjQyLjE5LTMuMTMsNy02LjEyLDE0LjI1LTguOTIsMjEuNjktMjQuMzQsNjQuNDUtMzYuNjcsMTQ0LjMyLTM2LjY3LDIzNy40MSwwLDU2LjUzLDUuNTgsMTA2LDE2LjU5LDE0Ny4xNEEzMDcuNDksMzA3LjQ5LDAsMCwwLDI4MC45MSw3MjNDMjM3LDgxNi44OCwyMTYuOTMsODkzLjkzLDEzNC41OCw5MDguMDdaIi8+PHBhdGggY2xhc3M9ImNscy01IiBkPSJNNTgzLjQzLDgxMy43OUM1NjAuMTgsNzI3LjcyLDUxMiw2NjQuMTUsNTEyLDY2NC4xNXMtNDguMTcsNjMuNTctNzEuNDMsMTQ5LjY0Yy00OC40NS02Ljc0LTEwMC45MS0yNy41Mi0xMzUuNjYtOTEuMThhNjQ1LjY4LDY0NS42OCwwLDAsMSwzOS41Ny03MS41NGwuMjEtLjMyLjE5LS4zM2MzOC02My42MywxMjYuNC0xOTEuMzcsMTY3LjEyLTI0NS42Niw0MC43MSw1NC4yOCwxMjkuMSwxODIsMTY3LjEyLDI0NS42NmwuMTkuMzMuMjEuMzJhNjQ1LjY4LDY0NS42OCwwLDAsMSwzOS41Nyw3MS41NEM2ODQuMzQsNzg2LjI3LDYzMS44OCw4MDcuMDUsNTgzLjQzLDgxMy43OVoiLz48cGF0aCBjbGFzcz0iY2xzLTQiIGQ9Ik04ODkuNzUsOTA4YS4zOS4zOSwwLDAsMS0uMjcuMTFoLS4wNkM4MDcuMDcsODkzLjkzLDc4Nyw4MTYuODgsNzQzLjA5LDcyM2EzMDcuNDksMzA3LjQ5LDAsMCwwLDIwLjQ1LTU1LjU0YzExLTQxLjExLDE2LjU5LTkwLjYxLDE2LjU5LTE0Ny4xNCwwLTkzLjA4LTEyLjMzLTE3My0zNi42Ni0yMzcuNHEtNC4yMi0xMS4xNi04LjkzLTIxLjdjODIuNzUsOTAuNTksMTY4LjEyLDIwMS4wNSwyMDIuNzUsMjQyLjE5QzEwNDQuNzksNjIwLjU2LDEwMDkuMjcsNzg2Ljg5LDg4OS43NSw5MDhaIi8+PC9zdmc+Cg==
...
...spec:description:'Import a Spring Application from git, build, and deploy it onto OpenShift.'displayName: Get started with Spring
durationMinutes:10icon:>-
...
introduction: >-
**Spring** is a Java framework for building applications based on a distributed microservices architecture.
- Spring enables easy packaging and configuration of Spring applications into a self-contained executable application which can be easily deployed as a container to OpenShift.
- Spring applications can integrate OpenShift capabilities to provide a natural "Spring on OpenShift" developer experience for both existing and net-new Spring applications. For example:
- Externalized configuration using Kubernetes ConfigMaps and integration with Spring Cloud Kubernetes
- Service discovery using Kubernetes Services
- Load balancing with Replication Controllers
- Kubernetes health probes and integration with Spring Actuator
- Metrics: Prometheus, Grafana, and integration with Spring Cloud Sleuth
- Distributed tracing with Istio & Jaeger tracing
- Developer tooling through Red Hat OpenShift and Red Hat CodeReady developer tooling to quickly scaffold new Spring projects, gain access to familiar Spring APIs in your favorite IDE, and deploy to Red Hat OpenShift
...
...introduction:>-
1
**Spring** is a Java framework for building applications based on a distributed microservices architecture.
- Spring enables easy packaging and configuration of Spring applications into a self-contained executable application which can be easily deployed as a container to OpenShift.
-Spring applications can integrate OpenShift capabilities to provide a natural "Spring on OpenShift" developer experience for both existing and net-new Spring applications. For example:- Externalized configuration using Kubernetes ConfigMaps and integration with Spring Cloud Kubernetes
- Service discovery using Kubernetes Services
- Load balancing with Replication Controllers
- Kubernetes health probes and integration with Spring Actuator
-Metrics: Prometheus, Grafana, and integration with Spring Cloud Sleuth
- Distributed tracing with Istio & Jaeger tracing
- Developer tooling through Red Hat OpenShift and Red Hat CodeReady developer tooling to quickly scaffold new Spring projects, gain access to familiar Spring APIs in your favorite IDE, and deploy to Red Hat OpenShift
...
Copy to ClipboardCopied!Toggle word wrapToggle overflow
In the YAML file, add icon: >-, then on the next line include data:image/svg+xml;base64 followed by the output from the base64 conversion. For example:
Not all quick starts should be available for everyone. The accessReviewResources section of the YAML file provides the ability to limit access to the quick start.
To only allow the user to access the quick start if they have the ability to create HelmChartRepository resources, use the following configuration:
Copy to ClipboardCopied!Toggle word wrapToggle overflow
To only allow the user to access the quick start if they have the ability to list Operator groups and package manifests, thus ability to install Operators, use the following configuration:
accessReviewResources:
- group: operators.coreos.com
resource: operatorgroups
verb: list
- group: packages.operators.coreos.com
resource: packagemanifests
verb: list
accessReviewResources:-group: operators.coreos.com
resource: operatorgroups
verb: list
-group: packages.operators.coreos.com
resource: packagemanifests
verb: list
Copy to ClipboardCopied!Toggle word wrapToggle overflow
You can execute a CLI code snippet when it is included in a quick start from the web console. To use this feature, you must first install the Web Terminal Operator. The web terminal and code snippet actions that execute in the web terminal are not present if you do not install the Web Terminal Operator. Alternatively, you can copy a code snippet to the clipboard regardless of whether you have the Web Terminal Operator installed or not.
After clicking a quick start card, a side panel slides in that introduces the quick start and lists the tasks within it.
Make your introduction content clear, concise, informative, and friendly.
State the outcome of the quick start. A user should understand the purpose of the quick start before they begin.
Give action to the user, not the quick start.
Correct example:
In this quick start, you will deploy a sample application to {product-title}.
In this quick start, you will deploy a sample application to {product-title}.
Copy to ClipboardCopied!Toggle word wrapToggle overflow
Incorrect example:
This quick start shows you how to deploy a sample application to {product-title}.
This quick start shows you how to deploy a sample application to {product-title}.
Copy to ClipboardCopied!Toggle word wrapToggle overflow
The introduction should be a maximum of four to five sentences, depending on the complexity of the feature. A long introduction can overwhelm the user.
List the quick start tasks after the introduction content, and start each task with a verb. Do not specify the number of tasks because the copy would need to be updated every time a task is added or removed.
Correct example:
Tasks to complete: Create a serverless application; Connect an event source; Force a new revision
Tasks to complete: Create a serverless application; Connect an event source; Force a new revision
Copy to ClipboardCopied!Toggle word wrapToggle overflow
Incorrect example:
You will complete these 3 tasks: Creating a serverless application; Connecting an event source; Forcing a new revision
You will complete these 3 tasks: Creating a serverless application; Connecting an event source; Forcing a new revision
Copy to ClipboardCopied!Toggle word wrapToggle overflow
After the user clicks Start, a series of steps appears that they must perform to complete the quick start.
Follow these general guidelines when writing task steps:
Use "Click" for buttons and labels. Use "Select" for checkboxes, radio buttons, and drop-down menus.
Use "Click" instead of "Click on"
Correct example:
Click OK.
Click OK.
Copy to ClipboardCopied!Toggle word wrapToggle overflow
Incorrect example:
Click on the OK button.
Click on the OK button.
Copy to ClipboardCopied!Toggle word wrapToggle overflow
Tell users how to navigate between Administrator and Developer perspectives. Even if you think a user might already be in the appropriate perspective, give them instructions on how to get there so that they are definitely where they need to be.
Examples:
Enter the Developer perspective: In the main navigation, click the dropdown menu and select Developer.
Enter the Administrator perspective: In the main navigation, click the dropdown menu and select Admin.
Enter the Developer perspective: In the main navigation, click the dropdown menu and select Developer.
Enter the Administrator perspective: In the main navigation, click the dropdown menu and select Admin.
Copy to ClipboardCopied!Toggle word wrapToggle overflow
Use the "Location, action" structure. Tell a user where to go before telling them what to do.
Correct example:
In the node.js deployment, hover over the icon.
In the node.js deployment, hover over the icon.
Copy to ClipboardCopied!Toggle word wrapToggle overflow
Incorrect example:
Hover over the icon in the node.js deployment.
Hover over the icon in the node.js deployment.
Copy to ClipboardCopied!Toggle word wrapToggle overflow
Keep your product terminology capitalization consistent.
If you must specify a menu type or list as a dropdown, write "dropdown” as one word without a hyphen.
Clearly distinguish between a user action and additional information on product functionality.
User action:
Change the time range of the dashboard by clicking the dropdown menu and selecting time range.
Change the time range of the dashboard by clicking the dropdown menu and selecting time range.
Copy to ClipboardCopied!Toggle word wrapToggle overflow
Additional information:
To look at data in a specific time frame, you can change the time range of the dashboard.
To look at data in a specific time frame, you can change the time range of the dashboard.
Copy to ClipboardCopied!Toggle word wrapToggle overflow
Avoid directional language, like "In the top-right corner, click the icon". Directional language becomes outdated every time UI layouts change. Also, a direction for desktop users might not be accurate for users with a different screen size. Instead, identify something using its name.
Correct example:
In the navigation menu, click Settings.
In the navigation menu, click Settings.
Copy to ClipboardCopied!Toggle word wrapToggle overflow
Incorrect example:
In the left-hand menu, click Settings.
In the left-hand menu, click Settings.
Copy to ClipboardCopied!Toggle word wrapToggle overflow
Do not identify items by color alone, like "Click the gray circle". Color identifiers are not useful for sight-limited users, especially colorblind users. Instead, identify an item using its name or copy, like button copy.
Correct example:
The success message indicates a connection.
The success message indicates a connection.
Copy to ClipboardCopied!Toggle word wrapToggle overflow
Incorrect example:
The message with a green icon indicates a connection.
The message with a green icon indicates a connection.
Copy to ClipboardCopied!Toggle word wrapToggle overflow
Use the second-person point of view, you, consistently:
Correct example:
Set up your environment.
Set up your environment.
Copy to ClipboardCopied!Toggle word wrapToggle overflow
Incorrect example:
Let's set up our environment.
Let's set up our environment.
Copy to ClipboardCopied!Toggle word wrapToggle overflow
After a user completes a step, a Check your work module appears. This module prompts the user to answer a yes or no question about the step results, which gives them the opportunity to review their work. For this module, you only need to write a single yes or no question.
If the user answers Yes, a check mark will appear.
If the user answers No, an error message appears with a link to relevant documentation, if necessary. The user then has the opportunity to go back and try again.
You can further customize the OpenShift Container Platform web console by adding additional capabilities to your existing workflows and integrations through products.
Cluster administrators can install Operators on clusters in the OpenShift Container Platform web console by using the OperatorHub to provide customization outside of layered products for developers. For example, the Web Terminal Operator allows you to start a web terminal in your browser with common CLI tools for interacting with the cluster.
Red Hat OpenShift Lightspeed is a generative artificial intelligence-powered virtual assistant for OpenShift Container Platform. OpenShift Lightspeed functionality uses a natural-language interface in the OpenShift Container Platform web console.
This early access program exists so that customers can provide feedback on the user experience, features and capabilities, issues encountered, and any other aspects of the product so that OpenShift Lightspeed can become more aligned with your needs when it is released and made generally available.
Red Hat OpenShift Pipelines is a cloud-native, continuous integration and continuous delivery (CI/CD) solution based on Kubernetes resources. Install the Red Hat OpenShift Pipelines Operator using the OperatorHub in the OpenShift Container Platform web console. Once the Operator is installed, you can create and modify pipeline objects on Pipelines page.
Red Hat OpenShift Serverless enables developers to create and deploy serverless, event-driven applications on OpenShift Container Platform. You can use the OpenShift Container Platform web console OperatorHub to install the OpenShift Serverless Operator.
The Red Hat Developer Hub is a platform you can use to experience a streamlined development environment. Red Hat Developer Hub is driven by a centralized software catalog, providing efficiency to your microservices and infrastructure. It enables your product team to deliver quality code without any compromises. A quick start is available for you to learn more about how to install the developer hub.
The web console provides a quick start with instructions on how to install the Red Hat Developer Hub Operator.
Prerequisites
You must be logged in to the OpenShift Container Platform web console with admin privileges.
Procedure
On the Overview page of the Administrator perspective, click Install Red Hat Developer Hub (RHDH) with an Operator in the Getting started resources tile.
A quick start pane is displayed with instructions for you to install the Red Hat Developer Hub with an Operator. Follow the quick start for instructions on how to install the Operator, create a Red Hat Developer Hub instance, and add your instance to the OpenShift Console Application menu.
Verification
You can click the Application launcher link that is displayed to verify your Application tab is available.
Red Hat, Red Hat Enterprise Linux, the Red Hat logo, the Shadowman logo, JBoss, OpenShift, Fedora, the Infinity logo, and RHCE are trademarks of Red Hat, Inc., registered in the United States and other countries.
Linux® is the registered trademark of Linus Torvalds in the United States and other countries.
Java® is a registered trademark of Oracle and/or its affiliates.
XFS® is a trademark of Silicon Graphics International Corp. or its subsidiaries in the United States and/or other countries.
MySQL® is a registered trademark of MySQL AB in the United States, the European Union and other countries.
Node.js® is an official trademark of Joyent. Red Hat Software Collections is not formally related to or endorsed by the official Joyent Node.js open source or commercial project.
The OpenStack® Word Mark and OpenStack logo are either registered trademarks/service marks or trademarks/service marks of the OpenStack Foundation, in the United States and other countries and are used with the OpenStack Foundation’s permission. We are not affiliated with, endorsed or sponsored by the OpenStack Foundation, or the OpenStack community.
All other trademarks are the property of their respective owners.
We help Red Hat users innovate and achieve their goals with our products and services with content they can trust. Explore our recent updates.
Making open source more inclusive
Red Hat is committed to replacing problematic language in our code, documentation, and web properties. For more details, see the Red Hat Blog.
About Red Hat
We deliver hardened solutions that make it easier for enterprises to work across platforms and environments, from the core datacenter to the network edge.