React / Next.js Example

Quick summary

The Next.js fixture is an integration target, not a pre-configured YetdaPay app. Use it to practice installing a hosted donation link or copy-in React component.

Run the fixture first, perform the installation, then verify the public UI. For licensing use the server SDK; no dedicated Next.js license adapter exists.

examples/nextjs-site/ — "Starbound Arena", a minimal Next.js 14 (app router) fixture site used as an install target for the yetdapay-install skill. Like its Nuxt sibling it is intentionally not pre-integrated.

cd examples/nextjs-site
pnpm install     # or npm install — needs network on first install
pnpm dev         # http://localhost:3000

Candidate mount points are marked in app/page.tsx: header .nav, #support .support, .site-footer.

Install

// copy sdk/core.ts + sdk/react/YetdaPayButtons.tsx into the app
import { YetdaPayButtons } from './sdk/react/YetdaPayButtons';

<YetdaPayButtons publicId="intpub_…" mode="native" feature="donation" />

The component is already marked 'use client' — safe inside an app-router server component tree. Or skip components entirely with a hosted <a> to {SITE_ORIGIN}/h/{public_id}.

Scope note

This covers donation/feedback only — there is no Next.js license adapter; see Next.js SDK status (PLANNED / NOT_IMPLEMENTED) for what that means and the DIY routes.