build(examples): added Next.js otel example

examples/nextjs-otel-example/.env-example

@@ -0,0 +1,4 @@
+AXIOM_TOKEN="xaat-***"
+AXIOM_DATASET="nextjs-otel-example"
+
+GEMINI_API_KEY="******"

examples/nextjs-otel-example/.gitignore

@@ -0,0 +1,41 @@
+# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
+
+# dependencies
+/node_modules
+/.pnp
+.pnp.*
+.yarn/*
+!.yarn/patches
+!.yarn/plugins
+!.yarn/releases
+!.yarn/versions
+
+# testing
+/coverage
+
+# next.js
+/.next/
+/out/
+
+# production
+/build
+
+# misc
+.DS_Store
+*.pem
+
+# debug
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+
+# local env files
+.env
+.env*.local
+
+# vercel
+.vercel
+
+# typescript
+*.tsbuildinfo
+next-env.d.ts

examples/nextjs-otel-example/.npmrc

@@ -0,0 +1 @@
+public-hoist-pattern[]=*require-in-the-middle*

examples/nextjs-otel-example/README.md

@@ -0,0 +1,21 @@
+# Next.js with Opentelemetry example
+
+This is a reference example for using Axiom's AI SDK with Next.js to collect and send traces. The example shows steps for:
+
+- Setting up a NodeSDK tracer under `src/instrumentation.ts` that points to Axiom
+- Wrapping AI SDK model under `src/shared/gemini.ts`
+- Utilizing `withSpan()` to generate text using Vercel's AI SDK under `app/page.tsx`
+
+## How to use
+
+You will need an Axiom dataset and API key, so gead ahead and create those on [Axiom's Console](https://app.axiom.co/datasets).
+
+Then prepare your environment variables
+
+- Copy the environment file: `cp .env-example .env`
+- In the new .env file, set gemini, Axiom API key and dataset name
+- Install deps: `pnpm install`
+- Run development server `pnpm dev`
+- Visit `http://localhost:3000`
+- Once the app loads a trace should be sent automatically to Axiom
+- Visit Axiom console and navigate to your dataset stream, a list of spans will be visible.

examples/nextjs-otel-example/next.config.js

@@ -0,0 +1,4 @@
+/** @type {import('next').NextConfig} */
+const nextConfig = {};
+
+module.exports = nextConfig;