diff --git a/assets/styles/layouts/_homepage.scss b/assets/styles/layouts/_homepage.scss index a0583b4c9..ca92588e9 100644 --- a/assets/styles/layouts/_homepage.scss +++ b/assets/styles/layouts/_homepage.scss @@ -105,7 +105,7 @@ .product { padding: 0 1rem; display: flex; - flex: 1 1 50%; + flex: 1 1 33%; flex-direction: column; justify-content: space-between; max-width: 33%; @@ -118,11 +118,10 @@ line-height: 1.5rem; color: rgba($article-text, .7); } - } - &.new { - .product-info h3::after { - content: "New"; + h3[state] { + &::after { + content: attr(state); margin-left: .5rem; font-size: 1rem; padding: .25em .5em .25em .4em; @@ -132,6 +131,8 @@ font-style: italic; vertical-align: middle; } + + } } ul.product-links { @@ -227,6 +228,30 @@ background: $article-bg; } + .categories { + display: flex; + flex-direction: row; + flex-wrap: wrap; + // margin: 0 -1rem; + width: calc(100% + 2rem); + + .category { + &.full-width { + width: 100%; + } + &.two-thirds { + width: 66.66%; + .product { max-width: 50%; } + } + &.one-third { + width: 33.33%; + .product { + max-width: 100%; + } + } + } + } + .category-head{ margin: 1rem 0 2rem; &::after { @@ -234,6 +259,7 @@ display: block; border-top: 1px solid $article-hr; margin-top: -1.15rem; + width: calc(100% - 2rem); } } } @@ -441,6 +467,16 @@ ul {margin-bottom: 0;} } } + .categories .category { + &.two-thirds { + width: 100%; + .product { max-width: 100%; } + } + &.one-third { + width: 100%; + .product { max-width: 100%; } + } + } } #telegraf { flex-direction: column; diff --git a/assets/styles/layouts/article/_blocks.scss b/assets/styles/layouts/article/_blocks.scss index 090ee9560..62b205491 100644 --- a/assets/styles/layouts/article/_blocks.scss +++ b/assets/styles/layouts/article/_blocks.scss @@ -96,4 +96,5 @@ blockquote { "blocks/tip", "blocks/important", "blocks/warning", - "blocks/caution"; + "blocks/caution", + "blocks/beta"; diff --git a/assets/styles/layouts/article/blocks/_beta.scss b/assets/styles/layouts/article/blocks/_beta.scss new file mode 100644 index 000000000..b3ab3a70c --- /dev/null +++ b/assets/styles/layouts/article/blocks/_beta.scss @@ -0,0 +1,105 @@ +.block.beta { + @include gradient($grad-burningDusk); + padding: 4px; + border: none; + border-radius: 25px !important; + + .beta-content { + background: $article-bg; + border-radius: 21px; + padding: calc(1.65rem - 4px) calc(2rem - 4px) calc(.1rem + 4px) calc(2rem - 4px); + + h4 { + color: $article-heading; + } + + p {margin-bottom: 1rem;} + + .expand-wrapper { + border: none; + margin: .5rem 0 1.5rem; + } + .expand { + border: none; + padding: 0; + + .expand-content p { + margin-left: 2rem; + } + + ul { + + margin-top: -1rem; + + &.feedback-channels { + + padding: 0; + margin: -1rem 0 1.5rem 2rem; + list-style: none; + + a { + color: $article-heading; + font-weight: $medium; + position: relative; + + &.discord:before { + content: url('/svgs/discord.svg'); + display: inline-block; + height: 1.1rem; + width: 1.25rem; + vertical-align: top; + margin: 2px .65rem 0 0; + } + + &.community:before { + content: "\e900"; + color: $article-heading; + margin: 0 .65rem 0 0; + font-size: 1.2rem; + font-family: 'icomoon-v2'; + vertical-align: middle; + } + + &.slack:before { + content: url('/svgs/slack.svg'); + display: inline-block; + height: 1.1rem; + width: 1.1rem; + vertical-align: text-top; + margin-right: .65rem; + } + + &.reddit:before { + content: url('/svgs/reddit.svg'); + display: inline-block; + height: 1.1rem; + width: 1.2rem; + vertical-align: top; + margin: 2px .65rem 0 0; + } + + &::after { + content: "\e90a"; + font-family: 'icomoon-v4'; + font-weight: bold; + font-size: 1.3rem; + display: inline-block; + position: absolute; + @include gradient($grad-burningDusk); + background-clip: text; + -webkit-text-fill-color: transparent; + right: 0; + transform: translateX(.25rem); + opacity: 0; + transition: transform .2s, opacity .2s; + } + + &:hover { + &::after {transform: translateX(1.5rem); opacity: 1;} + } + } + } + } + } + } +} \ No newline at end of file diff --git a/content/influxdb3/explorer/_index.md b/content/influxdb3/explorer/_index.md new file mode 100644 index 000000000..65ec9c196 --- /dev/null +++ b/content/influxdb3/explorer/_index.md @@ -0,0 +1,36 @@ +--- +title: InfluxDB 3 Explorer documentation +description: > + InfluxDB 3 Explorer is a standalone web-based interface for interacting with InfluxDB 3 Core and Enterprise. Visualize, query, and manage your time series data efficiently. +menu: + influxdb3_explorer: + name: InfluxDB 3 Explorer +weight: 1 +--- + +InfluxDB 3 Explorer is the standalone web application designed for visualizing, querying, and managing your data stored in InfluxDB 3 Core and Enterprise. +Explorer provides an intuitive interface for interacting with your time series data, streamlining database operations and enhancing data insights. + +## Key features + +Use InfluxDB 3 Explorer for: + +- **Database and query management**: Create and manage InfluxDB 3 databases, admin and resource tokens, and configure new InfluxDB 3 Enterprise instances +- **Data visualization and analysis**: Query data with a built-in visualizer for enhanced data insights +- **Data ingestion**: Write new data and setup Telegraf configurations + +## Quick start + +Run the Docker image to start InfluxDB 3 Explorer: + +```sh +docker run --detach \ + --name influxdb3-explorer \ + --publish 8888:80 \ + --publish 8889:8888 \ + --env MODE=admin \ + quay.io/influxdb/influxdb3-explorer:latest +``` + +Install and run InfluxDB 3 Explorer +Get started with InfluxDB 3 Explorer diff --git a/content/influxdb3/explorer/about/_index.md b/content/influxdb3/explorer/about/_index.md new file mode 100644 index 000000000..fdf89a1c1 --- /dev/null +++ b/content/influxdb3/explorer/about/_index.md @@ -0,0 +1,28 @@ +--- +title: About the InfluxDB 3 Explorer project +description: > + Learn about InfluxDB 3 Explorer, the user interface and query tool for InfluxDB 3. +menu: + influxdb3_explorer: + name: About Explorer +weight: 10 +--- + +InfluxDB 3 Explorer is the user interface component of the InfluxDB 3 platform. +It provides visual management of databases and tokens and an easy way to querying +your time series data. Explorer is fully-featured for [InfluxDB 3 Core](/influxdb3/core/) +and [Enterprise](/influxdb3/enterprise/), but can also be used to query +[InfluxDB Cloud Serverless](/influxdb3/cloud-serverless/), +[InfluxDB Cloud Dedicated](/influxdb3/cloud-dedicated/) +and [InfluxDB Clustered](/influxdb3/clustered/). + +## Third Party Software + +InfluxData products contain third party software, which means the copyrighted, +patented, or otherwise legally protected software of third parties that is +incorporated in InfluxData products. + +Third party suppliers make no representation nor warranty with respect to such +third party software or any portion thereof. Third party suppliers assume no +liability for any claim that might arise with respect to such third party software, +nor for a customer’s use of or inability to use the third party software. diff --git a/content/influxdb3/explorer/get-started/_index.md b/content/influxdb3/explorer/get-started/_index.md new file mode 100644 index 000000000..e03d761f7 --- /dev/null +++ b/content/influxdb3/explorer/get-started/_index.md @@ -0,0 +1,14 @@ +--- +title: Get started using InfluxDB 3 Explorer +description: Follow steps to get started using InfluxDB 3 Explorer. +menu: + influxdb3_explorer: + name: Get started +weight: 3 +--- + +Follow steps to get started using InfluxDB 3 Explorer. + +{{< youtube "TbAz0AdaGH0" >}} + + diff --git a/content/influxdb3/explorer/get-started/connect.md b/content/influxdb3/explorer/get-started/connect.md new file mode 100644 index 000000000..7d717c024 --- /dev/null +++ b/content/influxdb3/explorer/get-started/connect.md @@ -0,0 +1,12 @@ +--- +title: Connect to a server +description: + Use InfluxDB 3 Explorer to connect to an InfluxDB 3 server. +menu: + influxdb3_explorer: + parent: Get started +weight: 101 +draft: true +--- + +Use InfluxDB 3 Explorer to connect to an InfluxDB 3 server. \ No newline at end of file diff --git a/content/influxdb3/explorer/install.md b/content/influxdb3/explorer/install.md new file mode 100644 index 000000000..6835df4bd --- /dev/null +++ b/content/influxdb3/explorer/install.md @@ -0,0 +1,216 @@ +--- +title: Install and run InfluxDB 3 Explorer +description: > + Use [Docker](https://docker.com) to install and run **InfluxDB 3 Explorer**. +menu: + influxdb3_explorer: + name: Install Explorer +weight: 2 +--- + +Use [Docker](https://docker.com) to install and run **InfluxDB 3 Explorer**. + + +- [Run the InfluxDB 3 Explorer Docker container](#run-the-influxdb-3-explorer-docker-container) +- [Enable TLS/SSL (HTTPS)](#enable-tlsssl-https) +- [Pre-configure InfluxDB connection settings](#pre-configure-influxdb-connection-settings) +- [Run in admin or query mode](#run-in-admin-or-query-mode) +- [Environment Variables](#environment-variables) +- [Volume Reference](#volume-reference) +- [Exposed Ports](#exposed-ports) + + +## Run the InfluxDB 3 Explorer Docker container + +1. **Install Docker** + + If you haven't already, install [Docker](https://docs.docker.com/engine/) or + [Docker Desktop](https://docs.docker.com/desktop/). + +2. **Pull the {{% product-name %}} Docker image** + + ```bash + docker pull quay.io/influxdb/influxdb3-explorer:latest + ``` + +3. **Create local directories** _(optional)_ + + {{% product-name %}} can mount the following directories on your local + machine: + + | Directory | Description | Permissions | + | :--------- | :------------------------------------------------------------------------------------------------ | :---------: | + | `./db` | Stores {{% product-name %}} application data | 700 | + | `./config` | Stores [pre-configured InfluxDB connection settings](#pre-configure-influxdb-connection-settings) | 755 | + | `./ssl` | Stores TLS/SSL certificates _(Required when [using TLS/SSL](#enable-tlsssl-https))_ | 755 | + + > [!Important] + > If you don't create and mount a local `./db` directory, {{% product-name %}} + > stores application data in the container's file system. + > This data will be lost when the container is deleted. + + To create these directories with the appropriate permissions, run the + following commands from your current working directory: + + ```bash + mkdir -m 700 ./db + mkdir -m 755 ./config + mkdir -m 755 ./ssl + ``` + +4. **Run the {{% product-name %}} container** + + Use the `docker run` command to start the {{% product-name %}} container. + Include the following: + + - Port mappings: + - `8888` to `80` (or `443` if using TLS/SSL) + - `8889` to `8888` + - Mounted volumes: + - `$(pwd)/db:/db:rw` + - `$(pwd)/config:/app-root/config:ro` + - `$(pwd)/ssl:/etc/nginx/ssl:ro` + - Any of the available [environment variables](#environment-variables) + + ```bash + docker run --detach \ + --name influxdb3-explorer \ + --publish 8888:80 \ + --publish 8889:8888 \ + --volume $(pwd)/config:/app-root/config:ro \ + --volume $(pwd)/db:/db:rw \ + --volume $(pwd)/ssl:/etc/nginx/ssl:ro \ + --env MODE=admin \ + quay.io/influxdb/influxdb3-explorer:latest + ``` + +5. **Access the {{% product-name %}} user interface (UI) at **. + +--- + +## Enable TLS/SSL (HTTPS) + +To enable TLS/SSL, mount valid certificate and key files into the container: + +1. **Place your TLS/SSL certificate files your local `./ssl` directory** + + Required files: + + - Certificate: `server.crt` or `fullchain.pem` + - Private key: `server.key` + +2. **When running your container, mount the SSL directory and map port 443 to port 8888** + + Include the following options when running your Docker container: + + ```sh + --volume $(pwd)/ssl:/etc/nginx/ssl:ro \ + --publish 8888:443 + ``` + +The nginx web server automatically uses certificate files when they are present +in the mounted path. + +--- + +## Pre-configure InfluxDB connection settings + +You can predefine InfluxDB connection settings using a `config.json` file. + +{{% code-placeholders "INFLUXDB3_HOST|INFLUXDB_DATABASE_NAME|INFLUXDB3_AUTH_TOKEN|INFLUXDB3_SERVER_NAME" %}} + +1. **Create a `config.json` file in your local `./config` directory** + + ```json + { + "DEFAULT_INFLUX_SERVER": "INFLUXDB3_HOST", + "DEFAULT_INFLUX_DATABASE": "INFLUXDB_DATABASE_NAME", + "DEFAULT_API_TOKEN": "INFLUXDB3_AUTH_TOKEN", + "DEFAULT_SERVER_NAME": "INFLUXDB3_SERVER_NAME" + } + ``` + + > [!Important] + > If connecting to an InfluxDB 3 Core or Enterprise instance running on + > localhost (outside of the container), use the internal Docker network to + > in your InfluxDB 3 host value--for example: + > + > ```txt + > http://host.docker.internal:8181 + > ``` + +2. **Mount the configuration directory** + + Include the following option when running your Docker container: + + ```sh + --volume $(pwd)/config:/app-root/config:ro + ``` + +{{% /code-placeholders %}} + +These settings will be used as defaults when the container starts. + +--- + +## Run in query or admin mode + +{{% product-name %}} has the following operational modes: + +- **Query mode (default):** Read-only UI and query interface +- **Admin mode:** Full UI and API access for administrators + +You can control the operational mode using the `MODE` environment variable. + +### Run in query mode {note="(default)"} + +```sh +docker run -d \ + -e MODE=query \ + ... +``` + +### Run in admin mode + +```sh +docker run -d \ + -e MODE=admin \ + ... +``` + +If `MODE` is not set, the container defaults to query mode. + +--- + +## Environment Variables + +| Variable | Description | Default | +|----------------|--------------------------------------------------|----------------------| +| `DATABASE_URL` | Path to SQLite DB inside container | `/db/sqlite.db` | +| `MODE` | Set to `admin` or `query` | `query` | + +--- + +## Volume Reference + +| Container Path | Purpose | Host Example | +|----------------------|------------------------------|----------------------------| +| `/db` | SQLite DB storage | `./db` | +| `/app-root/config` | JSON config for defaults | `./config` | +| `/etc/nginx/ssl` | SSL certs for HTTPS | `./ssl` | + +--- + +## Exposed Ports + +| Port | Protocol | Purpose | +|------|----------|-------------------------| +| 80 | HTTP | Web access (unencrypted) | +| 443 | HTTPS | Web access (encrypted) | + +### Custom port mapping + +```sh +# Map ports to custom host values +-p 8888:80 -p 8443:443 +``` diff --git a/cypress/downloads/downloads.html b/cypress/downloads/downloads.html new file mode 100644 index 000000000..523cdaa3e Binary files /dev/null and b/cypress/downloads/downloads.html differ diff --git a/data/products.yml b/data/products.yml index 1a73b3902..9e86821dc 100644 --- a/data/products.yml +++ b/data/products.yml @@ -27,6 +27,20 @@ influxdb3_enterprise: - How do I install and run InfluxDB 3 Enterprise? - Help me write a plugin for the Python Processing engine? - How do I start a read replica node with InfluxDB 3 Enterprise? + +influxdb3_explorer: + name: InfluxDB 3 Explorer + altname: Explorer + namespace: influxdb3_explorer + menu_category: tools + list_order: 1 + latest: explorer + latest_patch: 1.0.0 + placeholder_host: localhost:8888 + ai_sample_questions: + - How do I query data using InfluxDB 3 Explorer? + - How do I use InfluxDB 3 Explorer to visualize data? + - How do I install InfluxDB 3 Explorer? influxdb3_cloud_serverless: name: InfluxDB Cloud Serverless @@ -108,6 +122,20 @@ influxdb_cloud: - How is Cloud 2 different from Cloud Serverless? - How do I manage auth tokens in InfluxDB Cloud 2? +explorer: + name: InfluxDB 3 Explorer + namespace: explorer + menu_category: other + list_order: 4 + versions: [v1] + latest: v1.0 + latest_patches: + v1: 1.0.0 + ai_sample_questions: + - How do I use InfluxDB 3 Explorer to visualize data? + - How do I create a dashboard in InfluxDB 3 Explorer? + - How do I query data using InfluxDB 3 Explorer? + telegraf: name: Telegraf namespace: telegraf diff --git a/layouts/index.html b/layouts/index.html index 2e7c9f016..b04b66e5c 100644 --- a/layouts/index.html +++ b/layouts/index.html @@ -39,64 +39,87 @@

InfluxDB 3

The modern time series data engine built for high-speed, high-cardinality data, from the edge to the cloud.

-
-

Self-managed

-
-
-
-
-

InfluxDB 3 Core

-

The open source recent data engine optimized for time series and event data.

+
+
+
+

Self-managed

+
+
+
+
+

InfluxDB 3 Core

+

The open source recent data engine optimized for time series and event data.

+
+ +
+
+
+

InfluxDB 3 Enterprise

+

The scalable data engine built for recent and historical time series and event data.

+
+ +
+
+
+

InfluxDB Clustered

+

The Kubernetes-enabled, highly-available InfluxDB 3 cluster built for high write and query workloads on your own infrastructure.

+
+ +
-
-
-
-

InfluxDB 3 Enterprise

-

The scalable data engine built for recent and historical time series and event data.

+
+
+

Fully-Managed

+
+
+
+
+

InfluxDB Cloud Serverless

+

The fully-managed, multi-tenant InfluxDB 3 service deployed in the cloud.

+
+ +
+
+
+

InfluxDB Cloud Dedicated

+

The fully-managed InfluxDB 3 cluster dedicated to your workload and deployed in the cloud.

+
+ +
-
-
-
-

InfluxDB Clustered

-

The Kubernetes-enabled, highly-available InfluxDB 3 cluster built for high write and query workloads on your own infrastructure.

+
+
+

Tools

- -
-
-
-

Fully-Managed

-
-
-
-
-

InfluxDB Cloud Serverless

-

The fully-managed, multi-tenant InfluxDB 3 service deployed in the cloud.

+
+
+
+

InfluxDB 3 Explorer

+

A standalone UI designed for visualizing, querying, and managing data in InfluxDB 3 Core and Enterprise.

+
+ +
- -
-
-
-

InfluxDB Cloud Dedicated

-

The fully-managed InfluxDB 3 cluster dedicated to your workload and deployed in the cloud.

-
-
diff --git a/layouts/partials/article.html b/layouts/partials/article.html index 986e59f30..bbe22ed84 100644 --- a/layouts/partials/article.html +++ b/layouts/partials/article.html @@ -5,6 +5,7 @@ {{ partial "article/supported-versions.html" . }} {{ partial "article/page-meta.html" . }}
+ {{ partial "article/beta.html" . }} {{ partial "article/stable-version.html" . }} {{ partial "article/flux-experimental.html" . }} {{ partial "article/flux-contrib.html" . }} diff --git a/layouts/partials/article/beta.html b/layouts/partials/article/beta.html new file mode 100644 index 000000000..d2288dd53 --- /dev/null +++ b/layouts/partials/article/beta.html @@ -0,0 +1,39 @@ + +{{ $productPathData := split .RelPermalink "/" }} +{{ $product := index $productPathData 1 }} +{{ $version := index $productPathData 2 }} +{{ $productKey := cond (eq $product "influxdb3") (print "influxdb3_" (replaceRE "-" "_" $version)) $product }} +{{ $productData := index $.Site.Data.products $productKey }} +{{ $displayName := $productData.name }} +{{ $earlyAccessList := slice "influxdb3/explorer" }} + +{{ if in $earlyAccessList (print $product "/" $version )}} +
+
+

{{ $displayName }} is in Public Beta

+

+ {{ $displayName }} is in public beta and available for testing and feedback, + but is not meant for production use yet. + Both the product and this documentation are works in progress. + We welcome and encourage your input about your experience with the beta and + invite you to join our public channels for updates and to + share feedback. +

+
+ +
+
+
+{{ end }} \ No newline at end of file diff --git a/layouts/partials/footer/search.html b/layouts/partials/footer/search.html index 6df87ec39..c0405957f 100644 --- a/layouts/partials/footer/search.html +++ b/layouts/partials/footer/search.html @@ -5,7 +5,7 @@ {{ $fluxSupported := slice "influxdb" "enterprise_influxdb" }} {{ $influxdbFluxSupport := slice "v1" "v2" "cloud" }} {{ $includeFlux := and (in $fluxSupported $product) (in $influxdbFluxSupport $version) }} -{{ $includeResources := not (in (slice "cloud-serverless" "cloud-dedicated" "clustered" "core" "enterprise") $version) }} +{{ $includeResources := not (in (slice "cloud-serverless" "cloud-dedicated" "clustered" "core" "enterprise" "explorer") $version) }}