1
0
mirror of https://github.com/openshift/openshift-docs.git synced 2026-02-05 12:46:18 +01:00
Files
openshift-docs/modules/odc-creating-a-visual-connection-between-components.adoc
2024-03-15 12:39:37 +00:00

32 lines
1.8 KiB
Plaintext

// Module included in the following assemblies:
//
// * applications/connecting_applications_to_services/odc-connecting-an-application-to-a-service-using-the-developer-perspective.adoc
:_mod-docs-content-type: PROCEDURE
[id="odc-creating-a-visual-connection-between-components_{context}"]
= Creating a visual connection between components
You can depict an intent to connect application components by using the visual connector.
This procedure walks you through an example of creating a visual connection between a PostgreSQL Database service and a Spring PetClinic sample application.
.Prerequisites
* You have created and deployed a Spring PetClinic sample application by using the *Developer* perspective.
* You have created and deployed a Crunchy PostgreSQL database instance by using the *Developer* perspective. This instance has the following components: `hippo-backup`, `hippo-instance`, `hippo-repo-host`, and `hippo-pgbouncer`.
.Procedure
. In the *Developer* perspective, switch to the relevant project, for example, `my-petclinic`.
. Hover over the Spring PetClinic sample application to see a dangling arrow on the node.
+
.Visual connector
image::odc_connector.png[]
. Click and drag the arrow towards the `hippo-pgbouncer` deployment to connect the Spring PetClinic sample application with it.
. Click the `spring-petclinic` deployment to see the *Overview* panel. Under the *Details* tab, click the edit icon in the *Annotations* section to see the *Key = `app.openshift.io/connects-to`* and *Value = `[{"apiVersion":"apps/v1","kind":"Deployment","name":"hippo-pgbouncer"}]`* annotation added to the deployment.
. Optional: You can repeat these steps to establish visual connections between other applications and components you create.
+
.Connecting multiple applications
image::odc_connecting_multiple_applications.png[]