zias/stats
1
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

public: feature pages

Browse Source
This commit is contained in:
Carl-Gerhard Lindesvärd
2026-02-07 16:42:02 +00:00
parent ed8b5c667e
commit 6ce9b5dd1b
127 changed files with 3140 additions and 81 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
apps/public/content/guides/ecommerce-tracking.mdx
View File

@@ -4,6 +4,7 @@ description: "Track product views, cart activity, and purchases with OpenPanel t
difficulty: intermediate
timeToComplete: 10
date: 2025-12-15
updated: 2026-02-07
cover: /content/cover-default.jpg
team: OpenPanel Team
steps:
@@ -19,7 +20,7 @@ steps:
# How to track e-commerce events and revenue
E-commerce tracking gives you visibility into how users interact with your products and what drives purchases. By the end of this guide, you'll have product views, cart events, and revenue tracking working in your store.
E-commerce tracking gives you visibility into how users interact with your products and what drives purchases. By the end of this guide, you'll have product views, cart events, and [revenue tracking](/features/revenue-tracking) working in your store.
OpenPanel tracks revenue using a dedicated `revenue()` method that links payments to visitor sessions. This lets you see which traffic sources, campaigns, and pages generate the most revenue. You can track from your frontend for quick setup, or from your backend via webhooks for more accurate data.
@@ -177,7 +178,7 @@ If events aren't appearing, check that your Client ID is correct and that ad blo
## Next steps
Once you have basic e-commerce tracking working, you can build purchase funnels to visualize conversion rates at each step. The [revenue tracking documentation](/docs/revenue-tracking) covers advanced patterns like subscription tracking and refunds. For a deeper understanding of attribution, read about how OpenPanel's [cookieless tracking](/articles/cookieless-analytics) works.
Once you have basic e-commerce tracking working, you can build purchase [funnels](/features/funnels) to visualize [conversion rates](/features/conversion) at each step. The [revenue tracking documentation](/docs/revenue-tracking) covers advanced patterns like subscription tracking and refunds. For a deeper understanding of attribution, read about how OpenPanel's [cookieless tracking](/articles/cookieless-analytics) works.
To learn more about tracking custom events in general, check out the [track custom events guide](/guides/track-custom-events) which covers event structure, properties, and common patterns.

3
apps/public/content/guides/express-analytics.mdx
View File

@@ -4,6 +4,7 @@ description: "Add server-side analytics to your Express application with OpenPan
difficulty: beginner
timeToComplete: 8
date: 2025-12-15
updated: 2026-02-07
cover: /content/cover-default.jpg
team: OpenPanel Team
steps:
@@ -21,7 +22,7 @@ steps:
# How to add analytics to Express
Server-side analytics gives you reliable event tracking that cannot be blocked by ad blockers or browser extensions. The OpenPanel Express middleware wraps the JavaScript SDK and attaches it to every request, making it simple to track events throughout your application.
Server-side analytics gives you reliable [event tracking](/features/event-tracking) that cannot be blocked by ad blockers or browser extensions. The OpenPanel Express middleware wraps the JavaScript SDK and attaches it to every request, making it simple to track events throughout your application.
OpenPanel is an open-source alternative to Mixpanel and Amplitude. You get powerful analytics with full control over your data, and you can [self-host](/articles/how-to-self-host-openpanel) if privacy requirements demand it.

3
apps/public/content/guides/kotlin-analytics.mdx
View File

@@ -5,6 +5,7 @@ type: guide
difficulty: intermediate
timeToComplete: 10
date: 2025-12-15
updated: 2026-02-07
lastUpdated: 2025-12-15
team: OpenPanel Team
steps:
@@ -24,7 +25,7 @@ steps:
# How to add analytics to Android apps
This guide walks you through adding OpenPanel analytics to an Android application using the Kotlin SDK. You'll learn how to track events, identify users, and monitor screen views across your app.
This guide walks you through adding OpenPanel analytics to an Android application using the Kotlin SDK. You'll learn how to track events, [identify users](/features/identify-users), and monitor screen views across your app.
OpenPanel works well for Android apps because it provides a lightweight, privacy-focused SDK that handles offline queuing and automatic system information collection. Unlike web SDKs, native apps require a client secret for authentication since CORS headers aren't available.

7
apps/public/content/guides/migrate-from-google-analytics.mdx
View File

@@ -4,6 +4,7 @@ description: "Switch from Google Analytics to OpenPanel in under an hour. Learn
difficulty: intermediate
timeToComplete: 45
date: 2025-12-15
updated: 2026-02-07
cover: /content/cover-default.jpg
team: OpenPanel Team
steps:
@@ -58,7 +59,7 @@ For projects using a build system, you can also install the npm package with `np
## Map your GA4 events [#map-events]
OpenPanel uses a `track()` API that closely mirrors GA4's event structure. Most of your existing event tracking can be migrated with minimal changes.
OpenPanel uses a `track()` API that closely mirrors GA4's event structure. Most of your existing [event tracking](/features/event-tracking) can be migrated with minimal changes.
### Page views
@@ -95,7 +96,7 @@ The event name and properties carry over directly. OpenPanel doesn't have the re
### User identification
GA4 uses `set user_properties` for user identification, while OpenPanel uses a dedicated `identify` method. This gives you richer user profiles and session history.
GA4 uses `set user_properties` for [user identification](/features/identify-users), while OpenPanel uses a dedicated `identify` method. This gives you richer user profiles and session history.
```js
window.op('identify', {
@@ -199,7 +200,7 @@ Since OpenPanel doesn't use cookies by default, you may be able to remove your c
Moving from GA4 to OpenPanel means gaining some things and losing others. You'll get privacy-first tracking without cookies, full ownership of your data (especially if you [self-host](/articles/how-to-self-host-openpanel)), and a simpler interface for day-to-day analytics.
On the other hand, you won't be able to import historical data from GA4 since Google doesn't provide an easy export mechanism. If you rely heavily on Google Ads conversion tracking, you'll need to either keep GA4 running for that specific use case or use Google Ads' standalone conversion tracking pixel.
On the other hand, you won't be able to import historical data from GA4 since Google doesn't provide an easy export mechanism. If you rely heavily on Google Ads [conversion tracking](/features/conversion), you'll need to either keep GA4 running for that specific use case or use Google Ads' standalone conversion tracking pixel.
GA4's attribution modeling is more sophisticated than OpenPanel's, so if you depend on multi-touch attribution for ad spend optimization, consider your requirements carefully before fully migrating.

7
apps/public/content/guides/migrate-from-mixpanel.mdx
View File

@@ -4,6 +4,7 @@ description: "Switch from Mixpanel to OpenPanel in under 2 hours with this step-
difficulty: intermediate
timeToComplete: 90
date: 2025-12-15
updated: 2026-02-07
cover: /content/cover-default.jpg
team: OpenPanel Team
steps:
@@ -73,7 +74,7 @@ If you're using Next.js, there's a dedicated package that handles both client an
OpenPanel's API follows similar patterns to Mixpanel, with a few naming convention differences. Mixpanel uses Title Case for events and properties, while OpenPanel uses snake_case.
Here's how basic event tracking translates. In Mixpanel, you might track a button click like this:
Here's how basic [event tracking](/features/event-tracking) translates. In Mixpanel, you might track a button click like this:
```js
mixpanel.track('Button Clicked', {
@@ -91,7 +92,7 @@ op.track('button_clicked', {
});
```
User identification works similarly, but OpenPanel uses a structured object instead of separate method calls. Mixpanel's pattern splits identify and people.set:
[User identification](/features/identify-users) works similarly, but OpenPanel uses a structured object instead of separate method calls. Mixpanel's pattern splits identify and people.set:
```js
mixpanel.identify('user_123');
@@ -198,7 +199,7 @@ function trackEvent(eventName, properties) {
trackEvent('button_clicked', { button_name: 'Sign Up' });
```
After a week, compare Mixpanel's Live View with OpenPanel's real-time dashboard. Check that event counts are close (they won't be exact due to timing differences), user profiles are being created correctly, and any funnels you've set up show similar conversion rates.
After a week, compare Mixpanel's Live View with OpenPanel's real-time dashboard. Check that event counts are close (they won't be exact due to timing differences), user profiles are being created correctly, and any [funnels](/features/funnels) you've set up show similar [conversion rates](/features/conversion).
## Remove Mixpanel [#remove]

3
apps/public/content/guides/nextjs-analytics.mdx
View File

@@ -4,6 +4,7 @@ description: "Add privacy-first analytics to your Next.js app in under 5 minutes
difficulty: beginner
timeToComplete: 8
date: 2025-12-15
updated: 2026-02-07
cover: /content/cover-default.jpg
team: OpenPanel Team
steps:
@@ -21,7 +22,7 @@ steps:
# How to add analytics to Next.js
This guide walks you through adding OpenPanel to a Next.js application. By the end, you'll have automatic page view tracking, custom event tracking, and user identification working in your app.
This guide walks you through adding OpenPanel to a Next.js application. By the end, you'll have automatic page view tracking, custom [event tracking](/features/event-tracking), and [user identification](/features/identify-users) working in your app.
OpenPanel works with both the App Router and Pages Router. It uses cookieless tracking by default, so you won't need cookie consent banners for basic analytics. If you're looking for a privacy-focused alternative to Mixpanel or Google Analytics, this is a straightforward setup.

3
apps/public/content/guides/nodejs-analytics.mdx
View File

@@ -4,6 +4,7 @@ description: "Add server-side analytics to your Node.js application. Track event
difficulty: beginner
timeToComplete: 7
date: 2025-12-14
updated: 2026-02-07
cover: /content/cover-default.jpg
team: OpenPanel Team
steps:
@@ -145,7 +146,7 @@ export async function sendEmailJob(userId, emailData) {
## Step 4: Identify users
To identify users and track their behavior:
To [identify users](/features/identify-users) and track their behavior:
```js title="routes/api/login.js"
import { op } from '@/lib/op';

3
apps/public/content/guides/nuxt-analytics.mdx
View File

@@ -4,6 +4,7 @@ description: "Add privacy-first analytics to your Nuxt app in under 5 minutes wi
difficulty: beginner
timeToComplete: 5
date: 2025-01-07
updated: 2026-02-07
cover: /content/cover-default.jpg
team: OpenPanel Team
steps:
@@ -131,7 +132,7 @@ $openpanel.track('my_event', { foo: 'bar' });
### Track form submissions
Form tracking helps you understand conversion rates and identify where users drop off.
Form tracking helps you understand [conversion rates](/features/conversion) and identify where users drop off.
```vue title="components/ContactForm.vue"
<script setup>

3
apps/public/content/guides/python-analytics.mdx
View File

@@ -5,6 +5,7 @@ type: guide
difficulty: beginner
timeToComplete: 7
date: 2025-12-15
updated: 2026-02-07
lastUpdated: 2025-12-15
team: OpenPanel Team
steps:
@@ -22,7 +23,7 @@ steps:
# How to add analytics to Python
This guide walks you through adding server-side analytics to any Python application. You'll install the OpenPanel SDK, configure it with your credentials, track custom events, and identify users.
This guide walks you through adding server-side analytics to any Python application. You'll install the OpenPanel SDK, configure it with your credentials, track custom events, and [identify users](/features/identify-users).
Server-side tracking gives you complete control over what data you collect and ensures events are never blocked by browser extensions or ad blockers. The Python SDK works with Django, Flask, FastAPI, and any other Python framework or script.

5
apps/public/content/guides/react-analytics.mdx
View File

@@ -4,6 +4,7 @@ description: "Add privacy-first analytics to your React application with OpenPan
difficulty: beginner
timeToComplete: 8
date: 2025-12-14
updated: 2026-02-07
cover: /content/cover-default.jpg
team: OpenPanel Team
steps:
@@ -21,7 +22,7 @@ steps:
anchor: "verify"
---
Adding analytics to your React application helps you understand how users interact with your app. OpenPanel's Web SDK works seamlessly with React and React Router, giving you page view tracking, custom events, and user identification without the complexity of dedicated React bindings.
Adding analytics to your React application helps you understand how users interact with your app. OpenPanel's Web SDK works seamlessly with React and React Router, giving you page view tracking, custom events, and [user identification](/features/identify-users) without the complexity of dedicated React bindings.
OpenPanel is an open-source alternative to Mixpanel and Google Analytics. It provides powerful insights while respecting user privacy through cookieless tracking by default.
@@ -151,7 +152,7 @@ export function SignupButton() {
### Track form submissions
Form tracking helps you understand conversion rates and identify where users drop off.
Form tracking helps you understand [conversion rates](/features/conversion) and identify where users drop off.
```tsx title="src/components/ContactForm.tsx"
import { useState } from 'react';

3
apps/public/content/guides/remix-analytics.mdx
View File

@@ -4,6 +4,7 @@ description: "Add privacy-first analytics to your Remix application with OpenPan
difficulty: beginner
timeToComplete: 8
date: 2025-12-14
updated: 2026-02-07
cover: /content/cover-default.jpg
team: OpenPanel Team
steps:
@@ -21,7 +22,7 @@ steps:
anchor: "verify"
---
Adding analytics to your Remix application helps you understand how users interact with your app. OpenPanel's Web SDK works seamlessly with Remix's client-side navigation, providing automatic page view tracking, custom events, and user identification.
Adding analytics to your Remix application helps you understand how users interact with your app. OpenPanel's Web SDK works seamlessly with Remix's client-side navigation, providing automatic page view tracking, custom events, and [user identification](/features/identify-users).
OpenPanel is an open-source alternative to Mixpanel and Google Analytics. It delivers powerful insights while respecting user privacy through cookieless tracking by default.

3
apps/public/content/guides/swift-analytics.mdx
View File

@@ -4,6 +4,7 @@ description: "Add privacy-first analytics to your iOS, macOS, tvOS, and watchOS
difficulty: beginner
timeToComplete: 10
date: 2025-12-15
updated: 2026-02-07
cover: /content/cover-default.jpg
team: OpenPanel Team
steps:
@@ -24,7 +25,7 @@ steps:
## Introduction
Understanding how users interact with your native Apple apps requires solid analytics. OpenPanel's Swift SDK gives you event tracking, user identification, and screen view analytics across iOS, macOS, tvOS, and watchOS platforms.
Understanding how users interact with your native Apple apps requires solid analytics. OpenPanel's Swift SDK gives you [event tracking](/features/event-tracking), [user identification](/features/identify-users), and screen view analytics across iOS, macOS, tvOS, and watchOS platforms.
Since native apps can't rely on CORS headers for authentication like web apps do, the Swift SDK uses a client secret for secure server-side authentication. This makes it suitable for production apps where you need reliable, privacy-respecting analytics. OpenPanel is an open-source alternative to Mixpanel and Amplitude that you can self-host for complete data ownership.

5
apps/public/content/guides/track-custom-events.mdx
View File

@@ -4,6 +4,7 @@ description: "Learn how to track custom events like button clicks, form submissi
difficulty: beginner
timeToComplete: 5
date: 2025-12-15
updated: 2026-02-07
cover: /content/cover-default.jpg
team: OpenPanel Team
steps:
@@ -23,7 +24,7 @@ steps:
Custom events are the foundation of product analytics. They let you track specific user actions like button clicks, form submissions, video plays, and purchases. This guide walks you through tracking custom events in OpenPanel across different platforms.
OpenPanel provides a consistent API for event tracking across all SDKs. Once you understand the pattern, you can apply it to any integration.
OpenPanel provides a consistent API for [event tracking](/features/event-tracking) across all SDKs. Once you understand the pattern, you can apply it to any integration.
## Prerequisites
@@ -199,7 +200,7 @@ If events aren't showing up, check that your Client ID is correct and that the S
## Next steps
Now that you're tracking custom events, you can identify users to connect events to specific people. For analyzing your event data, the [funnel analysis guide](/articles/how-to-create-a-funnel) shows you how to measure conversion rates across multi-step flows. You can also explore the [SDK documentation](/docs/sdks/web) for advanced features like global properties and event filtering.
Now that you're tracking custom events, you can [identify users](/features/identify-users) to connect events to specific people. For analyzing your event data, the [funnel analysis guide](/articles/how-to-create-a-funnel) shows you how to measure [conversion rates](/features/conversion) across multi-step flows. You can also explore the [SDK documentation](/docs/sdks/web) for advanced features like global properties and event filtering.
For framework-specific examples and setup instructions, check out:
- [Next.js analytics guide](/guides/nextjs-analytics) for Next.js applications

5
apps/public/content/guides/vue-analytics.mdx
View File

@@ -4,6 +4,7 @@ description: "Add privacy-first analytics to your Vue application with OpenPanel
difficulty: beginner
timeToComplete: 8
date: 2025-12-14
updated: 2026-02-07
cover: /content/cover-default.jpg
team: OpenPanel Team
steps:
@@ -21,7 +22,7 @@ steps:
anchor: "verify"
---
Adding analytics to your Vue application helps you understand how users interact with your app. OpenPanel's Web SDK integrates smoothly with Vue 3 and Vue Router, providing automatic page view tracking, custom events, and user identification without requiring Vue-specific bindings.
Adding analytics to your Vue application helps you understand how users interact with your app. OpenPanel's Web SDK integrates smoothly with Vue 3 and Vue Router, providing automatic page view tracking, custom events, and [user identification](/features/identify-users) without requiring Vue-specific bindings.
OpenPanel is an open-source alternative to Mixpanel and Google Analytics. It delivers powerful insights while respecting user privacy through cookieless tracking by default.
@@ -184,7 +185,7 @@ export default {
### Track form submissions
Form tracking helps you understand conversion rates and identify where users drop off.
Form tracking helps you understand [conversion rates](/features/conversion) and identify where users drop off.
```vue title="src/components/ContactForm.vue"
<template>

3
apps/public/content/guides/website-analytics-setup.mdx
View File

@@ -4,6 +4,7 @@ description: "Add privacy-first analytics to any website in minutes using a simp
difficulty: beginner
timeToComplete: 5
date: 2025-12-14
updated: 2026-02-07
cover: /content/cover-default.jpg
team: OpenPanel Team
steps:
@@ -149,7 +150,7 @@ Ad blockers can interfere with analytics scripts. If this is a concern for your
## Next steps
The script tag covers most tracking needs for traditional websites. For more advanced configuration options, check out the [Script Tag SDK reference](/docs/sdks/script). If you want to understand user journeys better, the article on [how to create a funnel](/articles/how-to-create-a-funnel) walks through setting up conversion funnels.
The script tag covers most tracking needs for traditional websites. For more advanced configuration options, check out the [Script Tag SDK reference](/docs/sdks/script). If you want to understand user journeys better, the article on [how to create a funnel](/articles/how-to-create-a-funnel) walks through setting up [conversion funnels](/features/funnels).
For sites with backend logic or server-side rendering, you might want to combine client-side tracking with server-side events. The [Node.js guide](/guides/nodejs-analytics) and [Python guide](/guides/python-analytics) cover those use cases.