Next.js Blog

Read your published BabyLoveGrowth articles server-side and render them as a blog on your own Next.js (App Router) site — article lists, article pages, tag pages, and a sitemap, all on your own domain. The babylovegrowth-next-js-blog package is the read client; one scaffold command drops in a ready-made app/blog.

Integration Video

Requirements

• Node.js 18.17+
• A Next.js App Router project (the starter uses Tailwind CSS classes)

Setup

1. Get your API key. In Settings → Integrations → Next.js Blog, click Connect, then add the key to .env.local:

   BABYLOVEGROWTH_BLOG_API_KEY=your_api_key

2. Install the package in your Next.js project:

   npm install babylovegrowth-next-js-blog

3. Scaffold the blog — copies the routes, components, sitemap, and styles into app/blog (or src/app/blog):

   npx babylovegrowth-next-js-blog init

4. Allow your article image host in next.config.js (the starter renders images with next/image):

   // next.config.ts
   import type { NextConfig } from 'next';
   
   const nextConfig: NextConfig = {
     images: { remotePatterns: [{ protocol: 'https', hostname: '*' }] },
   };
   
   export default nextConfig;

5. Run it: npm run dev, then open /blog.

Environment variables

Routes

Caching

Blog data uses ISR: it revalidates once per day in production, and changes appear quickly in development. New or updated articles can take up to a day to show unless you redeploy or add on-demand revalidation.

Sitemap

Submit /blog/sitemap.xml in Google Search Console, or merge it into your site's main sitemap. Set NEXT_PUBLIC_SITE_URL so its URLs are absolute.

Troubleshooting

• 401 Unauthorized — the key doesn't match the API it's calling. Check BABYLOVEGROWTH_BLOG_API_KEY, and restart the dev server after editing .env.local. If you point at a non-production backend, set BABYLOVEGROWTH_BLOG_API_URL.
• No articles — only published articles are returned. Confirm the website tied to this key has published articles.
• Images don't load — add the image host to next.config.js under images.remotePatterns.
• New articles missing — that's the daily ISR cache; redeploy or add on-demand revalidation.

Prefer a no-code option? Use Blog Hosting to host your blog on a subdomain with one DNS record.