Next.js installation (ReactionSDK)
App Router–friendly: client components for custom elements and overlays.
For ReactifySDK, see ReactifySDK Next.js installation.
1) Install SDK
ReactionSDK
npm install @reactionsaas/reaction-sdk2) Embed video
Use a client component when rendering custom elements.
Client component
"use client";
export function Video() {
return <reaction-video src="https://yourcdn.com/video.mp4"></reaction-video>;
}3) Configure overlays
Full attributes
"use client";
export function Video() {
return (
<reaction-video
src="https://yourcdn.com/video.mp4"
overlays="tap,poll,slider,rating"
poll-question="Which style do you prefer?"
cta-text="Buy Now"
overlay-position="bottom-center"
interaction-type="tap"
></reaction-video>
);
}Run in Playground
<reaction-video src="video.mp4" overlays="tap,poll,rating,slider,cta" cta-text="Buy Now" interaction-type="rating"></reaction-video>Try this config in the Playground.
4) View analytics dashboard
Open the dashboard to see impressions, interactions, and engagement analytics.