Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Docs: Enhance datasource READMEs #254

Open
wants to merge 13 commits into
base: main
Choose a base branch
from
Open
15 changes: 8 additions & 7 deletions examples/datasource-basic/README.md
Original file line number Diff line number Diff line change
@@ -1,16 +1,17 @@
# Grafana Basic Data Source Plugin example
# Basic Data Source Plugin for Grafana

[![Build](https://github.com/grafana/grafana-starter-datasource/workflows/CI/badge.svg)](https://github.com/grafana/grafana-starter-datasource/actions?query=workflow%3A%22CI%22)

This template is a starting point for building Grafana data source plugins.
This repository contains a simple data source plugin example.
josmperez marked this conversation as resolved.
Show resolved Hide resolved
## Overview

## What is a Grafana data source plugin?
The Basic Data Source Plugin offers a streamlined starting point for developers to understand the essential structure and functionality required for adding their own data sources to Grafana.

Grafana supports a wide range of data sources, including Prometheus, MySQL, and even Datadog. There’s a good chance you can already visualize metrics from the systems you have set up. In some cases, though, you already have an in-house metrics solution that you’d like to add to your Grafana dashboards. Grafana data source plugins enable you to integrate such solutions with Grafana.
Grafana supports a wide range of data sources, including Prometheus, MySQL, and Datadog. There’s a good chance you can already visualize metrics from the systems you have set up. In some cases, though, you already have an in-house metrics solution that you’d like to add to your Grafana dashboards. Grafana data source plugins enable you to integrate such solutions with Grafana.

## Get started

A data source backend plugin consists of both frontend and backend components.
Data source plugins consist of both frontend and backend components. Install these components with the following CLI commands.
josmperez marked this conversation as resolved.
Show resolved Hide resolved

### Frontend

Expand All @@ -34,7 +35,7 @@ A data source backend plugin consists of both frontend and backend components.

### Backend

1. Update [Grafana plugin SDK for Go](https://grafana.com/developers/plugin-tools/introduction/grafana-plugin-sdk-for-go) dependency to the latest minor version:
1. Update [Grafana Plugin SDK for Go](https://grafana.com/developers/plugin-tools/introduction/grafana-plugin-sdk-for-go) dependency to the latest minor version:

```bash
go get -u github.com/grafana/grafana-plugin-sdk-go
Expand All @@ -57,4 +58,4 @@ A data source backend plugin consists of both frontend and backend components.

- [Grafana plugins documentation](https://grafana.com/developers/plugin-tools/)
- [Build a data source plugin tutorial](https://grafana.com/developers/plugin-tools/tutorials/build-a-data-source-plugin)
- [Grafana UI Library](https://developers.grafana.com/ui) - UI components to help you build interfaces using Grafana Design System
- [Grafana documentation](https://grafana.com/docs/)
josmperez marked this conversation as resolved.
Show resolved Hide resolved
33 changes: 27 additions & 6 deletions examples/datasource-http-backend/README.md
Original file line number Diff line number Diff line change
@@ -1,14 +1,20 @@
# Grafana Data Source HTTP Backend Plugin example
# Data Source HTTP Backend Plugin for Grafana

This repository contains a backend data source plugin that queries data from an HTTP API.

## Overview

The Data Source HTTP Backend Plugin showcases the integration of a backend HTTP service as a custom data source within Grafana. This plugin serves as a reference implementation for developers aiming to incorporate HTTP-based data sources into their Grafana dashboards.

This example queries data from an HTTP API. The HTTP API returns data in JSON format, which is then converted to data frames.

This differs from the `datasource-http` example because the data fetching happens in the plugin backend rather than going through Grafana's data source HTTP proxy.
This plugin differs from the `datasource-http` example because the data fetching happens in the plugin backend rather than going through Grafana's data source HTTP proxy.

This allows the plugin to use the data source for alerting as well, as the queries are executed on the backend.

This plugin example also showcases other features and best-practices of backend plugins:

- Using the `httpclient` provided by the [Grafana plugins SDK](https://pkg.go.dev/github.com/grafana/grafana-plugin-sdk-go/backend/httpclient)
- Using the `httpclient` provided by the [Grafana Plugin SDK for Go](https://pkg.go.dev/github.com/grafana/grafana-plugin-sdk-go/backend/httpclient)
- Tracing, for better instrumentation of your plugin

This plugin example also includes an example server returning data in the format expected by this plugin (`cmd/server`). Refer to the section below on how to build and run it.
Expand All @@ -28,31 +34,46 @@ The plugin expects the following JSON from a remote HTTP API:

An example HTTP server that returns dummy data in this format is included in `cmd/server`.

## Building
## Get started

Data source plugins consist of both frontend and backend components. Install these components with the following CLI commands.

### Frontend

Install dependencies and build:

```bash
$ npm install
$ npm run build
```

### Backend

Build backend plugin binaries for Linux, Windows and Darwin:

```bash
$ mage -v
```

### Example server
### Set up a server

1. Set up a backend server to return data:


```bash
$ mage server
$ ./cmd/server/server :10000
2022/10/28 15:43:16 listening on :10000
```

Then, add a new data source in Grafana and use the following URL:
2. Add a new data source in Grafana and use the following URL:

```
http://127.0.0.1:10000/metrics
```

## Learn more

- [Grafana plugins documentation](https://grafana.com/developers/plugin-tools/)
- [Build a data source plugin tutorial](https://grafana.com/developers/plugin-tools/tutorials/build-a-data-source-plugin)
- [Grafana documentation](https://grafana.com/docs/)
63 changes: 61 additions & 2 deletions examples/datasource-http/README.md
Original file line number Diff line number Diff line change
@@ -1,3 +1,62 @@
# Grafana Data Source Plugin HTTP example
# Data Source HTTP Plugin for Grafana

This example queries data from an HTTP API.
This repository contains a data source plugin that uses HTTP through Grafana's data source HTTP proxy.
## Overview

The Grafana HTTP Backend Data Source Plugin shows the integration of a backend HTTP service as a custom data source within Grafana. This plugin serves as a reference implementation for developers seeking to incorporate HTTP-based data sources into their Grafana dashboards.
josmperez marked this conversation as resolved.
Show resolved Hide resolved

Grafana supports a wide range of data sources, including Prometheus, MySQL, and Datadog. There’s a good chance you can already visualize metrics from the systems you have set up. In some cases, though, you already have an in-house metrics solution that you’d like to add to your Grafana dashboards. Grafana data source plugins enable you to integrate such solutions with Grafana.

This plugin differs from the `datasource-http-backend` example because the data fetching happens through Grafana's data source HTTP proxy rather than going through the plugin backend.

## Get started

Data source plugins consist of both frontend and backend components. Install these components with the following CLI commands.

### Frontend

1. Install dependencies:

```bash
npm install
```

2. Build plugin in development mode or run in watch mode:

```bash
npm run dev
```

3. Build plugin in production mode:

```bash
npm run build
```

### Backend
josmperez marked this conversation as resolved.
Show resolved Hide resolved

1. Update [Grafana Plugin SDK for Go](https://grafana.com/developers/plugin-tools/introduction/grafana-plugin-sdk-for-go) dependency to the latest minor version:

```bash
go get -u github.com/grafana/grafana-plugin-sdk-go
go mod tidy
```

2. Build backend plugin binaries for Linux, Windows and Darwin:

```bash
mage -v
```

3. List all available Mage targets for additional commands:

```bash
mage -l
```


## Learn more

- [Grafana plugins documentation](https://grafana.com/developers/plugin-tools/)
- [Build a data source plugin tutorial](https://grafana.com/developers/plugin-tools/tutorials/build-a-data-source-plugin)
- [Grafana documentation](https://grafana.com/docs/)
54 changes: 52 additions & 2 deletions examples/datasource-logs/README.md
Original file line number Diff line number Diff line change
@@ -1,3 +1,53 @@
# Grafana Data Source Plugin with Logs example
# Logs Data Source Plugin for Grafana

This is an example of a data source plugin that implements logging features. You can learn more in our [documentation](https://grafana.com/developers/plugin-tools/tutorials/build-a-logs-data-source-plugin).
This repository contains a data source plugin for logs.

## Overview

The Logs Data Source Plugin demonstrates the integration of log data sources into Grafana dashboards. This plugin serves as an example for developers who want to incorporate log data from various sources into their Grafana visualizations.

This is an example of a data source plugin that implements logging features. You can learn more in our [documentation](https://grafana.com/developers/plugin-tools/tutorials/build-a-logs-data-source-plugin).

## Get started

Data source plugins consist of both frontend and backend components. Install these components with the following CLI commands.

### Frontend

Install dependencies and build:

```bash
$ npm install
$ npm run build
```

### Backend
josmperez marked this conversation as resolved.
Show resolved Hide resolved

Build backend plugin binaries for Linux, Windows and Darwin:

```bash
$ mage -v
```

### Set up a server

1. Set up a backend server:


```bash
$ mage server
$ ./cmd/server/server :10000
2022/10/28 15:43:16 listening on :10000
```

2. Add a new data source in Grafana and use the following URL:

```
http://127.0.0.1:10000/metrics
```

## Learn more

- [Grafana plugins documentation](https://grafana.com/developers/plugin-tools/)
- [Build a data source plugin tutorial](https://grafana.com/developers/plugin-tools/tutorials/build-a-data-source-plugin)
- [Grafana documentation](https://grafana.com/docs/)
25 changes: 17 additions & 8 deletions examples/datasource-streaming-backend-websocket/README.md
Original file line number Diff line number Diff line change
@@ -1,12 +1,17 @@
# Grafana Data Source Streaming Backend Plugin example
# Streaming WebSocket Backend Data Source Plugin for Grafana

This is an example of how to implement a Grafana data source plugin with streaming backend support.
This backend data source plugin shows how to stream data from a WebSocket.
## Overview

The plugin connects to the backend through a streaming connection and the backend establishes a connection to an external websocket server.
The Streaming WebSocket Backend Data Source Plugin serves as a reference implementation for developers seeking to incorporate WebSocket-based services into their Grafana dashboards for streaming data scenarios.

## Build
The plugin connects to the backend through a streaming connection and the backend establishes a connection to an external WebSocket server.

Build the data source plugin
The example server sends random numbers controlled by a query parameter.

## Get started

1. Build the data source plugin:

```sh
cd streaming-backend-websocket-plugin
Expand All @@ -15,7 +20,7 @@ npm install
npm run build
```

and run the Grafana and the example websocket server with Docker compose:
2. Run the Grafana and the example WebSocket server with Docker compose:

```sh
cd streaming-backend-websocket-plugin
Expand All @@ -26,8 +31,6 @@ The server can be accessed by the Grafana backend in `ws://websocket-server:8080

Refer to the [`docker-compose.yaml`](./streaming-backend-websocket-plugin/docker-compose.yaml) for more details.

The example server sends random numbers controlled by a query parameter.

## Packages

### `streaming-backend-websocket-plugin`
Expand All @@ -37,3 +40,9 @@ This package contains a Grafana data source plugin that establishes a connection
### `websocket-server`

This package contains a WebSocket server that returns random values at random intervals.

## Learn more

- [Grafana plugins documentation](https://grafana.com/developers/plugin-tools/)
- [Build a data source plugin tutorial](https://grafana.com/developers/plugin-tools/tutorials/build-a-data-source-plugin)
- [Grafana documentation](https://grafana.com/docs/)
18 changes: 15 additions & 3 deletions examples/datasource-streaming-websocket/README.md
Original file line number Diff line number Diff line change
@@ -1,8 +1,14 @@
# Grafana Streaming Data Source WebSocket Plugin example
# Streaming WebSocket Data Source Plugin for Grafana

This is an example of how to implement a Grafana data source plugin with streaming support.
This repository provides an example of how to implement a Grafana data source plugin with streaming support.

## Build
## Overview

The Streaming WebSocket Data Source Plugin illustrates the integration of WebSocket-based data sources into Grafana dashboards. This plugin serves as a reference implementation for developers aiming to incorporate real-time streaming data into their Grafana visualizations.
josmperez marked this conversation as resolved.
Show resolved Hide resolved

This server returns random numeric values at random intervals.

## Get started

- Start the WebSocket server:

Expand All @@ -27,3 +33,9 @@ This package contains a Grafana data source plugin that establishes a connection
### `websocket-server`

This package contains a WebSocket server that returns random values at random intervals.

## Learn more

- [Grafana plugins documentation](https://grafana.com/developers/plugin-tools/)
- [Build a data source plugin tutorial](https://grafana.com/developers/plugin-tools/tutorials/build-a-data-source-plugin)
- [Grafana documentation](https://grafana.com/docs/)
2 changes: 2 additions & 0 deletions examples/panel-datalinks/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -10,6 +10,8 @@ Use panel plugins when you want to do things like visualize data returned by dat

## Get started

A data source backend plugin consists of both frontend and backend components. Install these with the following CLI commands.
josmperez marked this conversation as resolved.
Show resolved Hide resolved

### Frontend

1. Install dependencies:
Expand Down