# Get started

Welcome to the world of Grafana plugin creation, where you can enhance Grafana's foundational features. In this guide, you'll learn how to get started by scaffolding a plugin, running it in an efficient development environment, and using its basic features.

[Getting Started with Grafana Plugin Development](https://youtube.com/embed/AARrATeVEQY)

**Watch our introductory video** to see a step-by-step guide on getting started with your first Grafana plugin. This visual tutorial complements the detailed instructions below and provides practical insights to help you along the way.

## Quick start[​](#quick-start "Direct link to Quick start")

Scaffold a new plugin with a single command! Run the following and answer the prompts:

* npm
* Yarn
* pnpm

```shell
npx @grafana/create-plugin@latest

```

```shell
yarn dlx @grafana/create-plugin@latest

```

```shell
pnpm dlx @grafana/create-plugin@latest

```

## Why create a Grafana plugin?[​](#why-create-a-grafana-plugin "Direct link to Why create a Grafana plugin?")

Grafana plugin development allows you to create many different types of user experiences. For example, you can make:

* **Panel plugins** - new ways of visualizing data
* **Data source plugins** - connections to a new database or other source of data
* **App plugins** - integrated out-of-the-box experiences

tip

If this is your first time creating a plugin, we recommend that you familiarize yourself with the fundamentals of plugin types, frontend and backend components, data frames, and other essentials. Learn more about the [key concepts of Grafana plugin development](https://grafana.com/developers/plugin-tools/key-concepts.md).

## Signature classifications of Grafana plugins[​](#signature-classifications-of-grafana-plugins "Direct link to Signature classifications of Grafana plugins")

Familiarize yourself with the signature classifications of Grafana plugins, such as the distinction between private and public plugins.

Note that if you want to publish a plugin associated with a commercial offering to the official Grafana catalog, a paid subscription is typically required. Learn more about [Grafana's plugins policy](https://grafana.com/legal/plugins/).

## Use plugin tools to develop your plugins faster[​](#use-plugin-tools-to-develop-your-plugins-faster "Direct link to Use plugin tools to develop your plugins faster")

Grafana's plugin tools offer an officially supported way to extend Grafana's core functionality. We have designed these tools to help you to develop your plugins faster with a modern build setup and zero additional configuration required.

The plugin tools consist of two packages:

* `create-plugin`: A CLI to scaffold new plugins or migrate plugins created with `@grafana/toolkit`.
* `sign-plugin`: A CLI to sign plugins for distribution.

info

If you have previously built a plugin with `@grafana/toolkit`, you can use our plugin tools to make the jump to our newest tools. For more information, refer to [Migrate from toolkit](https://grafana.com/developers/plugin-tools/migration-guides/migrate-from-toolkit.md).

## Before you begin[​](#before-you-begin "Direct link to Before you begin")

Make sure you are using a supported OS, Grafana version, and tooling.

### Supported operating systems[​](#supported-operating-systems "Direct link to Supported operating systems")

Grafana plugin tools work with the following operating systems:

* Linux
* macOS
* Windows 10+ with WSL (Windows Subsystem for Linux)

### Supported Grafana version[​](#supported-grafana-version "Direct link to Supported Grafana version")

We generally recommend that you build for a version of Grafana later than v10.0. For more information about requirements and dependencies when developing with Grafana, see the [Grafana developer's guide](https://github.com/grafana/grafana/blob/main/contribute/developer-guide.md).

### Required tooling[​](#required-tooling "Direct link to Required tooling")

You'll need to have the following tools set up:

* Go ([Version](https://github.com/grafana/plugin-tools/blob/main/packages/create-plugin/templates/backend/go.mod#L3))
* [Mage](https://magefile.org/)
* [LTS](https://nodejs.dev/en/about/releases/) version of Node.js
* [Docker](https://docs.docker.com/get-docker/)
* Optionally, [Yarn](https://yarnpkg.com/getting-started/install) or [PNPM](https://pnpm.io/installation)

#### Supported package managers[​](#supported-package-managers "Direct link to Supported package managers")

`@grafana/create-plugin` officially supports the following Node package managers:

* `npm` (>=10.0.0)
* `pnpm` (>=10.0.0)
* `yarn` (>=4.0.0)

note

The Yarn commands on this website are compatible with Yarn Berry (>=2.0.0). If you are using Yarn 1.x.x we suggest you upgrade to [Yarn Berry](https://yarnpkg.com/migration/guide). Alternatively you can use `yarn create @grafana/plugin` to run commands with Yarn 1.x.x.

## Scaffold a plugin[​](#scaffold-a-plugin "Direct link to Scaffold a plugin")

### Run the `create-plugin` tool[​](#run-the-create-plugin-tool "Direct link to run-the-create-plugin-tool")

Run the following command and answer the prompts:

* npm
* Yarn
* pnpm

```shell
npx @grafana/create-plugin@latest

```

```shell
yarn dlx @grafana/create-plugin@latest

```

```shell
pnpm dlx @grafana/create-plugin@latest

```

For help with the prompts, refer to the [CLI commands](https://grafana.com/developers/plugin-tools/reference/cli-commands.md).

### Open the generated folder structure[​](#open-the-generated-folder-structure "Direct link to Open the generated folder structure")

Open the plugin folder to browse the generated plugin:

The directory name `<orgName>-<pluginName>-<pluginType>` is based on the answers you gave to the prompts. Use the name of the generated folder when prompted. This directory contains the initial project structure to kickstart your plugin development.

The file structure should look like this:

```text
<orgName>-<pluginName>-<pluginType>
├── .config/
├── .eslintrc
├── .github
│   └── workflows
├── .gitignore
├── .nvmrc
├── .prettierrc.js
├── CHANGELOG.md
├── LICENSE
├── Magefile.go
├── README.md
├── cypress
│   └── integration
├── docker-compose.yaml
├── go.mod
├── go.sum
├── jest-setup.js
├── jest.config.js
├── node_modules
├── package.json
├── pkg
│   ├── main.go
│   └── plugin
├── src
│   ├── README.md
│   ├── components
│   ├── datasource.ts
│   ├── img
│   ├── module.ts
│   ├── plugin.json
│   └── types.ts
└── tsconfig.json

```

For more information about these files, refer to [Anatomy of a plugin](https://grafana.com/developers/plugin-tools/key-concepts/anatomy-of-a-plugin.md).

## Build and run your plugin in Docker[​](#build-and-run-your-plugin-in-docker "Direct link to Build and run your plugin in Docker")

With the `create-plugin` tool, you can use a Docker container to simplify the configuration, loading, and development processes. For more information, refer to [Set up development environment](https://grafana.com/developers/plugin-tools/set-up.md).

Refer to the "Next steps" terminal output following the [scaffolding of a new plugin](#scaffold-a-plugin) to install dependencies, build and run your plugin.

Example output:

```text
## What's next?

Run the following commands to get started:

    * cd ./orgName-pluginName-app
    * npm install to install frontend dependencies.
    * npm exec playwright install chromium to install e2e test dependencies.
    * npm run dev to build (and watch) the plugin frontend code.
    * mage -v build:backend to build the plugin backend code. Rerun this command every time you edit your backend files.
    * docker compose up to start a grafana development server.
    * Open http://localhost:3000 in your browser to create a dashboard to begin developing your plugin.

Note: We strongly recommend creating a new Git repository by running git init in ./org-pluginname-app before continuing.

    * Learn more about Grafana Plugin Development at https://grafana.com/developers/plugin-tools


```

### Install dependencies[​](#install-dependencies "Direct link to Install dependencies")

* npm
* Yarn
* pnpm

```shell
cd <orgName>-<pluginName>-<pluginType>
npm install

```

```shell
cd <orgName>-<pluginName>-<pluginType>
yarn install

```

```shell
cd <orgName>-<pluginName>-<pluginType>
pnpm install

```

### Build the frontend[​](#build-the-frontend "Direct link to Build the frontend")

To build the plugin in watch mode for development and continually monitor for changes, run:

* npm
* Yarn
* pnpm

```shell
npm run dev

```

```shell
yarn dev

```

```shell
pnpm run dev

```

To build for production, run:

* npm
* Yarn
* pnpm

```shell
npm run build

```

```shell
yarn build

```

```shell
pnpm run build

```

### Build the backend[​](#build-the-backend "Direct link to Build the backend")

If your plugin includes a [backend](https://grafana.com/developers/plugin-tools/key-concepts/backend-plugins.md) component, you can build using mage:

```shell
mage -v build:linux

```

#### Build targets[​](#build-targets "Direct link to Build targets")

| Option         | Description                                  | Example               |
| -------------- | -------------------------------------------- | --------------------- |
| `build:[arch]` | Builds a binary for a specific architecture. | `mage -v build:Linux` |

List all available Mage targets for additional commands:

```bash
mage -l

```

### Run the Grafana server[​](#run-the-grafana-server "Direct link to Run the Grafana server")

To launch the Grafana development server using Docker, run:

```shell
docker compose up --build

```

Congratulations! You've just scaffolded your first plugin which you can now access at <http://localhost:3000>.

## Next steps[​](#next-steps "Direct link to Next steps")

* Start your plugin journey with one of our [plugin development tutorials](https://grafana.com/developers/plugin-tools/tutorials.md).
* Learn how to [extend](https://grafana.com/developers/plugin-tools/how-to-guides.md) the plugin's functionality.
* Review the [plugin examples](https://github.com/grafana/grafana-plugin-examples) to learn about good practices.
* Learn how to [package](https://grafana.com/developers/plugin-tools/publish-a-plugin/package-a-plugin.md), [sign](https://grafana.com/developers/plugin-tools/publish-a-plugin/sign-a-plugin.md), and [publish](https://grafana.com/developers/plugin-tools/publish-a-plugin/publish-a-plugin.md) your plugin to the Grafana [plugin catalog](https://grafana.com/plugins).
* Use the [available resources](https://grafana.com/developers/plugin-tools/resources.md), including [Grafana Community](https://community.grafana.com/), the official Grafana Labs forums, and the [Community Slack](https://slack.grafana.com/).
