Add LogQL 101 tutorial

[nicolevanderhoeven]

LogQL 101 Tutorial

Beginner-friendly, step-by-step guide for writing LogQL queries in Grafana Explore.

Note for testing: This tutorial requires a data source on Grafana Play. You'll need to be on this page to start, and I've added an initial (skippable) navigational step to ensure this.

Topics covered

• Selecting a Loki data source
• Setting the time range
• Label selectors
• Line filters (|=, !=)
• JSON parsing (| json)
• Line formatting (| line_format)
• Regex matching (|~)
• Metrics from logs (count_over_time, rate, sum by)
• Creating a graph from the metrics

[Jayclifford345]

aaah i think i know what might be happening. It may be due to the fact tooltip is being used at the multistep container level

 "type": "multistep",
          "tooltip": "Select the data source used by this guide.",
          "content": "Select **LokiNGINXLogs** in the Data source menu. This datasource contains logs from an Nginx web server and we'll be using it for the rest of this tutorial.",

rather than being used at the step level for example:

 {
          "type": "multistep",
          "content": "Use the **Add** button to send your queries to a new dashboard.",
          "requirements": ["section-completed:section-explore-tutorial"],
          "steps": [
            {
              "action": "highlight",
              "reftarget": "button[aria-label=\"Add\"]",
              "requirements": ["exists-reftarget"]
            },
            {
              "action": "highlight",
              "reftarget": "button:contains(\"Add to dashboard\")",
              "requirements": ["exists-reftarget"]
            },
            {
              "action": "highlight",
              "reftarget": "button:contains(\"Open dashboard\")",
              "requirements": ["exists-reftarget"],
              "tooltip": "One of Grafana's best features is the seamless transition from Explore to dashboards. Instead of manually recreating your queries, you can send them directly from Explore to a new or existing dashboard. This workflow saves time and ensures your carefully crafted queries make it to your dashboard exactly as you tested them."
            }
          ]
        },

i think that might be somthing we need to clear up in block editor and happy to review the rest

[moxious]

See individual comments, two over-arching things:

• Consider the use of skippable: true on steps that are complex or are side-quests. Never use skippable: true if taking one step sets you up for the next
• You can actually drop the HTML version from your PR entirely. The HTML is now the legacy format, so the overall tutorial will be cleaner if it's JSON only and it's less for you to keep in sync. There are some discrepencies between your JSON and HTML, but they're not worth fixing, since if you have JSON, the actual plugin will never look at your HTML.

[moxious]

NOTE: Flag as cloud only (not OSS) -- in part because controls in Explore are different 🫤

Doesn't impact much though bc this targets Play, which is cloud

[moxious]

Cross-linking necessary product fix for guide: grafana/grafana-pathfinder-app#496