Reactでサイトマップ(sitemap.xml)を作る

2023年1月18日水曜日

react

t f B! P L

enter image description here

React Router を使って、URL でページ遷移できる React アプリの場合、サイトマップ(sitemap.xml)を作っておいた方が、SEO対策的にも吉である。

Reactでサイトマップを作る方法

サイトマップを自動で作るライブラリもあるが、正直、手動で作った方がいい。

React では public/ フォルダの下に置いてあるファイルは静的ファイルとして配信できるので、 public/フォルダの下に sitemap.xml という名前で新規ファイルを作り、サイトマップのルールに従って XMLをページの数だけ記述する。

<?xml version="1.0" encoding="UTF-8"?>
<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance">

<!--  created with free sitemap generation system www.sitemapxml.jp  --> 
<url>
  <loc>https://example.com/</loc>
  <priority>1.0</priority>
  <lastmod>2023-01-18T20:17:20+09:00</lastmod>
</url>
<url>
  <loc>https://example.com/page1.html</loc>
  <priority>1.0</priority>
  <lastmod>2023-01-18T20:18:20+09:00</lastmod>
</url>
<url>
  <loc>https://example.com/page2.html</loc>
  <priority>1.0</priority>
  <lastmod>2023-01-18T20:18:21+09:00</lastmod>
</url>
</urlset>

あとは、これをデプロイすれば OK!!!

スポンサーリンク
スポンサーリンク

このブログを検索

Profile

自分の写真
Webアプリエンジニア。 日々新しい技術を追い求めてブログでアウトプットしています。
プロフィール画像は、猫村ゆゆこ様に書いてもらいました。

仕事募集もしていたり、していなかったり。

QooQ