docs: add free open source analytics
This commit is contained in:
Carl-Gerhard Lindesvärd
388
apps/public/src/app/(content)/open-source/page.tsx
Normal file
388
apps/public/src/app/(content)/open-source/page.tsx
Normal file
@@ -0,0 +1,388 @@
|
|||||||
|
import { CtaBanner } from '@/app/(home)/_sections/cta-banner';
|
||||||
|
import { HeroContainer } from '@/app/(home)/_sections/hero';
|
||||||
|
import { FaqItem, Faqs } from '@/components/faq';
|
||||||
|
import { FeatureCard } from '@/components/feature-card';
|
||||||
|
import { Section, SectionHeader } from '@/components/section';
|
||||||
|
import { Button } from '@/components/ui/button';
|
||||||
|
import { url } from '@/lib/layout.shared';
|
||||||
|
import { getOgImageUrl, getPageMetadata } from '@/lib/metadata';
|
||||||
|
import {
|
||||||
|
BarChartIcon,
|
||||||
|
CheckIcon,
|
||||||
|
CodeIcon,
|
||||||
|
GlobeIcon,
|
||||||
|
HeartHandshakeIcon,
|
||||||
|
LinkIcon,
|
||||||
|
MailIcon,
|
||||||
|
MessageSquareIcon,
|
||||||
|
SparklesIcon,
|
||||||
|
UsersIcon,
|
||||||
|
ZapIcon,
|
||||||
|
} from 'lucide-react';
|
||||||
|
import type { Metadata } from 'next';
|
||||||
|
import Link from 'next/link';
|
||||||
|
import Script from 'next/script';
|
||||||
|
|
||||||
|
export const metadata: Metadata = getPageMetadata({
|
||||||
|
title: 'Free Analytics for Open Source Projects | OpenPanel OSS Program',
|
||||||
|
description:
|
||||||
|
"Get free web and product analytics for your open source project. Track up to 2.5M events/month. Apply to OpenPanel's open source program today.",
|
||||||
|
url: url('/open-source'),
|
||||||
|
image: getOgImageUrl('/open-source'),
|
||||||
|
});
|
||||||
|
|
||||||
|
const jsonLd = {
|
||||||
|
'@context': 'https://schema.org',
|
||||||
|
'@type': 'WebPage',
|
||||||
|
name: 'Free Analytics for Open Source Projects | OpenPanel OSS Program',
|
||||||
|
description:
|
||||||
|
"Get free web and product analytics for your open source project. Track up to 2.5M events/month. Apply to OpenPanel's open source program today.",
|
||||||
|
url: url('/open-source'),
|
||||||
|
publisher: {
|
||||||
|
'@type': 'Organization',
|
||||||
|
name: 'OpenPanel',
|
||||||
|
logo: {
|
||||||
|
'@type': 'ImageObject',
|
||||||
|
url: url('/logo.png'),
|
||||||
|
},
|
||||||
|
},
|
||||||
|
mainEntity: {
|
||||||
|
'@type': 'Offer',
|
||||||
|
name: 'Free Analytics for Open Source Projects',
|
||||||
|
description:
|
||||||
|
'Free analytics service for open source projects up to 2.5M events per month',
|
||||||
|
price: '0',
|
||||||
|
priceCurrency: 'USD',
|
||||||
|
},
|
||||||
|
};
|
||||||
|
|
||||||
|
export default function OpenSourcePage() {
|
||||||
|
return (
|
||||||
|
<div>
|
||||||
|
<Script
|
||||||
|
id="open-source-schema"
|
||||||
|
strategy="beforeInteractive"
|
||||||
|
type="application/ld+json"
|
||||||
|
dangerouslySetInnerHTML={{ __html: JSON.stringify(jsonLd) }}
|
||||||
|
/>
|
||||||
|
<HeroContainer>
|
||||||
|
<div className="col center-center flex-1">
|
||||||
|
<SectionHeader
|
||||||
|
as="h1"
|
||||||
|
align="center"
|
||||||
|
className="flex-1"
|
||||||
|
title={
|
||||||
|
<>
|
||||||
|
Free Analytics for
|
||||||
|
<br />
|
||||||
|
Open Source Projects
|
||||||
|
</>
|
||||||
|
}
|
||||||
|
description="Track your users, understand adoption, and grow your project - all without cost. Get free analytics for your open source project with up to 2.5M events per month."
|
||||||
|
/>
|
||||||
|
<div className="col gap-4 justify-center items-center mt-8">
|
||||||
|
<Button size="lg" asChild>
|
||||||
|
<Link href="mailto:oss@openpanel.dev">
|
||||||
|
Apply for Free Access
|
||||||
|
<MailIcon className="size-4" />
|
||||||
|
</Link>
|
||||||
|
</Button>
|
||||||
|
<p className="text-sm text-muted-foreground">
|
||||||
|
Up to 2.5M events/month • No credit card required
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</HeroContainer>
|
||||||
|
|
||||||
|
<div className="container">
|
||||||
|
<div className="col gap-16">
|
||||||
|
{/* What You Get Section */}
|
||||||
|
<Section className="my-0">
|
||||||
|
<SectionHeader
|
||||||
|
title="What you get"
|
||||||
|
description="Everything you need to understand your users and grow your open source project."
|
||||||
|
/>
|
||||||
|
<div className="grid md:grid-cols-2 gap-6 mt-8">
|
||||||
|
<FeatureCard
|
||||||
|
title="2.5 Million Events/Month"
|
||||||
|
description="More than enough for most open source projects. Track page views, user actions, and custom events without worrying about limits."
|
||||||
|
icon={BarChartIcon}
|
||||||
|
/>
|
||||||
|
<FeatureCard
|
||||||
|
title="Full Feature Access"
|
||||||
|
description="Same powerful capabilities as paid plans. Funnels, retention analysis, custom dashboards, and real-time analytics."
|
||||||
|
icon={ZapIcon}
|
||||||
|
/>
|
||||||
|
<FeatureCard
|
||||||
|
title="Unlimited Team Members"
|
||||||
|
description="Invite your entire contributor team. Collaborate with maintainers and core contributors on understanding your project's growth."
|
||||||
|
icon={UsersIcon}
|
||||||
|
/>
|
||||||
|
<FeatureCard
|
||||||
|
title="Priority Support"
|
||||||
|
description="Dedicated help for open source maintainers. Get faster responses and priority assistance when you need it."
|
||||||
|
icon={MessageSquareIcon}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</Section>
|
||||||
|
|
||||||
|
{/* Why We Do This Section */}
|
||||||
|
<Section className="my-0">
|
||||||
|
<SectionHeader
|
||||||
|
title="Why we do this"
|
||||||
|
description="OpenPanel is built by and for the open source community. We believe in giving back."
|
||||||
|
/>
|
||||||
|
<div className="col gap-6 mt-8">
|
||||||
|
<p className="text-muted-foreground">
|
||||||
|
We started OpenPanel because we believed analytics tools
|
||||||
|
shouldn't be complicated or locked behind expensive enterprise
|
||||||
|
subscriptions. As an open source project ourselves, we
|
||||||
|
understand the challenges of building and growing a project
|
||||||
|
without the resources of big corporations.
|
||||||
|
</p>
|
||||||
|
<div className="grid md:grid-cols-3 gap-4">
|
||||||
|
<FeatureCard
|
||||||
|
title="Built for OSS"
|
||||||
|
description="OpenPanel is open source. We know what it's like to build in the open."
|
||||||
|
icon={CodeIcon}
|
||||||
|
/>
|
||||||
|
<FeatureCard
|
||||||
|
title="No Barriers"
|
||||||
|
description="Analytics shouldn't be a barrier to understanding your users. We're removing that barrier."
|
||||||
|
icon={HeartHandshakeIcon}
|
||||||
|
/>
|
||||||
|
<FeatureCard
|
||||||
|
title="Giving Back"
|
||||||
|
description="We're giving back to the projects that inspire us and the community that supports us."
|
||||||
|
icon={SparklesIcon}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</Section>
|
||||||
|
|
||||||
|
{/* What We Ask In Return Section */}
|
||||||
|
<Section className="my-0">
|
||||||
|
<SectionHeader
|
||||||
|
title="What we ask in return"
|
||||||
|
description="We keep it simple. Just a small way to help us grow and support more projects."
|
||||||
|
/>
|
||||||
|
<div className="row gap-6 mt-8">
|
||||||
|
<div className="col gap-6">
|
||||||
|
<FeatureCard
|
||||||
|
title="Backlink to OpenPanel"
|
||||||
|
description="A simple link on your website or README helps others discover OpenPanel. It's a win-win for the community."
|
||||||
|
icon={LinkIcon}
|
||||||
|
>
|
||||||
|
<p className="text-sm text-muted-foreground mt-2">
|
||||||
|
Example: "Analytics powered by{' '}
|
||||||
|
<Link
|
||||||
|
href="https://openpanel.dev"
|
||||||
|
className="text-primary hover:underline"
|
||||||
|
>
|
||||||
|
OpenPanel
|
||||||
|
</Link>
|
||||||
|
"
|
||||||
|
</p>
|
||||||
|
</FeatureCard>
|
||||||
|
<FeatureCard
|
||||||
|
title="Display a Widget"
|
||||||
|
description="Showcase your visitor count with our real-time analytics widget. It's completely optional but helps spread the word."
|
||||||
|
icon={GlobeIcon}
|
||||||
|
>
|
||||||
|
<p className="text-sm text-muted-foreground mt-2">
|
||||||
|
Display real-time visitor counts, page views, or other
|
||||||
|
metrics on your project's website.
|
||||||
|
</p>
|
||||||
|
</FeatureCard>
|
||||||
|
<p className="text-muted-foreground">
|
||||||
|
That's it. No complicated requirements, no hidden fees, no
|
||||||
|
catch. We just want to help open source projects succeed.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
<div className="text-center text-xs text-muted-foreground">
|
||||||
|
<iframe
|
||||||
|
title="Realtime Widget"
|
||||||
|
src="https://dashboard.openpanel.dev/widget/realtime?shareId=26wVGY"
|
||||||
|
width="300"
|
||||||
|
height="400"
|
||||||
|
className="rounded-xl border mb-2"
|
||||||
|
/>
|
||||||
|
Analytics from{' '}
|
||||||
|
<a className="underline" href="https://openpanel.dev">
|
||||||
|
OpenPanel.dev
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</Section>
|
||||||
|
|
||||||
|
{/* Eligibility Criteria Section */}
|
||||||
|
<Section className="my-0">
|
||||||
|
<SectionHeader
|
||||||
|
title="Eligibility criteria"
|
||||||
|
description="We want to support legitimate open source projects that are making a difference."
|
||||||
|
/>
|
||||||
|
<div className="col gap-4 mt-8">
|
||||||
|
<div className="grid md:grid-cols-2 gap-4">
|
||||||
|
<div className="flex gap-3">
|
||||||
|
<CheckIcon className="size-5 text-primary mt-0.5 shrink-0" />
|
||||||
|
<div>
|
||||||
|
<h3 className="font-semibold mb-1">OSI-Approved License</h3>
|
||||||
|
<p className="text-sm text-muted-foreground">
|
||||||
|
Your project must use an OSI-approved open source license
|
||||||
|
(MIT, Apache, GPL, etc.)
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className="flex gap-3">
|
||||||
|
<CheckIcon className="size-5 text-primary mt-0.5 shrink-0" />
|
||||||
|
<div>
|
||||||
|
<h3 className="font-semibold mb-1">Public Repository</h3>
|
||||||
|
<p className="text-sm text-muted-foreground">
|
||||||
|
Your code must be publicly available on GitHub, GitLab, or
|
||||||
|
similar platforms
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className="flex gap-3">
|
||||||
|
<CheckIcon className="size-5 text-primary mt-0.5 shrink-0" />
|
||||||
|
<div>
|
||||||
|
<h3 className="font-semibold mb-1">Active Development</h3>
|
||||||
|
<p className="text-sm text-muted-foreground">
|
||||||
|
Show evidence of active development and a growing
|
||||||
|
community
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className="flex gap-3">
|
||||||
|
<CheckIcon className="size-5 text-primary mt-0.5 shrink-0" />
|
||||||
|
<div>
|
||||||
|
<h3 className="font-semibold mb-1">
|
||||||
|
Non-Commercial Primary Purpose
|
||||||
|
</h3>
|
||||||
|
<p className="text-sm text-muted-foreground">
|
||||||
|
The primary purpose should be non-commercial, though
|
||||||
|
commercial OSS projects may be considered
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</Section>
|
||||||
|
|
||||||
|
{/* How to Apply Section */}
|
||||||
|
<Section className="my-0">
|
||||||
|
<SectionHeader
|
||||||
|
title="How to apply"
|
||||||
|
description="Getting started is simple. Just send us an email with a few details about your project."
|
||||||
|
/>
|
||||||
|
<div className="col gap-6 mt-8">
|
||||||
|
<div className="grid md:grid-cols-3 gap-6">
|
||||||
|
<div className="col gap-3">
|
||||||
|
<div className="size-10 rounded-full bg-primary/10 center-center text-primary font-semibold">
|
||||||
|
1
|
||||||
|
</div>
|
||||||
|
<h3 className="font-semibold">Send us an email</h3>
|
||||||
|
<p className="text-sm text-muted-foreground">
|
||||||
|
Reach out to{' '}
|
||||||
|
<Link
|
||||||
|
href="mailto:oss@openpanel.dev"
|
||||||
|
className="text-primary hover:underline"
|
||||||
|
>
|
||||||
|
oss@openpanel.dev
|
||||||
|
</Link>{' '}
|
||||||
|
with your project details
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
<div className="col gap-3">
|
||||||
|
<div className="size-10 rounded-full bg-primary/10 center-center text-primary font-semibold">
|
||||||
|
2
|
||||||
|
</div>
|
||||||
|
<h3 className="font-semibold">Include project info</h3>
|
||||||
|
<p className="text-sm text-muted-foreground">
|
||||||
|
Share your project URL, license type, and a brief
|
||||||
|
description of what you're building
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
<div className="col gap-3">
|
||||||
|
<div className="size-10 rounded-full bg-primary/10 center-center text-primary font-semibold">
|
||||||
|
3
|
||||||
|
</div>
|
||||||
|
<h3 className="font-semibold">We'll review</h3>
|
||||||
|
<p className="text-sm text-muted-foreground">
|
||||||
|
We'll evaluate your project and respond within a few
|
||||||
|
business days
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className="mt-4">
|
||||||
|
<Button size="lg" asChild>
|
||||||
|
<Link href="mailto:oss@openpanel.dev?subject=Open Source Program Application">
|
||||||
|
Apply Now
|
||||||
|
<MailIcon className="size-4" />
|
||||||
|
</Link>
|
||||||
|
</Button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</Section>
|
||||||
|
|
||||||
|
{/* FAQ Section */}
|
||||||
|
<Section className="my-0">
|
||||||
|
<SectionHeader
|
||||||
|
title="Frequently asked questions"
|
||||||
|
description="Everything you need to know about our open source program."
|
||||||
|
/>
|
||||||
|
<div className="mt-8">
|
||||||
|
<Faqs>
|
||||||
|
<FaqItem question="What counts as an open-source project?">
|
||||||
|
We consider any project with an OSI-approved open source
|
||||||
|
license (MIT, Apache, GPL, BSD, etc.) that is publicly
|
||||||
|
available and actively maintained. The project should have a
|
||||||
|
non-commercial primary purpose, though we may consider
|
||||||
|
commercial open source projects on a case-by-case basis.
|
||||||
|
</FaqItem>
|
||||||
|
<FaqItem question="What happens if I exceed 2.5M events per month?">
|
||||||
|
We understand that successful projects grow. If you
|
||||||
|
consistently exceed 2.5M events, we'll reach out to discuss
|
||||||
|
options. We're flexible and want to support your success. In
|
||||||
|
most cases, we can work out a solution that works for both of
|
||||||
|
us.
|
||||||
|
</FaqItem>
|
||||||
|
<FaqItem question="Can commercial open source projects apply?">
|
||||||
|
Yes, we consider commercial open source projects on a
|
||||||
|
case-by-case basis. If your project is open source but has
|
||||||
|
commercial offerings, please mention this in your application
|
||||||
|
and we'll evaluate accordingly.
|
||||||
|
</FaqItem>
|
||||||
|
<FaqItem question="How long does the free access last?">
|
||||||
|
As long as your project remains eligible and active, your free
|
||||||
|
access continues. We review projects periodically to ensure
|
||||||
|
they still meet our criteria, but we're committed to
|
||||||
|
supporting projects long-term.
|
||||||
|
</FaqItem>
|
||||||
|
<FaqItem question="Do I need to display the widget?">
|
||||||
|
No, displaying the widget is completely optional. We only
|
||||||
|
require a backlink to OpenPanel on your website or README. The
|
||||||
|
widget is just a nice way to showcase your analytics if you
|
||||||
|
want to.
|
||||||
|
</FaqItem>
|
||||||
|
<FaqItem question="What if my project is very small or just starting?">
|
||||||
|
We welcome projects of all sizes! Whether you're just getting
|
||||||
|
started or have a large community, if you meet our eligibility
|
||||||
|
criteria, we'd love to help. Small projects often benefit the
|
||||||
|
most from understanding their users early on.
|
||||||
|
</FaqItem>
|
||||||
|
</Faqs>
|
||||||
|
</div>
|
||||||
|
</Section>
|
||||||
|
|
||||||
|
<CtaBanner
|
||||||
|
title="Ready to get free analytics for your open source project?"
|
||||||
|
description="Join other open source projects using OpenPanel to understand their users and grow their communities. Apply today and get started in minutes."
|
||||||
|
ctaText="Apply for Free Access"
|
||||||
|
ctaLink="mailto:oss@openpanel.dev?subject=Open Source Program Application"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
@@ -26,6 +26,13 @@ async function getOgData(
|
|||||||
'Support OpenPanel and get exclusive perks like latest Docker images, prioritized support, and early access to new features.',
|
'Support OpenPanel and get exclusive perks like latest Docker images, prioritized support, and early access to new features.',
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
|
case 'open-source': {
|
||||||
|
return {
|
||||||
|
title: 'Free analytics for open source projects',
|
||||||
|
description:
|
||||||
|
"Get free web and product analytics for your open source project. Track up to 2.5M events/month. Apply to OpenPanel's open source program today.",
|
||||||
|
};
|
||||||
|
}
|
||||||
case 'pricing': {
|
case 'pricing': {
|
||||||
return {
|
return {
|
||||||
title: 'Pricing',
|
title: 'Pricing',
|
||||||
|
|||||||
@@ -25,6 +25,10 @@ export async function Footer() {
|
|||||||
{ title: 'About', url: '/about' },
|
{ title: 'About', url: '/about' },
|
||||||
{ title: 'Contact', url: '/contact' },
|
{ title: 'Contact', url: '/contact' },
|
||||||
{ title: 'Become a supporter', url: '/supporter' },
|
{ title: 'Become a supporter', url: '/supporter' },
|
||||||
|
{
|
||||||
|
title: 'Free analytics for open source projects',
|
||||||
|
url: '/open-source',
|
||||||
|
},
|
||||||
]}
|
]}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
Reference in New Issue
Block a user