ClaudeCodeLab
Use Cases

RSS Implementation dengan Claude Code

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

読者獲得を加速 RSSフィードでブログ

RSSフィード penyediaan こ dan 、ブログartikel pembaruan RSSリーダー 購読 juga らえ.Claude Code 使えば、RSS 2.0やAtomフィード generate waktu singkat implementasi bisa dilakukan.

dasar的なRSSフィードgenerate

> ブログartikel RSSフィード generateするendpoint buatkan.
> RSS 2.0形式 dengan 、最新20件 artikel distribusiして。
// src/pages/rss.xml.ts
import rss from '@astrojs/rss';
import { getCollection } from 'astro:content';
import sanitizeHtml from 'sanitize-html';
import MarkdownIt from 'markdown-it';

const parser = new MarkdownIt();

export async function GET(context: { site: string }) {
  const posts = await getCollection('blog');
  
  const sortedPosts = posts
    .filter(post => !post.data.draft)
    .sort((a, b) => 
      new Date(b.data.pubDate).getTime() - new Date(a.data.pubDate).getTime()
    )
    .slice(0, 20);

  return rss({
    title: 'My Tech Blog',
    description: 'Webpengembangan 関技術ブログ',
    site: context.site,
    items: sortedPosts.map(post => ({
      title: post.data.title,
      pubDate: new Date(post.data.pubDate),
      description: post.data.description,
      link: `/blog/${post.slug}/`,
      content: sanitizeHtml(parser.render(post.body), {
        allowedTags: sanitizeHtml.defaults.allowedTags.concat(['img']),
      }),
      categories: post.data.tags,
    })),
    customData: `<language>ja</language>`,
  });
}

implementasi Atomフィード

// src/pages/atom.xml.ts
import { getCollection } from 'astro:content';

export async function GET() {
  const posts = await getCollection('blog');
  const siteUrl = 'https://example.com';

  const sortedPosts = posts
    .filter(p => !p.data.draft)
    .sort((a, b) => 
      new Date(b.data.pubDate).getTime() - new Date(a.data.pubDate).getTime()
    )
    .slice(0, 20);

  const atom = `<?xml version="1.0" encoding="UTF-8"?>
<feed xmlns="http://www.w3.org/2005/Atom">
  <title>My Tech Blog</title>
  <link href="${siteUrl}/atom.xml" rel="self"/>
  <link href="${siteUrl}"/>
  <id>${siteUrl}/</id>
  <updated>${sortedPosts[0]?.data.pubDate ?? new Date().toISOString()}</updated>
${sortedPosts.map(post => `  <entry>
    <title>${escapeXml(post.data.title)}</title>
    <link href="${siteUrl}/blog/${post.slug}/"/>
    <id>${siteUrl}/blog/${post.slug}/</id>
    <published>${post.data.pubDate}</published>
    <summary>${escapeXml(post.data.description)}</summary>
    <category term="${post.data.tags?.[0] ?? ''}" />
  </entry>`).join('\n')}
</feed>`;

  return new Response(atom, {
    headers: { 'Content-Type': 'application/atom+xml; charset=utf-8' },
  });
}

function escapeXml(str: string): string {
  return str
    .replace(/&/g, '&amp;')
    .replace(/</g, '&lt;')
    .replace(/>/g, '&gt;')
    .replace(/"/g, '&quot;');
}

フィードリンクpenambahan HTMLheaderへ

<head>
  <link rel="alternate" type="application/rss+xml" 
        title="RSS Feed" href="/rss.xml" />
  <link rel="alternate" type="application/atom+xml" 
        title="Atom Feed" href="/atom.xml" />
</head>

generate kategori別フィード

// src/pages/rss/[category].xml.ts
import { getCollection } from 'astro:content';

export async function getStaticPaths() {
  const posts = await getCollection('blog');
  const categories = [...new Set(posts.map(p => p.data.category))];
  
  return categories.map(category => ({
    params: { category },
  }));
}

export async function GET({ params, site }: { params: { category: string }; site: string }) {
  const posts = await getCollection('blog');
  const filtered = posts
    .filter(p => p.data.category === params.category && !p.data.draft)
    .sort((a, b) => 
      new Date(b.data.pubDate).getTime() - new Date(a.data.pubDate).getTime()
    );

  // RSSgenerateロジック（kategori名 タイトル 含める）
  return generateRss({
    title: `My Tech Blog - ${params.category}`,
    posts: filtered,
    site,
  });
}

validasi フィード

generate RSSフィード 正しい形式か、W3C Feed Validation Service konfirmasi bisa dilakukan.

> RSSフィード validasitest 書いて。
> XML struktur dan RSS 2.0仕様 準拠しているかkonfirmasiして。
import { describe, it, expect } from 'vitest';
import { XMLParser } from 'fast-xml-parser';

describe('RSS Feed', () => {
  it('efektifなRSS 2.0形式 adaこと', async () => {
    const response = await fetch('http://localhost:4321/rss.xml');
    const xml = await response.text();
    const parser = new XMLParser();
    const result = parser.parse(xml);

    expect(result.rss).toBeDefined();
    expect(result.rss.channel.title).toBeTruthy();
    expect(result.rss.channel.item.length).toBeGreaterThan(0);
    expect(result.rss.channel.item.length).toBeLessThanOrEqual(20);
  });
});

Summary

Untuk RSSフィードのimplementasiは、ブログ読者の獲得とリテンションに大きく貢献します。Claude Codeをpemanfaatanすれば、SEO対策と組み合わせてサイトの発見性を高められます。サイトマップと一緒にbuild時に自動generateするpengaturanを推奨します。フィードの仕様, lihat RSS 2.0 Specification.

#Claude Code #RSS #Atom #フィード #blog

Related Posts