Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
10 changes: 10 additions & 0 deletions apps/site/src/app/mcp/page.tsx
Original file line number Diff line number Diff line change
@@ -1,3 +1,5 @@
import { JsonLd } from "@/components/json-ld";
import { createSoftwareApplicationStructuredData } from "@/lib/structured-data";
import type { Metadata } from "next";

import { type McpAgent, McpAgentsSection } from "./_components/mcp-agents-section";
Expand All @@ -6,6 +8,13 @@ import { McpCtaSection } from "./_components/mcp-cta-section";
import { type McpHeroFeature, McpHeroSection } from "./_components/mcp-hero-section";
import { McpVideoSection } from "./_components/mcp-video-section";

const mcpStructuredData = createSoftwareApplicationStructuredData({
path: "/mcp",
name: "Prisma MCP Server",
description:
"AI-powered database management via Model Context Protocol. Manage databases with natural language in Claude, Codex, Cursor, Warp, ChatGPT and other AI agents.",
});

export const metadata: Metadata = {
title: "Prisma MCP Server — AI-Powered Database Management",
description:
Expand Down Expand Up @@ -175,6 +184,7 @@ const capabilities: McpCapability[] = [
export default function McpPage() {
return (
<main className="relative flex-1 w-full -mt-24 flex flex-col overflow-x-hidden bg-[linear-gradient(0deg,var(--color-background-default)_95%,var(--color-background-ppg)_100%)] text-foreground-neutral">
<JsonLd id="mcp-software-application" data={mcpStructuredData} />
<div className="relative z-1 flex flex-col">
<McpHeroSection docsHref={DOCS_MCP} features={heroFeatures} />
<McpVideoSection />
Expand Down
83 changes: 33 additions & 50 deletions apps/site/src/app/orm/page.tsx
Original file line number Diff line number Diff line change
@@ -1,3 +1,5 @@
import { JsonLd } from "@/components/json-ld";
import { createSoftwareApplicationStructuredData } from "@/lib/structured-data";
import { createPageMetadata } from "@/lib/page-metadata";
import { Action, Button, Card, Separator } from "@prisma/eclipse";
import { Bento } from "@/components/homepage/bento";
Expand Down Expand Up @@ -44,10 +46,7 @@ const CardFooter = () => (
<Separator className="my-6" />
<div className="flex flex-col md:flex-row justify-between w-full gap-8">
{badge_list.map((badge: any) => (
<div
className="flex flex-col md:flex-row gap-2 md:gap-6 md:items-center"
key={badge.title}
>
<div className="flex flex-col md:flex-row gap-2 md:gap-6 md:items-center" key={badge.title}>
<h6 className="font-semibold text-2xs text-foreground-neutral uppercase">
{badge.title}
</h6>
Expand Down Expand Up @@ -82,9 +81,9 @@ const twoCol = [
</h2>
</div>
<p className="text-foreground-neutral-weak! text-base">
Database workflows can feel brittle and error-prone. Prisma ORM
increases productivity and confidence when working with databases and
makes workflows like data modeling, migrations and querying easy.
Database workflows can feel brittle and error-prone. Prisma ORM increases productivity and
confidence when working with databases and makes workflows like data modeling, migrations
and querying easy.
</p>
</>
),
Expand Down Expand Up @@ -112,8 +111,8 @@ const twoCol = [
Works with your favorite databases and frameworks
</h2>
<p className="text-foreground-neutral-weak! text-base">
Prisma's compatibility with popular tools ensures no stack lock-in,
lower integration costs, and smooth transitions.
Prisma's compatibility with popular tools ensures no stack lock-in, lower integration
costs, and smooth transitions.
</p>
<a href="/stack" className="link-btn orm">
<span>Learn more</span>
Expand Down Expand Up @@ -145,15 +144,10 @@ const twoCol_2 = [
</h2>
</div>
<p className="text-foreground-neutral-weak! text-base">
A meaningful comparison of database query latencies across database
providers and ORM libraries in the Node.js & TypeScript ecosystem.
A meaningful comparison of database query latencies across database providers and ORM
libraries in the Node.js & TypeScript ecosystem.
</p>
<Button
variant="orm"
size="xl"
href="https://benchmarks.prisma.io"
className="w-fit"
>
<Button variant="orm" size="xl" href="https://benchmarks.prisma.io" className="w-fit">
<span>Explore Benchmarks</span>
<i className="fa-regular fa-arrow-right ml-2!" />
</Button>
Expand Down Expand Up @@ -181,10 +175,9 @@ const twoCol_2 = [
</h2>
</div>
<p className="text-foreground-neutral-weak! text-base">
Prisma Client is a query builder that’s tailored to your schema. We
designed its API to be intuitive, both for SQL veterans and developers
brand new to databases. The auto-completion helps you figure out your
query without the need for documentation.
Prisma Client is a query builder that’s tailored to your schema. We designed its API to be
intuitive, both for SQL veterans and developers brand new to databases. The
auto-completion helps you figure out your query without the need for documentation.
</p>
<a href="/client" className="link-btn orm">
<span>Learn more</span>
Expand Down Expand Up @@ -265,6 +258,13 @@ const features = [
},
];

const ormStructuredData = createSoftwareApplicationStructuredData({
path: "/orm",
name: "Prisma ORM",
description:
"Next-generation Node.js and TypeScript ORM for PostgreSQL, MySQL, SQL Server, SQLite, MongoDB, and CockroachDB. Provides type-safety, automated migrations, and an intuitive data model.",
});

export const metadata = createPageMetadata({
title: "Prisma | Next-generation ORM for Node.js & TypeScript",
description:
Expand All @@ -276,15 +276,16 @@ export const metadata = createPageMetadata({
export default function ORM() {
return (
<main className="flex-1 w-full z-1 ">
<JsonLd id="orm-software-application" data={ormStructuredData} />
<div className="hero pt-50 -mt-24 flex items-end justify-center px-4 relative">
<div className="absolute inset-0 z-0 bg-[linear-gradient(180deg,var(--color-foreground-orm)_0%,var(--color-background-default)_100%)] opacity-20" />
<div className="content relative z-2 flex flex-col gap-8 py-12">
<h1 className="text-5xl md:text-6xl stretch-display mb-0 text-center mt-0 font-sans-display text-foreground-neutral max-w-224 mx-auto">
Next-generation Node.js and TypeScript ORM
</h1>
<p className="text-center text-foreground-neutral max-w-2xl mx-auto">
Prisma ORM elevates developer experience with intuitive data
modeling, automated migrations, and type-safety.
Prisma ORM elevates developer experience with intuitive data modeling, automated
migrations, and type-safety.
</p>
<div className="flex flex-col md:flex-row gap-4 items-center justify-center">
<Button
Expand Down Expand Up @@ -332,30 +333,16 @@ export default function ORM() {
<div className="grid md:grid-cols-2 gap-9">
{twoCol_3.map((stat, index) => (
<div key={stat.title} className="flex flex-col gap-4">
<Action
size="4xl"
color="orm"
className={cn(index === 0 && "p-0", "relative")}
>
<Action size="4xl" color="orm" className={cn(index === 0 && "p-0", "relative")}>
<Image src={stat.icon} alt={stat.title} fill loading="lazy" />
</Action>
<h4 className="text-2xl font-sans-display stretch-display text-foreground-neutral">
{stat.title}
</h4>
<p className="text-foreground-neutral-weak">
{stat.description}
</p>
<Button
variant="default-stronger"
href={stat.btn.url}
size="xl"
className="w-fit"
>
<p className="text-foreground-neutral-weak">{stat.description}</p>
<Button variant="default-stronger" href={stat.btn.url} size="xl" className="w-fit">
<span>
{stat.btn.label}{" "}
{stat.btn.icon && (
<i className={cn("ml-2", stat.btn.icon)} />
)}
{stat.btn.label} {stat.btn.icon && <i className={cn("ml-2", stat.btn.icon)} />}
</span>
</Button>
</div>
Expand All @@ -372,8 +359,8 @@ export default function ORM() {
</h3>
<div className="content flex flex-col lg:flex-row gap-3 lg:gap-12 items-center md:items-start lg:items-center">
<p className="max-w-94 w-full text-center md:text-left text-foreground-neutral-weak text-md">
Integrate Prisma into your development ecosystem and focus on your
team’s core competencies
Integrate Prisma into your development ecosystem and focus on your team’s core
competencies
</p>
<Button variant="orm" size="2xl" href="/enterprise">
<span>Explore Enterprise</span>
Expand Down Expand Up @@ -418,16 +405,12 @@ export default function ORM() {
Ready to get started?
</h2>
<p className="text-foreground-neutral-weak max-w-121">
Start from scratch, add Prisma ORM to your existing project, or
explore how to build an app using your favorite framework.
Start from scratch, add Prisma ORM to your existing project, or explore how to build
an app using your favorite framework.
</p>
</div>
<div className="flex flex-col md:flex-row gap-6">
<Button
variant="orm"
size="2xl"
href={prismaPostgresQuickstartUrl}
>
<Button variant="orm" size="2xl" href={prismaPostgresQuickstartUrl}>
<span>Try Prisma ORM</span>
<i className="fa-regular fa-arrow-right ml-2" />
</Button>
Expand Down
50 changes: 21 additions & 29 deletions apps/site/src/app/studio/page.tsx
Original file line number Diff line number Diff line change
@@ -1,3 +1,5 @@
import { JsonLd } from "@/components/json-ld";
import { createSoftwareApplicationStructuredData } from "@/lib/structured-data";
import type { Metadata } from "next";
import { Button } from "@prisma/eclipse";
import Image from "next/image";
Expand Down Expand Up @@ -39,8 +41,7 @@ const featureRows = [
description:
"Access your database anywhere. Work locally for rapid development or use Console for team collaboration. Switch seamlessly between solo and team workflows.",
imageSrc: "/illustrations/studio/laptop.svg",
imageAlt:
"Prisma Studio interface showing local and collaborative workflows",
imageAlt: "Prisma Studio interface showing local and collaborative workflows",
imageWidth: 522,
imageHeight: 295,
},
Expand All @@ -50,8 +51,7 @@ const featureRows = [
description:
"Browse your database visually with powerful filters and search. Spot patterns instantly and get insights for debugging or schema changes, no SQL needed.",
imageSrc: "/illustrations/studio/explore.svg",
imageAlt:
"Prisma Studio data exploration interface with highlighted filters",
imageAlt: "Prisma Studio data exploration interface with highlighted filters",
imageWidth: 546,
imageHeight: 275,
},
Expand Down Expand Up @@ -87,6 +87,13 @@ const featureRows = [
},
] as const;

const studioStructuredData = createSoftwareApplicationStructuredData({
path: "/studio",
name: "Prisma Studio",
description:
"Visual database browser and editor for Prisma. Explore and manipulate your data with an intuitive interface, locally or in the Prisma Data Platform.",
});

export const metadata: Metadata = {
title: "Prisma Studio — Visual Database Browser & Editor",
description:
Expand Down Expand Up @@ -120,6 +127,7 @@ export const metadata: Metadata = {
export default function StudioPage() {
return (
<main className="flex-1 w-full -mt-24 bg-background-default text-foreground-neutral">
<JsonLd id="studio-software-application" data={studioStructuredData} />
{/* Hero Section */}
<section className="relative overflow-hidden bg-[linear-gradient(180deg,var(--color-background-orm)_0%,var(--color-background-default)_72%)] px-4 pt-60 pb-12">
<div className="pointer-events-none absolute inset-x-1/2 top-20 h-[780px] w-[1664px] -translate-x-1/2 rounded-full bg-[repeating-radial-gradient(circle_at_top,rgba(99,102,241,0.28)_0,rgba(99,102,241,0.28)_2px,transparent_2px,transparent_42px)] opacity-45 mask-[linear-gradient(to_bottom,rgba(0,0,0,0.9),transparent_78%)]" />
Expand All @@ -140,8 +148,8 @@ export default function StudioPage() {
</div>

<p className="m-0 max-w-[650px] text-lg leading-8 text-foreground-neutral md:text-xl">
The ultimate tool for exploring and editing data in your Prisma
project. Work locally or team up inside the Prisma Console.
The ultimate tool for exploring and editing data in your Prisma project. Work locally
or team up inside the Prisma Console.
</p>

<div className="flex flex-col items-center gap-4 sm:flex-row">
Expand All @@ -155,11 +163,7 @@ export default function StudioPage() {
<span>Explore Studio in Prisma Console</span>
<i className="fa-regular fa-arrow-up-right ml-2" />
</Button>
<Button
variant="default-stronger"
size="2xl"
href={STUDIO_DOCS_URL}
>
<Button variant="default-stronger" size="2xl" href={STUDIO_DOCS_URL}>
<span>Try locally</span>
<i className="fa-regular fa-arrow-down ml-2" />
</Button>
Expand All @@ -185,10 +189,7 @@ export default function StudioPage() {
>
<div className="flex items-start gap-4">
<div className="flex size-12 items-center justify-center rounded-md bg-background-orm p-3">
<i
className={`${card.icon} text-lg text-foreground-orm`}
aria-hidden="true"
/>
<i className={`${card.icon} text-lg text-foreground-orm`} aria-hidden="true" />
</div>
<div>
<h2 className="m-0 text-xl leading-7 text-foreground-neutral font-sans-display [font-variation-settings:'wght'_800]">
Expand Down Expand Up @@ -232,9 +233,8 @@ export default function StudioPage() {
See how Studio works
</h2>
<p className="m-0 mt-4 text-base leading-6 text-foreground-neutral-weak">
Access Prisma Studio on your local machine during development,
or in the Platform Console to collaborate on data with your
team.
Access Prisma Studio on your local machine during development, or in the Platform
Console to collaborate on data with your team.
</p>
</div>

Expand Down Expand Up @@ -274,8 +274,7 @@ export default function StudioPage() {
Try it out!
</h2>
<p className="m-0 mt-4 text-base leading-6 text-foreground-neutral-weak">
Take Studio for a spin with a local pre-seeded database and
example project.
Take Studio for a spin with a local pre-seeded database and example project.
</p>
</div>

Expand Down Expand Up @@ -332,17 +331,10 @@ function FeatureRow({
<h2 className="m-0 mt-2 text-4xl leading-10 text-foreground-neutral font-sans-display [font-variation-settings:'wght'_900]">
{title}
</h2>
<p className="m-0 mt-4 text-base leading-8 text-foreground-neutral-weak">
{description}
</p>
<p className="m-0 mt-4 text-base leading-8 text-foreground-neutral-weak">{description}</p>
</div>

<StudioFeatureImage
src={imageSrc}
alt={imageAlt}
width={imageWidth}
height={imageHeight}
/>
<StudioFeatureImage src={imageSrc} alt={imageAlt} width={imageWidth} height={imageHeight} />
</div>
);
}
Expand Down
42 changes: 37 additions & 5 deletions apps/site/src/lib/structured-data.ts
Original file line number Diff line number Diff line change
Expand Up @@ -65,11 +65,7 @@ export function createSiteStructuredData() {
};
}

export function createFaqStructuredData(
pagePath: string,
faqs: FaqEntry[],
name: string,
) {
export function createFaqStructuredData(pagePath: string, faqs: FaqEntry[], name: string) {
return {
"@context": "https://schema.org",
"@type": "FAQPage",
Expand All @@ -87,6 +83,42 @@ export function createFaqStructuredData(
};
}

export function createSoftwareApplicationStructuredData({
path,
name,
description,
applicationCategory = "DeveloperApplication",
operatingSystem = "Cross-platform",
}: {
path: string;
name: string;
description: string;
applicationCategory?: string;
operatingSystem?: string;
}) {
const url = absoluteUrl(path);
const baseUrl = getBaseUrl();

return {
"@context": "https://schema.org",
"@type": "SoftwareApplication",
"@id": `${url}#software`,
name,
description,
url,
applicationCategory,
operatingSystem,
offers: {
"@type": "Offer",
price: "0",
priceCurrency: "USD",
},
provider: {
"@id": `${baseUrl}#organization`,
},
};
}

export function createCollectionPageStructuredData({
path,
name,
Expand Down
Loading