Lessons from open-source: What is OpenTelemetry
Tags: javascript, react, nextjs, opensource
Published: 2024-03-13 21:58:22

This lesson is picked from [Next.js source code](https://github.com/vercel/next.js/blob/canary/packages/next/src/server/next.ts#L253). In this article, you will learn the overview of OpenTelemetry and where to find the code related to OpenTelemetry in Next.js source code.

##What is OpenTelemetry?

OpenTelemetry is a tool that helps keep an eye on how software is running by collecting important information like traces (how requests move through the system), metrics (performance data), and logs (recorded events). It can work with many different monitoring tools, whether they’re free and open-source like [Jaeger](https://www.jaegertracing.io/) and [Prometheus](https://prometheus.io/) or paid services.

> You can read more about [What is OpenTelemetry from the official documentation](https://opentelemetry.io/docs/what-is-opentelemetry/).

I found the following important concepts from the documentation to understand the basics of OpenTelemetry:

1.  [Instrumentation](https://opentelemetry.io/docs/concepts/instrumentation/)
2.  [Observability](https://opentelemetry.io/docs/concepts/observability-primer/#what-is-observability)
3.  [Traces](https://opentelemetry.io/docs/concepts/signals/traces/)
4.  [Spans](https://opentelemetry.io/docs/concepts/signals/traces/#spans)
5.  [Metrics](https://opentelemetry.io/docs/concepts/signals/metrics/)
6.  [Logs](https://opentelemetry.io/docs/concepts/signals/logs/)

> [_Practice the exercises based on documentation_](https://tthroo.com/) _to become an expert in Next.js_

It also has vast [APIs and SDKs supported](https://opentelemetry.io/docs/languages/) supported in many different programming languages.

### Two key principles:

1.  You own the data that you generate. There’s no vendor lock-in.
2.  You only have to learn a single set of APIs and conventions. — [Source](https://opentelemetry.io/docs/what-is-opentelemetry/#why-opentelemetry)

## How Next.js uses OpenTelemetry?

![tracer](https://miro.medium.com/v2/resize:fit:1400/1*klXrmVwe_F_Z2w9zT5ipbA.png)

You can find the OpenTelemetry related code in the file named [tracer.js](https://github.com/vercel/next.js/blob/canary/packages/next/src/server/lib/trace/tracer.ts) inside [packages/next/server](https://github.com/vercel/next.js/tree/canary/packages/next). I can see that trace is used to get the big picture of how the system works inside the server folder.

### An example Next.js with OpenTelemetry configured

Next.js provided an [example with OpenTelemetry](https://github.com/vercel/next.js/tree/5278d82aa934ae16b5545af18b33511b99b2b735/examples/with-opentelemetry)

## Conclusion:

This one time I saw the OpenTelemetry on the Github “Trending” page (I try to visit the “Trending” page on Github to see what’s popular among the dev community for the day). At that time, I did not know Next.js uses OpenTelemetry for tracing purposes in their server related code. WIth OpenTelemetry, you can understand your system from outside and also, you own the data that you generate. Application must be properly instrumented to troubleshoot and handle novel problems.