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.

:::note[Resilient by default] All helpers in @autoblogwriter/sdk/next are now resilient — they log a console.warn and return safe defaults when env vars are missing or the API is unavailable, rather than throwing and crashing your page. fetchBlogPost calls notFound() on all error types (including config errors and API failures) so the page always shows a 404 instead of a 500.

If you need the same graceful behaviour in a non-Next.js framework (Remix, Astro, Express), use @autoblogwriter/sdk/helpers instead. :::

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 or if there's a configuration or API error (so pages always show a 404 rather than crashing).

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() on missing post, config errors, and API errors)

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. Returns [] on config or API errors (prevents a 500 sitemap page).

`generateBlogRobots()`

Generates a Next.js-compatible robots.txt configuration. Returns a minimal allow: "/" fallback on config errors (prevents a 500 robots page).

// 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.