Framework integration

Rankveo for Next.js

Publish in rankveo, render on your Next.js site. Push revalidation means a new article is live in seconds, not on the next cache expiry.
@rankveo/next

Installation

Install the package in your existing Next.js project.

terminal 
npm install @rankveo/next
Create a Rankveo account View source on GitHub

Three steps

1

Add your key

A blog key, available on every plan. Server-side only.

# .env.local
RANKVEO_BLOG_API_KEY=rk_...
NEXT_PUBLIC_SITE_URL=
  https://yoursite.com
2

Copy the starter

Listing, article, tag routes, sitemap. Yours to restyle.

cp -r \
  node_modules/@rankveo/next/\
  starter/app/blog app/blog
3

Read articles

From a Server Component, with Next’s cache hints built in.

import { BlogClient } from
  '@rankveo/next';

const blog = new BlogClient();
const { articles, total } =
  await blog.getArticles({
    page: 0, limit: 10,
  });

Seconds, not hours

Deploy one route handler and rankveo notifies it whenever an article is published, edited while live, unpublished, or deleted. The affected page drops out of your cache immediately.

  • Takedowns are fast too Unpublishing clears the page rather than leaving it served from cache.
  • Verified in constant time The bearer check ships in the package, so nobody reimplements it wrong.
  • Optional Without it the blog still updates - just on its own revalidate window. 
// app/api/rankveo/revalidate/route.ts

export async function POST(request: Request) {
  if (!verifyRevalidateSecret(
    request.headers.get('authorization'),
    process.env.RANKVEO_REVALIDATE_SECRET,
  )) {
    return Response.json(
      { revalidated: false }, { status: 401 },
    );
  }

  const { slug } = await request.json();
  revalidatePath('/blog');
  revalidatePath(`/blog/${slug}`);

  return Response.json({ revalidated: true });
}

What ships with it

The parts every blog needs and nobody enjoys writing.

Metadata and JSON-LD Canonical, Open Graph with every image, Twitter card, and BlogPosting structured data - generated from the article, not hand-maintained.
Sitemap with image entries Google indexes images declared in a sitemap that it would otherwise have to find by crawling. Next’s own sitemap does not emit them.
Image hosts on request next/image refuses hosts you have not declared. Ask the API which ones your articles actually use instead of guessing.
Keys that cannot leak The client throws if it ever finds itself running in a browser - whatever the variable was named.