Next.js Guide

Recommended approach

Client-side widget

Use @testiflow/react in a client component for dashboard-style embeds on marketing pages:

tsx'use client';
import { TestiflowWall } from '@testiflow/react';

export function SocialProof() {
  return <TestiflowWall siteId={process.env.NEXT_PUBLIC_TESTIFLOW_SITE_ID!} layout="grid" />;
}

SEO public wall

Link to your hosted wall for maximum SEO benefit:

https://testiflow.site/w/your-public-slug

Or fetch JSON server-side:

tsconst res = await fetch(`${process.env.NEXT_PUBLIC_SITE_URL}/api/public/walls/my-slug`, {
  next: { revalidate: 3600 },
});
const data = await res.json();

Environment variables

• NEXT_PUBLIC_APP_URL — your app origin for redirects
• Site ID is per-site from the dashboard, not a global env var