とりあえず、本ウェブサイトをデプロイするとこまでこぎつけました。
以前の記事で宣言した通り、AWS Lambdaと独自のDockerイメージでホスティングしています。
その上で、昔作ったけど使っていなかったサブドメインとCloudfront,ACMを見つけたので、AWS Lambdaの関数URLをオリジンとして動作させています。
とくに困ったとこがsitemap.xml作るとこでした。
app/routes/sitemap[.]xml.ts
// app/routes/sitemap[.]xml.ts
import type { LoaderFunction } from "@remix-run/node";
import { client } from "~/libs/client.server";
import type { BlogPost } from "~/routes/types";
export const loader: LoaderFunction = async () => {
console.log(`sitemap.xml.ts`);
const baseUrl = "https://weblog.n-jitter.com";
const generateUrlList = async (): Promise<Array<XmlMap>> => {
const staticPages = [
{ url: "/", priority: "1.0", changefreq: "daily" },
{ url: "/about", priority: "0.8", changefreq: "monthly" },
{ url: "/content", priority: "0.8", changefreq: "weekly" },
];
const recentPosts = await client.getList({ endpoint: "blogs_api" });
const contentList = recentPosts.contents as Array<BlogPost>;
const postUrls: Array<XmlMap> = contentList.map((post) => ({
url: `/content/${post.id}`,
priority: "0.6",
changefreq: "weekly",
lastmod: post.publishedAt,
}));
return [...staticPages, ...postUrls];
};
const urls = await generateUrlList();
const sitemap = `<?xml version="1.0" encoding="UTF-8"?>
<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
${urls
.map(
({ url, priority, changefreq, lastmod }) => ` <url>
<loc>${baseUrl}${url}</loc>
${lastmod ? `<lastmod>${lastmod}</lastmod>` : ""}
<changefreq>${changefreq}</changefreq>
<priority>${priority}</priority>
</url>`,
)
.join("\n")}
</urlset>`;
return new Response(sitemap, {
headers: {
"Content-Type": "application/xml",
"xml-version": "1.0",
encoding: "UTF-8",
},
});
};
type XmlMap = {
url: string;
priority: string;
changefreq: string;
lastmod?: string;
};
これでHTMLでなくXML返すモードになってくれるらしい。
まあとりあえずは動いていそうですね。
この調子でどんどん記事を書きつつ、デザインやSEOなどを改善していく実験を行っていこうかと思います。