Use Cases

SEO dengan Claude Code

Pelajari tentang seo menggunakan Claude Code. Dilengkapi tips praktis dan contoh kode.

サイトマップ自動generateでSEO対策をefisiensi

サイトマップ Google dll. pencarianエンジン サイトstruktur 伝えるpentingなfile.halaman 増えるたび 手動 pembaruan 現実的 あり tidak.Claude Code 使えば、build時 自動generateさmekanisme waktu singkat pembangunan bisa dilakukan.

dasar的なサイトマップgeneratescript

> XMLサイトマップ 自動generateするscript buatkan.
> 全halaman URL 収集し、lastmod・changefreq・priority konfigurasi.
// scripts/generate-sitemap.ts
import { globby } from 'globby';
import { writeFileSync } from 'fs';

interface SitemapEntry {
  url: string;
  lastmod: string;
  changefreq: 'daily' | 'weekly' | 'monthly';
  priority: number;
}

async function generateSitemap() {
  const baseUrl = 'https://example.com';
  
  // halamanfile 収集
  const pages = await globby([
    'src/pages/**/*.astro',
    'src/content/blog/**/*.mdx',
    '!src/pages/api/**',
    '!src/pages/404.astro',
  ]);

  const entries: SitemapEntry[] = pages.map(page => {
    const path = page
      .replace('src/pages/', '')
      .replace('src/content/blog/', 'blog/')
      .replace(/\.(astro|mdx)$/, '')
      .replace(/\/index$/, '/');

    return {
      url: `${baseUrl}/${path}`,
      lastmod: new Date().toISOString().split('T')[0],
      changefreq: path.includes('blog') ? 'weekly' : 'monthly',
      priority: path === '' ? 1.0 : path.includes('blog') ? 0.7 : 0.8,
    };
  });

  const xml = buildXml(entries);
  writeFileSync('public/sitemap.xml', xml);
  console.log(`✅ サイトマップgenerateselesai: ${entries.length}halaman`);
}

function buildXml(entries: SitemapEntry[]): string {
  return `<?xml version="1.0" encoding="UTF-8"?>
<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
${entries.map(e => `  <url>
    <loc>${e.url}</loc>
    <lastmod>${e.lastmod}</lastmod>
    <changefreq>${e.changefreq}</changefreq>
    <priority>${e.priority}</priority>
  </url>`).join('\n')}
</urlset>`;
}

generateSitemap();

dukungan 動的ルートへ

ブログartikel seperti 動的 generateさhalaman juga 、kontendirektori dari 自動的 収集 bisa dilakukan.

// Astroproyek integrasi例
import { getCollection } from 'astro:content';

export async function getStaticPaths() {
  const posts = await getCollection('blog');
  return posts.map(post => ({
    params: { slug: post.slug },
    props: { post },
  }));
}

// サイトマップ用 メタ情報 output
async function collectBlogEntries(baseUrl: string): Promise<SitemapEntry[]> {
  const posts = await getCollection('blog');
  
  return posts
    .filter(post => !post.data.draft)
    .map(post => ({
      url: `${baseUrl}/blog/${post.slug}`,
      lastmod: post.data.pubDate.toISOString().split('T')[0],
      changefreq: 'weekly' as const,
      priority: 0.7,
    }));
}

implementasi サイトマップindex

大規模サイト 、サイトマップ 分割 indexfile manajemen.

function buildSitemapIndex(sitemaps: string[]): string {
  const baseUrl = 'https://example.com';
  return `<?xml version="1.0" encoding="UTF-8"?>
<sitemapindex xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
${sitemaps.map(name => `  <sitemap>
    <loc>${baseUrl}/${name}</loc>
    <lastmod>${new Date().toISOString().split('T')[0]}</lastmod>
  </sitemap>`).join('\n')}
</sitemapindex>`;
}

// 用途別 サイトマップ 分割
const sitemapFiles = [
  'sitemap-pages.xml',
  'sitemap-blog.xml',
  'sitemap-categories.xml',
];
writeFileSync('public/sitemap.xml', buildSitemapIndex(sitemapFiles));

Integrasi ke Build Pipeline

{
  "scripts": {
    "build": "astro build && tsx scripts/generate-sitemap.ts",
    "sitemap": "tsx scripts/generate-sitemap.ts",
    "postbuild": "tsx scripts/generate-sitemap.ts && tsx scripts/ping-search-engines.ts"
  }
}

integrasi robots.txt

> robots.txt サイトマップ URL tambahkan.
User-agent: *
Allow: /

Sitemap: https://example.com/sitemap.xml

notifikasi Google Search Consoleへ

// scripts/ping-search-engines.ts
async function pingSearchEngines(sitemapUrl: string) {
  const endpoints = [
    `https://www.google.com/ping?sitemap=${encodeURIComponent(sitemapUrl)}`,
    `https://www.bing.com/ping?sitemap=${encodeURIComponent(sitemapUrl)}`,
  ];

  for (const url of endpoints) {
    try {
      const res = await fetch(url);
      console.log(`Ping ${url}: ${res.status}`);
    } catch (error) {
      console.error(`Pinggagal: ${url}`, error);
    }
  }
}

pingSearchEngines('https://example.com/sitemap.xml');

Summary

Untuk サイトマップの自動generateは、SEO対策のdasar中のdasarです。Claude Codeを使えば、動的ルートの収集からbuildpipelineへの組み込みまで一気にimplementasiできます。CI/CDpipelineに組み込むことで、deployのたびに最新のサイトマップが自動的にgenerateされます。詳しい仕様, lihat sitemaps.org.

#Claude Code #sitemap #SEO #XML #automation