Skip to content

Commit 53a2537

Browse files
committed
Make sample app page overview
1 parent 042e00a commit 53a2537

12 files changed

+57
-162
lines changed
-420 KB
Binary file not shown.

doc-assets/videos/create-dataset.mp4

-469 KB
Binary file not shown.

doc-assets/videos/create-monitor.mp4

-721 KB
Binary file not shown.

doc-assets/videos/create-notifier.mp4

-451 KB
Binary file not shown.

doc-assets/videos/dashboards-tab.mp4

-698 KB
Binary file not shown.

doc-assets/videos/datasets-tab.mp4

-742 KB
Binary file not shown.

doc-assets/videos/explore-tab.mp4

-575 KB
Binary file not shown.

doc-assets/videos/stream-tab.mp4

-678 KB
Binary file not shown.

getting-started-guide/explore-axiom-playground.mdx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -61,4 +61,4 @@ You see a dashboard that displays important information about the HTTP requests
6161

6262
To try out Axiom with sample data, see [Quickstart using sample data](getting-started-guide/quickstart-using-sample-data).
6363

64-
To check out Axiom with an example Node.js app, see [Get started with example app](/getting-started-guide/get-started-example-app).
64+
To check out Axiom with a sample app, see [Get started with example app](/getting-started-guide/get-started-example-app).

getting-started-guide/get-started-example-app.mdx

Lines changed: 54 additions & 159 deletions
Original file line numberDiff line numberDiff line change
@@ -3,165 +3,60 @@ title: 'Get started with example app'
33
excerpt: 'This page explains how to try out Axiom with an example app.'
44
---
55

6-
Axiom enables you to query your event data without compromises: all your data, all the time, for all possible needs. No sampling, no waiting, and no extravagant bills.
7-
8-
This page explains how to try out Axiom with an example Node.js app that emits OpenTelemetry trace data. There are many others ways you can send data to Axiom. For a full list, see [Send data](/send-data/ingest).
6+
This page explains how to try out Axiom with an example app that emits OpenTelemetry (OTel) trace data. There are many others ways you can send data to Axiom. For a full list, see [Send data](/send-data/ingest).
7+
8+
Choose one of the following example apps:
9+
10+
<CardGroup cols={2}>
11+
<Card
12+
title=".NET"
13+
href="/guides/opentelemetry-dotnet"
14+
>
15+
</Card>
16+
17+
<Card
18+
title="Django"
19+
href="/guides/opentelemetry-django"
20+
>
21+
</Card>
22+
23+
<Card
24+
title="Golang"
25+
href="/guides/opentelemetry-go"
26+
>
27+
</Card>
28+
29+
<Card
30+
title="Java"
31+
href="/guides/opentelemetry-java"
32+
>
33+
</Card>
34+
35+
<Card
36+
title="Next.js"
37+
href="/guides/opentelemetry-nextjs"
38+
>
39+
</Card>
40+
41+
<Card
42+
title="Node.js"
43+
href="/guides/opentelemetry-nodejs"
44+
>
45+
</Card>
46+
47+
<Card
48+
title="Python"
49+
href="/guides/opentelemetry-python"
50+
>
51+
</Card>
52+
53+
<Card
54+
title="Ruby on Rails"
55+
href="/guides/opentelemetry-ruby"
56+
>
57+
</Card>
58+
</CardGroup>
959

1060
To try out Axiom without registration, see [Explore Axiom Playground](/getting-started-guide/explore-axiom-playground).
1161

12-
To try out Axiom with sample data, see [Quickstart using sample data](getting-started-guide/quickstart-using-sample-data).
13-
14-
## 1. Set up Axiom
15-
16-
To set up Axiom to receive data, first [sign up for a free Axiom account](https://app.axiom.co/register). All you need is an email address.
17-
18-
### Create a dataset
19-
20-
In Axiom, an individual piece of data is an event, and a dataset is a collection of similar events. In this example, events are emitted by the sample app, and the dataset contains the incoming event data.
21-
22-
1. Click <img src="/doc-assets/icons/settings.svg" className="inline-icon" alt="Settings icon" /> **Settings > Datasets**, and then click **New dataset**.
23-
2. Name your dataset **test-dataset**, and then click **Add**.
24-
25-
This creates a dataset in your account where you will send event data.
26-
27-
<video controls autoPlay muted loop>
28-
<source src="/doc-assets/videos/create-dataset.mp4" type="video/mp4">
29-
</source>
30-
</video>
31-
32-
### Create an API token
33-
34-
An API token is a form of authentication that enables you to send data to Axiom. Keep it confidential because anyone with this key can send data to your Axiom dataset.
35-
36-
1. Click <img src="/doc-assets/icons/settings.svg" className="inline-icon" alt="Settings icon" /> **Settings > API tokens**, and then click **New API token**.
37-
2. Name your API token **test-token**.
38-
3. In **Dataset access**, select **test-dataset**.
39-
4. Click **Add**.
40-
5. Copy the API token that appears and store it securely. It won't be displayed again.
41-
42-
This creates an API token that you will use to authenticate requests to send data to Axiom.
43-
44-
<video controls autoPlay muted loop>
45-
<source src="/doc-assets/videos/create-api-token.mp4" type="video/mp4">
46-
</source>
47-
</video>
48-
49-
## 2. Send data to Axiom
50-
51-
1. [Install Node.js](https://nodejs.org/).
52-
2. Clone the [`otlp-exporter-node` example from OpenTelemetry](https://github.com/open-telemetry/opentelemetry-js/tree/main/examples/otlp-exporter-node).
53-
3. In the `tracing.js` file, edit the code that creates the `OTLPTraceExporter` object. Replace `AXIOM_API_TOKEN` with the Axiom API token you have generated.
54-
55-
```js
56-
const exporter = new OTLPTraceExporter({
57-
url: 'https://api.axiom.co/v1/traces',
58-
headers: {
59-
'Authorization': 'Bearer AXIOM_API_TOKEN',
60-
'X-Axiom-Dataset': 'test-dataset'
61-
},
62-
});
63-
```
64-
65-
4. In your terminal, go to the root folder of the example app. Run the following to install dependencies and start the app three times:
66-
67-
```shell
68-
npm i
69-
npm run start:tracing
70-
npm run start:tracing
71-
npm run start:tracing
72-
```
73-
74-
This connects the example app to Axiom. Every time the app runs, it sends event data to Axiom.
75-
76-
## 3. Analyze data
77-
78-
### Display stream of incoming data
79-
80-
1. Click the **Stream** tab on the top of the page.
81-
2. Click **test-dataset** in the list.
82-
83-
You see the event data that Axiom receives realtime.
84-
85-
<video controls autoPlay muted loop>
86-
<source src="/doc-assets/videos/stream-tab.mp4" type="video/mp4">
87-
</source>
88-
</video>
89-
90-
### Query data
91-
92-
1. Click the **Datasets** tab on the top of the page, and then click **test-dataset**. This tab enables you to query your data with a visual query editor.
93-
2. In the **Visualize** section, click **+**.
94-
3. Write `histogram(duration, 15)`, and then press **Enter**.
95-
4. Click **Run query**.
96-
97-
You see a heatmap of events and their duration.
98-
99-
<video controls autoPlay muted loop>
100-
<source src="/doc-assets/videos/datasets-tab.mp4" type="video/mp4">
101-
</source>
102-
</video>
103-
104-
### Run a query with Axiom Processing Language (APL)
105-
106-
1. Click the **Explore** tab on the top of the page, and then click your dataset. This tab enables you to query your data using the Axiom Processing Language (APL). For more information, see [Introduction to APL](/apl/introduction).
107-
2. In the text field, enter the following:
108-
```apl copy
109-
['test-dataset']
110-
| where duration > 1000000
111-
| take 1000
112-
```
113-
3. Click **Run query**.
114-
115-
You see the events that took longer than 1 ms. In the query above, you see one million because time in the `duration` field is stored in nanoseconds.
116-
117-
<video controls autoPlay muted loop>
118-
<source src="/doc-assets/videos/explore-tab.mp4" type="video/mp4">
119-
</source>
120-
</video>
121-
122-
## 4. Visualize data
123-
124-
1. Click the **Dashboards** tab on the top of the page, and then click **OpenTelemetry Traces (test-dataset)**. You see data about incoming traces and spans. Whenever Axiom detects known schemas like OpenTelemetry, it automatically creates dashboards for you.
125-
2. The `Slowest Operations` chart shows the list of services. Click `basic-service` to display the traces of this service.
126-
3. Click one of the traces in the list.
127-
128-
You see a waterfall view of spans that displays each span in the trace and their duration.
129-
130-
<video controls autoPlay muted loop>
131-
<source src="/doc-assets/videos/dashboards-tab.mp4" type="video/mp4">
132-
</source>
133-
</video>
134-
135-
## 5. Monitor data for issues
136-
137-
### Create a notifier
138-
139-
Set up a notifier to determine the channel Axiom uses to alert you about what's happening with your data. For example, Axiom can send you an email.
140-
141-
1. Click the **Monitors** tab on the top of the page, and then click **Manage notifiers** on the right.
142-
2. Click **New notifier** on the top right.
143-
3. In **Name**, enter **test-notifier**.
144-
4. In **Users**, enter your email address, and then click **+** on the right.
145-
5. Click **Create**, and then click **Done**.
146-
147-
<video controls autoPlay muted loop>
148-
<source src="/doc-assets/videos/create-notifier.mp4" type="video/mp4">
149-
</source>
150-
</video>
151-
152-
### Create a monitor
153-
154-
Set up a monitor to receive alerts if certain conditions about your event data are met.
155-
156-
1. Click the **Monitors** tab on the top of the page, and then click **New monitor**.
157-
2. Click **Add notifier**, and then select **Email: test-notifier**.
158-
3. Click **Simple Query Builder**.
159-
4. In **Dataset**, select **test-dataset**.
160-
5. Click **Create**.
161-
162-
You created a monitor that automatically sends a notification to your email address if the number of events Axiom receives is higher than 1,000 in ten minutes.
163-
164-
<video controls autoPlay muted loop>
165-
<source src="/doc-assets/videos/create-monitor.mp4" type="video/mp4">
166-
</source>
167-
</video>
62+
To try out Axiom with sample data, see [Quickstart using sample data](getting-started-guide/quickstart-using-sample-data).

getting-started-guide/quickstart-using-sample-data.mdx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -103,4 +103,4 @@ You created a monitor that automatically sends a notification to your email addr
103103

104104
## What's next
105105

106-
To check out Axiom with an example Node.js app, see [Get started with example app](/getting-started-guide/get-started-example-app).
106+
To check out Axiom with a sample app, see [Get started with example app](/getting-started-guide/get-started-example-app).

getting-started-guide/try-out-axiom.mdx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,7 @@ Try out Axiom with sample data
2424
title="Get started with example app"
2525
href="/getting-started-guide/get-started-example-app"
2626
>
27-
Check out Axiom with an example Node.js app
27+
Check out Axiom with a sample app
2828
</Card>
2929

3030
For a more educational experience that explains the most important concepts and ideas behind Axiom and how your organization can benefit from Axiom’s offering, see [Learn about Axiom](/getting-started-guide/learn-about-axiom).

0 commit comments

Comments
 (0)