Add Comments to Your Next.js App

Om elk component en elke flow lokaal te zien draaien tegen de openbare demo tenant, kloon de repo en voer uit:

cd example
npm install
npm run dev

Elk component heeft zijn eigen route onder example/app/ die je rechtstreeks in je eigen Next.js-app kunt kopiëren.

npm install fastcomments-nextjs

// app/page.tsx
import { FastComments } from 'fastcomments-nextjs';

export default function Page() {
    return <FastComments tenantId="demo" />;
}

Vervang "demo" door je FastComments tenant ID. De component geeft al 'use client' aan, dus je kunt deze vanuit een servercomponent renderen.

Alle componenten worden geëxporteerd vanuit de root van het pakket:

import {
    FastComments,
    FastCommentsLiveChat,
    FastCommentsReviewsSummary,
} from 'fastcomments-nextjs';

Als je FastComments via de Vercel Marketplace-integratie hebt geïnstalleerd, is je tenant-ID beschikbaar als de FASTCOMMENTS_TENANT_ID omgevingsvariabele. Om deze aan de clientzijde te lezen, maak je deze beschikbaar via next.config.js of voeg je het voorvoegsel NEXT_PUBLIC_ toe:

<FastComments tenantId={process.env.NEXT_PUBLIC_FASTCOMMENTS_TENANT_ID!} />

Een werkende demo is opgenomen in de map example/:

cd example && npm install && npm run dev

• FastComments Documentatie
• Aanpassing & Configuratie
• Next.js Documentatie

Deze componenten zijn wrappers rond onze kern-VanillaJS-componenten. We kunnen deze componenten automatisch bijwerken (bugs oplossen, functies toevoegen) zonder deze bibliotheek te publiceren, dus hoewel het misschien een tijdje niet gepubliceerd wordt, betekent dat niet dat FastComments niet actief in ontwikkeling is! Voel je vrij om onze blog te bekijken voor updates. Wijzigingen of functies die de API breken zullen nooit naar de onderliggende kernbibliotheek worden uitgebracht zonder een versienummerverhoging in deze bibliotheek.