Next.js Helpers

The @autoblogwriter/sdk/next entry point provides high-level helper functions designed for Next.js App Router. They read configuration from environment variables automatically and integrate with Next.js caching.

import {
  fetchBlogPosts,
  fetchBlogPost,
  generatePostMetadata,
  generateBlogSitemap,
  generateBlogRobots,
  createEnvRevalidateHandler,
} from "@autoblogwriter/sdk/next";

Data Fetching

`fetchBlogPosts(options?)`

Fetches a paginated list of published posts with automatic Next.js cache tagging.

import { fetchBlogPosts } from "@autoblogwriter/sdk/next";
 
// In a server component:
const { posts, nextCursor } = await fetchBlogPosts();

Options:

Param	Type	Default	Description
`limit`	`number`	`20`	Posts per page
`cursor`	`string`	—	Pagination cursor

Returns: PostsResponse — { posts: BlogPost[], nextCursor?: string }

Cache tag: autoblogwriter:{workspaceSlug}:posts

Example: Blog Listing Page

// app/blog/page.tsx
import Link from "next/link";
import { fetchBlogPosts } from "@autoblogwriter/sdk/next";
import { BlogPostList } from "@autoblogwriter/sdk/react";
 
export default async function BlogPage() {
  const { posts } = await fetchBlogPosts();
  return <BlogPostList posts={posts} linkComponent={Link} />;
}

Example: Pagination

// app/blog/page.tsx
import Link from "next/link";
import { fetchBlogPosts } from "@autoblogwriter/sdk/next";
import { BlogPostList } from "@autoblogwriter/sdk/react";
 
type Props = { searchParams: Promise<{ page?: string }> };
 
export default async function BlogPage({ searchParams }: Props) {
  const { page } = await searchParams;
  const { posts, nextCursor } = await fetchBlogPosts({
    limit: 10,
    cursor: page,
  });
 
  return (
    <div>
      <BlogPostList posts={posts} linkComponent={Link} />
      {nextCursor && (
        <Link href={`/blog?page=${nextCursor}`}>Next Page</Link>
      )}
    </div>
  );
}

`fetchBlogPost(slug)`

Fetches a single post by slug. Automatically calls notFound() if the post doesn't exist.

import { fetchBlogPost } from "@autoblogwriter/sdk/next";
 
const post = await fetchBlogPost("my-first-post");
// If not found, Next.js renders the nearest not-found.tsx

Parameters:

Param	Type	Description
`slug`	`string`	The post's URL slug

Returns: BlogPost — never returns null (calls notFound() instead)

Cache tag: autoblogwriter:{workspaceSlug}:post:{slug}

Example: Post Page

// app/blog/[slug]/page.tsx
import { fetchBlogPost, generatePostMetadata } from "@autoblogwriter/sdk/next";
import { BlogPost } from "@autoblogwriter/sdk/react";
 
type Props = { params: Promise<{ slug: string }> };
 
export async function generateMetadata({ params }: Props) {
  const { slug } = await params;
  return generatePostMetadata(slug);
}
 
export default async function PostPage({ params }: Props) {
  const { slug } = await params;
  const post = await fetchBlogPost(slug);
  return <BlogPost post={post} />;
}

SEO Metadata

`generatePostMetadata(slug)`

Generates Next.js Metadata object from a post's SEO fields. Returns {} if the post doesn't exist.

import { generatePostMetadata } from "@autoblogwriter/sdk/next";
import type { Metadata } from "next";
 
export async function generateMetadata({ params }: Props): Promise<Metadata> {
  const { slug } = await params;
  return generatePostMetadata(slug);
}

The returned metadata includes:

Field	Source
`title`	`post.seo.title` or `post.title`
`description`	`post.seo.description` or `post.excerpt`
`keywords`	`post.seo.keywords`
`alternates.canonical`	`post.metadata.canonicalUrl`
`openGraph.type`	`"article"`
`openGraph.title`	Same as `title`
`openGraph.description`	Same as `description`
`openGraph.images`	`post.metadata.ogImageUrl`
`openGraph.publishedTime`	`post.publishedAt`
`openGraph.modifiedTime`	`post.updatedAt`
`twitter.card`	`"summary_large_image"` (if OG image) or `"summary"`
`twitter.title`	Same as `title`
`twitter.description`	Same as `description`
`twitter.images`	`post.metadata.ogImageUrl`

`generateBlogSitemap()`

Generates a Next.js-compatible sitemap array from all published posts.

// app/sitemap.ts
import { generateBlogSitemap } from "@autoblogwriter/sdk/next";
 
export const revalidate = 300;
 
export default function sitemap() {
  return generateBlogSitemap();
}

Returns an array of { url, lastModified } entries using the SITE_URL env var and /blog as the route prefix.

`generateBlogRobots()`

Generates a Next.js-compatible robots.txt configuration.

// app/robots.ts
import { generateBlogRobots } from "@autoblogwriter/sdk/next";
 
export default function robots() {
  return generateBlogRobots();
}

Returns:

{
  "rules": [{ "userAgent": "*", "allow": "/" }],
  "sitemap": "https://yoursite.com/sitemap.xml"
}

Route Handlers

`createEnvRevalidateHandler()`

Creates a Next.js API route handler for receiving AutoBlogWriter webhooks. See Webhooks & Revalidation for full details.

// app/api/autoblogwriter/revalidate/route.ts
import { createEnvRevalidateHandler } from "@autoblogwriter/sdk/next";
 
export const runtime = "nodejs";
export const POST = createEnvRevalidateHandler();

Next Steps

React Components — Render posts with built-in components.
Webhooks & Revalidation — Deep dive into cache invalidation.
Client Reference — Manual client usage for non-Next.js apps.