HyperDX is an open source observability platform thatunifies logs, traces, metrics, exceptions, and session replays into a singleinterface. It helps developers debug applications faster by providing a completeview of your system's behavior and performance.

OpenTelemetry (often abbreviated as OTel) providesa standardized way to collect and export telemetry data. Deno includes built-inOpenTelemetry support, allowing you to instrument your applications withoutadditional dependencies. This integration works seamlessly with platforms likeHyperDX to collect and visualize telemetry data.

In this tutorial, we'll build a simple application and export its telemetry datato HyperDX:

• Set up your chat app
• Set up a Docker collector
• Generating telemetry data
• Viewing telemetry data

You can find the complete source code for this tutorialon GitHub.

Set up the appJump to heading#

For this tutorial, we'll use a simple chat application to demonstrate how toexport telemetry data. You can find thecode for the app on GitHub.

Either take a copy of that repository or create amain.tsfile and a.envfile.

In order to run the app you will need an OpenAI API key. You can get one bysigning up for an account atOpenAI andcreating a new secret key. You can find your API key in theAPI keys section of your OpenAIaccount. Once you have an API key, set up anOPENAI_API-KEY environmentvariable in your.env file:

OPENAI_API_KEY=your_openai_api_key

Set up the collectorJump to heading#

First, create a free HyperDX account to get your API key. Then, we'll set up twofiles to configure the OpenTelemetry collector:

1. Create aDockerfile:

FROM otel/opentelemetry-collector:latestCOPY otel-collector.yml /otel-config.ymlCMD ["--config", "/otel-config.yml"]

This Dockerfile:

• Uses the official OpenTelemetry Collector as the base image
• Copies your configuration into the container
• Sets up the collector to use your config when it starts

2. Create a file calledotel-collector.yml:

receivers:  otlp:    protocols:      grpc:        endpoint: 0.0.0.0:4317      http:        endpoint: 0.0.0.0:4318exporters:  otlphttp/hdx:    endpoint: "https://in-otel.hyperdx.io"    headers:      authorization: $_HYPERDX_API_KEY    compression: gzipprocessors:  batch:service:  pipelines:    traces:      receivers: [otlp]      processors: [batch]      exporters: [otlphttp/hdx]    metrics:      receivers: [otlp]      processors: [batch]      exporters: [otlphttp/hdx]    logs:      receivers: [otlp]      processors: [batch]      exporters: [otlphttp/hdx]

This configuration file sets up the OpenTelemetry collector to receive telemetrydata from your application and export it to HyperDX. It includes:

• The receivers section accepts data via gRPC (4317) and HTTP (4318)
• The Exporters section sends data to HyperDX with compression andauthentication
• The processors section batches telemetry data for efficient transmission
• The pipelines section defines separate flows for logs, traces, and metrics

Build and run the docker instance to start collecting your telemetry data withthe following command:

docker build-t otel-collector.&&docker run-p4317:4317-p4318:4318 otel-collector

Generating telemetry dataJump to heading#

Now that we have the app and the docker container set up, we can startgenerating telemetry data. Run your application with these environment variablesto send data to the collector:

OTEL_EXPORTER_OTLP_ENDPOINT=http://localhost:4318\OTEL_SERVICE_NAME=chat-app\OTEL_DENO=true\deno run --allow-net --allow-env --env-file --allow-read main.ts

This command:

• Points the OpenTelemetry exporter to your local collector (localhost:4318)
• Names your service "chat-app" in HyperDX
• Enables Deno's OpenTelemetry integration
• Runs your application with the necessary permissions

To generate some telemetry data, make a few requests to your running applicationin your browser athttp://localhost:8000.

Each request will:

1. Generate traces as it flows through your application
2. Send logs from your application's console output
3. Create metrics about the request performance
4. Forward all this data through the collector to HyperDX

Viewing telemetry dataJump to heading#

In your HyperDX dashboard, you'll see different views of your telemetry data:

Logs ViewJump to heading#

Click any log to see details:

Request TracesJump to heading#

See all logs within a single request:

Metrics DashboardJump to heading#

Monitor system performance:

🦕 Now that you have telemetry export working, you could:

1. Add custom spans and attributes to better understand your application
2. Set up alerts based on latency or error conditions
3. Deploy your application and collector to production using platforms like:
   • Fly.io
   • Digital Ocean
   • AWS Lightsail

🦕 For more details on OpenTelemetry configuration with HyperDX, see theirdocumentation.