# Embedding the remote console
The HTML console is a very useful tool for end-users to be able to interact with the server via the out-of-band network in an emergency or even as primary means of managing a server.

To integrate the console into an 3rd party customer portal use the following example:
[github.com/metalsoft-io/UI-console-implementation-example](https://github.com/metalsoft-io/UI-console-implementation-example#ui-console-implementation-example)
## Main components
1. **Frontend** (`console-implementation-example-ui`): A React.js-based demonstration UI designed to assist with the integration of the Guacamole client. This UI initiates a connection to the Metalsoft's Guacamole server via a proxy, enabling VNC functionalities in your application.
2. **Backend** (`console-implementation-example-backend`): A NestJS-based server responsible for retrieving the cookies required for the Guacamole client to establish a secure connection. This is critical for the successful operation of the proxy and ultimately the VNC console.
3. **Proxy** (NGINX)
Both the backend and the frontend components interact through an NGINX proxy server that serves three primary roles:
- Acts as a reverse proxy to Metalsoft's private Guacamole server, making it accessible.
- Hosts the `console-implementation-example-ui` for demonstration or testing purposes.
- Routes requests to the `console-implementation-example-backend`, facilitating cookie retrieval.
## Key Requirements:
- Both the backend and the proxy must be under the same domain to successfully retrieve cookies.
- NGINX server must be configured to route requests appropriately among the `console-implementation-example-ui`, `console-implementation-example-backend`, and Metalsoft's Guacamole Server.
To get started follow the following guide: [github.com/metalsoft-io/UI-console-implementation-example](https://github.com/metalsoft-io/UI-console-implementation-example#ui-console-implementation-example)