Check out our Next.js example repository on GitHub, which includes implementations for both App Router and Page Router.
Step 1: Embed Surface Tag
Add Surface Tag to your Next.js site with custom code components
Step 2.1: Inline
Embed Surface Forms directly in your Next.js applications
Step 2.2.0: Surface Component
Create a Surface Component
Step 2.2.1: Popup
Display forms in modal overlays triggered by user interactions
Step 2.2.2: Slideover
Show forms that slide in from the side of the screen
Step 3: Optimize
Optimize form loading speed and user experience