Developer-Native Marketing

Next.js Setup Example

Wire GTM Toolkit into a Next.js 14 project using the App Router, static content, and CI automation.

Project Structure

Recommended folders for content and generated assets

app/
└── (marketing)/
    └── blog/
        └── [slug]/
            └── page.tsx
content/
└── blog/
    └── 2025-08-05-content-linting-matters.md
public/
├── sitemap.xml
└── robots.txt

Static Props via Contentlayer (optional)

Use markdown frontmatter alongside GTM Toolkit linting

// contentlayer.config.ts
import { defineDocumentType, makeSource } from 'contentlayer/source-files';

export const BlogPost = defineDocumentType(() => ({
  name: 'BlogPost',
  filePathPattern: 'blog/*.md',
  fields: {
    title: { type: 'string', required: true },
    date: { type: 'string', required: true },
    summary: { type: 'string', required: true },
    category: { type: 'string', required: true },
  },
}));

export default makeSource({
  contentDirPath: 'content',
  documentTypes: [BlogPost],
});

Next.js Route Example

Render content produced by GTM Toolkit linted markdown

// app/(marketing)/blog/[slug]/page.tsx
import { allBlogPosts } from 'contentlayer/generated';
import { notFound } from 'next/navigation';

export default function BlogPost({ params }: { params: { slug: string } }) {
  const post = allBlogPosts.find((entry) => entry.slug === params.slug);
  if (!post) {
    return notFound();
  }

  return (
    <article className="prose dark:prose-invert">
      <h1>{post.title}</h1>
      <p className="text-sm text-gray-500">{post.summary}</p>
      <div dangerouslySetInnerHTML={{ __html: post.body.html }} />
    </article>
  );
}

CI Integration

Minimal GitHub Actions job for linting and generation

name: content-quality
on:
  pull_request:
    paths:
      - 'content/**'

jobs:
  seo:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v4
      - uses: actions/setup-node@v4
        with:
          node-version: 20
      - run: npm ci
      - run: npx gtm-toolkit lint content/blog --format json --fail-on-error > lint-report.json
      - run: npx gtm-toolkit generate --all

Pair this setup with next-sitemap or static route metadata if you want to expose GTM Toolkit’s results directly in the Next.js runtime.