refactor: migrate content

Author: korosuke613

.gitignore

@@ -25,3 +25,4 @@ Thumbs.db
 build/
 
 .env
+.astro/

.vscode/settings.json

@@ -32,5 +32,8 @@
   "[typescriptreact]": {
     "editor.defaultFormatter": "esbenp.prettier-vscode"
   },
-  "terminal.integrated.defaultProfile.linux": "zsh"
+  "terminal.integrated.defaultProfile.linux": "zsh",
+  "[xml]": {
+    "editor.defaultFormatter": "redhat.vscode-xml"
+  }
 }

src/components/Content.tsx

@@ -1,27 +1,27 @@
 import type { MarkdownHeading } from 'astro';
+import type { CollectionEntry } from 'astro:content';
 import path from 'path';
 import type { ReactNode } from 'react';
 
 import { EditGitHub } from '@/components/EditGitHub';
 import { Toc } from '@/components/Toc';
-import type { IArticleFrontmatter } from '@/types/IArticleFrontmatter';
 import { AppConfig } from '@/utils/AppConfig';
 
 type IContentProps = {
-  content: IArticleFrontmatter;
+  content: CollectionEntry<'posts'>;
   headings: MarkdownHeading[];
   children: ReactNode;
 };
 
 const Content: React.FC<IContentProps> = (props: IContentProps) => {
   return (
     <div className="mx-auto mt-5 max-w-prose">
-      {props.content.imgSrc && (
+      {props.content.data.imgSrc && (
         <div className="aspect-w-3 aspect-h-2">
           <img
             className="h-full w-full rounded-lg object-cover object-center"
-            src={path.join(AppConfig.base, props.content.imgSrc)}
-            alt={props.content.imgAlt}
+            src={path.join(AppConfig.base, props.content.data.imgSrc)}
+            alt={props.content.data.imgAlt}
             loading="lazy"
           />
         </div>

src/components/ContentHeader.tsx

@@ -1,12 +1,12 @@
+import type { CollectionEntry } from 'astro:content';
 import { format } from 'date-fns';
 
-import type { IArticleFrontmatter } from '@/types/IArticleFrontmatter';
 import type { Tags } from '@/utils/Tag';
 
 import { Tag } from './Tag';
 
 type IContentHeaderProps = {
-  content: IArticleFrontmatter;
+  content: CollectionEntry<'posts'>;
   author: string;
   tags: Tags;
   contentCategory: string;
@@ -15,12 +15,12 @@ type IContentHeaderProps = {
 export const ContentHeader = (props: IContentHeaderProps) => (
   <>
     <h1 id="contents_header" className="text-center text-3xl font-bold">
-      {props.content.title.replace('\\n', '')}
+      {props.content.data.title.replace('\\n', '')}
     </h1>
 
     <div className="mt-2 text-center text-sm text-gray-400">
       By {props.author} on{' '}
-      {format(new Date(props.content.pubDate), 'LLL d, yyyy')}
+      {format(new Date(props.content.data.pubDate), 'LLL d, yyyy')}
     </div>
 
     <div className="mt-4 flex flex-wrap justify-center gap-2">

src/components/EditGitHub.tsx

@@ -1,15 +1,15 @@
+import type { CollectionEntry } from 'astro:content';
 import path from 'path';
 import { BsGithub } from 'react-icons/bs/index';
 
-import type { IArticleFrontmatter } from '@/types/IArticleFrontmatter';
 import { AppConfig } from '@/utils/AppConfig';
 
 type IEditGitHubProps = {
-  content: IArticleFrontmatter;
+  content: CollectionEntry<'posts'>;
 };
 
 export const EditGitHub = (props: IEditGitHubProps) => {
-  if (props.content.url === undefined) {
+  if (props.content.id === undefined) {
     return <></>;
   }
 
@@ -19,14 +19,14 @@ export const EditGitHub = (props: IEditGitHubProps) => {
     'main',
     'src',
     'pages',
-    props.content.url
+    props.content.id
   );
 
   return (
     <div className="flex justify-end">
       <a
         style={{ height: 'fit-content' }}
-        href={`https://${url}.md`}
+        href={`https://${url}`}
         target="_blank"
         rel="noopener noreferrer"
       >

src/components/PostCard.tsx

@@ -1,30 +1,34 @@
 import { format } from 'date-fns';
 import path from 'path';
 
-import type { IContent } from '@/types/IArticleFrontmatter';
+import type { IPost } from '@/types/IArticleFrontmatter';
 import { AppConfig } from '@/utils/AppConfig';
 import { transformTitleForContentCard } from '@/utils/StringWidth';
 import type { Tags } from '@/utils/Tag';
 
 import { Tag } from './Tag';
 
 type IPostCardProps = {
-  instance: IContent;
+  instance: IPost;
   contentCategory: string;
   tags: Tags;
 };
 
 export const PostCard = (props: IPostCardProps) => {
-  const contentPath = props.instance.url;
+  const contentPath = path.join(
+    '/',
+    props.instance.collection,
+    props.instance.slug
+  );
 
   return (
     <div className="relative overflow-hidden rounded-md bg-slate-800">
       <div className="aspect-w-16 aspect-h-9">
-        {props.instance.frontmatter.imgSrc && (
+        {props.instance.data.imgSrc && (
           <img
             className="h-full w-full object-cover object-center"
-            src={path.join(AppConfig.base, props.instance.frontmatter.imgSrc)}
-            alt={props.instance.frontmatter.imgSrc}
+            src={path.join(AppConfig.base, props.instance.data.imgSrc)}
+            alt={props.instance.data.imgSrc}
             loading="lazy"
           />
         )}
@@ -35,7 +39,7 @@ export const PostCard = (props: IPostCardProps) => {
           <div className="py-1.5 px-3">
             <a href={contentPath}>
               <div>
-                {transformTitleForContentCard(props.instance.frontmatter.title)
+                {transformTitleForContentCard(props.instance.data.title)
                   .split('\\n')
                   .map((t) => (
                     <span key={t} className="text-lg font-bold">
@@ -44,16 +48,13 @@ export const PostCard = (props: IPostCardProps) => {
                     </span>
                   ))}
                 <span className="align-middle text-xs text-gray-300	">
-                  {format(
-                    new Date(props.instance.frontmatter.pubDate),
-                    'LLL d, yyyy'
-                  )}
+                  {format(new Date(props.instance.data.pubDate), 'LLL d, yyyy')}
                 </span>
               </div>
             </a>
             <div className="mt-1 flex flex-wrap gap-2">
-              {props.instance.frontmatter.tags &&
-                props.instance.frontmatter.tags.map((tagName) => (
+              {props.instance.data.tags &&
+                props.instance.data.tags.map((tagName) => (
                   <Tag
                     key={tagName}
                     name={tagName}

src/components/PostGallery.tsx

@@ -1,20 +1,20 @@
-import type { IContent } from '@/types/IArticleFrontmatter';
+import type { IPost } from '@/types/IArticleFrontmatter';
 import type { Tags } from '@/utils/Tag';
 
 import { PostCard } from './PostCard';
 
 type IRecentPostsProps = {
   tags: Tags;
   contentCategory: string;
-  postList: IContent[];
+  postList: IPost[];
 };
 
 export const PostGallery = (props: IRecentPostsProps) => {
   return (
     <div className="grid grid-cols-1 gap-6 md:grid-cols-3">
       {props.postList.map((elt) => (
         <PostCard
-          key={elt.url}
+          key={elt.id}
           instance={elt}
           tags={props.tags}
           contentCategory={props.contentCategory}

src/content/config.ts

@@ -0,0 +1,18 @@
+import { defineCollection, z } from 'astro:content';
+
+const postCollection = defineCollection({
+  schema: z.object({
+    title: z.string(),
+    description: z.string().nullable().optional(),
+    pubDate: z.date(),
+    tags: z.array(z.string()),
+    order: z.number().optional(),
+    imgSrc: z.string().optional(),
+    imgAlt: z.string().optional(),
+    draft: z.boolean().optional(),
+  }),
+});
+
+export const collections = {
+  posts: postCollection,
+};

src/pages/posts/20170930_etrobocon2017.md renamed to src/content/posts/20170930_etrobocon2017.md

@@ -1,5 +1,5 @@
 ---
-layout: '@/templates/BasePost.astro'
+
 title: ETロボコン2017 に参加しました
 description: ロボコンの話
 pubDate: 2017-09-30T00:00:00Z
@@ -8,7 +8,7 @@ tags:
   - 大学
 ---
 
-片山徹郎研究室のメンバーで参加しました。九州南地区大会で敗北。
+片山徹郎研究室のメンバーで参加しました。九州南地区大会で敗北。aaa
 
 - [ETロボコン2017大会 | ETロボコン](https://www.etrobo.jp/2017archive)
 - [korosuke613/etrobocon2017: ETロボコン2017](https://github.com/korosuke613/etrobocon2017)

src/pages/posts/20171001_senmon.md renamed to src/content/posts/20171001_senmon.md

@@ -1,5 +1,5 @@
 ---
-layout: '@/templates/BasePost.astro'
+
 title: 専門教育入門セミナーT 2017\nin 片山（徹）研
 description: 授業の話
 pubDate: 2017-10-01T00:00:00Z

src/pages/posts/20180926_jceee2018.md renamed to src/content/posts/20180926_jceee2018.md

@@ -1,5 +1,5 @@
 ---
-layout: '@/templates/BasePost.astro'
+
 title: 'JCEEE 2018で論文を発表しました'
 description: '学会の話'
 pubDate: 2018-09-26T00:00:00Z

src/pages/posts/20180928_etrobocon2018.md renamed to src/content/posts/20180928_etrobocon2018.md

@@ -1,5 +1,5 @@
 ---
-layout: '@/templates/BasePost.astro'
+
 title: ETロボコン2018 九州南大会優勝！
 description: ロボコンの話
 pubDate: 2018-09-28T00:00:00Z

src/pages/posts/20181114_etrobocon2018_ca.md renamed to src/content/posts/20181114_etrobocon2018_ca.md

@@ -1,5 +1,5 @@
 ---
-layout: '@/templates/BasePost.astro'
+
 title: ETロボコン2018 全国大会\n14チーム中8位！
 description: ロボコンの話
 pubDate: 2018-11-14T00:00:00Z

src/pages/posts/20190110_icarob2019.md renamed to src/content/posts/20190110_icarob2019.md

@@ -1,5 +1,5 @@
 ---
-layout: '@/templates/BasePost.astro'
+
 title: 'ICAROB2019(査読有り) 論文発表'
 description: '論文発表の話'
 pubDate: 2019-01-10T00:00:00Z

src/pages/posts/20190330_intern.md renamed to src/content/posts/20190330_intern.md

@@ -1,5 +1,5 @@
 ---
-layout: '@/templates/BasePost.astro'
+
 title: 'リクルートライフスタイルさんの\nインターンに参加しました'
 description: 'インターンの話'
 pubDate: 2019-03-30T00:00:00Z

src/pages/posts/20190829_ses2019.md renamed to src/content/posts/20190829_ses2019.md

@@ -1,5 +1,5 @@
 ---
-layout: '@/templates/BasePost.astro'
+
 title: 'SES2019(査読有り) 論文発表'
 description: '学会の話'
 pubDate: 2019-08-29T00:00:00Z

src/pages/posts/20190928_etrobo2019_minami.md renamed to src/content/posts/20190928_etrobo2019_minami.md

@@ -1,5 +1,5 @@
 ---
-layout: '@/templates/BasePost.astro'
+
 title: 'ETロボコン2019 九州南大会\n(総合優勝、IPA賞！)'
 description: 'ロボコンの話'
 pubDate: 2019-09-28T00:00:00Z

src/pages/posts/20191120_etrobo2019_ca.md renamed to src/content/posts/20191120_etrobo2019_ca.md

@@ -1,5 +1,5 @@
 ---
-layout: '@/templates/BasePost.astro'
+
 title: 'ETロボコン2019全国大会出場\n(モデルランクB！)'
 description: 'ロボコンの話'
 pubDate: 2019-11-20T00:00:00Z

src/pages/posts/20200324_graduate_miyazaki_u.md renamed to src/content/posts/20200324_graduate_miyazaki_u.md

@@ -1,5 +1,5 @@
 ---
-layout: '@/templates/BasePost.astro'
+
 title: '宮崎大学大学院を\n修了しました'
 description: '修了の話'
 pubDate: 2020-03-24T00:00:00Z

src/pages/posts/20200401_join_cybozu.md renamed to src/content/posts/20200401_join_cybozu.md

@@ -1,5 +1,5 @@
 ---
-layout: '@/templates/BasePost.astro'
+
 title: 'サイボウズ株式会社に\n入社しました'
 description: '就職の話'
 pubDate: 2020-04-01T00:00:00Z

src/pages/posts/20220826_cybozu_insideout_devsumi.md renamed to src/content/posts/20220826_cybozu_insideout_devsumi.md

@@ -1,5 +1,5 @@
 ---
-layout: '@/templates/BasePost.astro'
+
 title: '生産性向上は一筋縄ではいかない Q&A [デブサミ2022夏]'
 description: ''
 pubDate: 2022-08-26T00:00:00Z

src/pages/posts/20230103_hofu_.md renamed to src/content/posts/20230103_hofu_.md

@@ -1,5 +1,5 @@
 ---
-layout: '@/templates/BasePost.astro'
+
 title: '2023年の抱負を書きました'
 description: ''
 pubDate: 2023-01-03T00:00:00Z

src/pages/posts/compare-renovate-logs.md renamed to src/content/posts/compare-renovate-logs.md

@@ -1,5 +1,5 @@
 ---
-layout: '@/templates/BasePost.astro'
+
 title: 'compare-renovate-logs'
 description: ''
 pubDate: 2022-12-23T00:00:00Z

src/pages/posts/history.md renamed to src/content/posts/history.md

@@ -1,5 +1,4 @@
 ---
-layout: '@/templates/BasePost.astro'
 title: 自己紹介
 description: 平木場ヒストリー
 pubDate: 2022-08-21T00:00:00Z

src/pages/posts/info_from_amazon.md renamed to src/content/posts/info_from_amazon.md

@@ -1,5 +1,5 @@
 ---
-layout: '@/templates/BasePost.astro'
+
 title: 'book-info-from-amazon'
 description: ''
 pubDate: 2017-06-13T00:00:00Z

src/pages/posts/miyadai_network_auto_login.md renamed to src/content/posts/miyadai_network_auto_login.md

@@ -1,5 +1,5 @@
 ---
-layout: '@/templates/BasePost.astro'
+
 title: miyadai-sso-auto-login
 description: 宮崎大学の学内ネットワーク接続時に自動でログインするツール
 pubDate: 2018-08-15T00:00:00Z

src/pages/posts/miyadai_shienka_oshirase_bot.md renamed to src/content/posts/miyadai_shienka_oshirase_bot.md

@@ -1,5 +1,5 @@
 ---
-layout: '@/templates/BasePost.astro'
+
 title: 宮大支援課お知らせBOT【非公式】
 description: 宮崎大学 学生生活支援課の情報をツイートする Bot
 pubDate: 2017-06-13T00:00:00Z

src/pages/posts/pict4java.md renamed to src/content/posts/pict4java.md

@@ -1,5 +1,5 @@
 ---
-layout: '@/templates/BasePost.astro'
+
 title: pict4java
 description: PICT を Java/Kotlin から利用する JNA クラス pict4java 
 pubDate: 2018-07-15T00:00:00Z

src/pages/posts/productivity_weekly.md renamed to src/content/posts/productivity_weekly.md

@@ -1,5 +1,5 @@
 ---
-layout: '@/templates/BasePost.astro'
+
 title: Productivity Weekly
 description: 「開発者の生産性向上に関するネタを共有する会」で出たネタを毎週発信
 pubDate: 2020-11-17T00:00:00Z

src/pages/posts/sixth-post.md renamed to src/content/posts/sixth-post.md

@@ -1,5 +1,5 @@
 ---
-layout: '@/templates/BasePost.astro'
+
 title: あのイーハトーヴォのすきとおった風、夏でも底に冷たさをもつ青いそら、うつくしい森で飾られたモリーオ市、郊外のぎらぎらひかる草の波。またそのなかでいっしょになったたくさんのひとたち、ファゼーロ
 description: Lorem ipsum dolor sit amet consectetur adipisicing elit. Tenetur vero esse non molestias eos excepturi.
 pubDate: 1900-02-06T00:00:00Z

src/pages/posts/template.md renamed to src/content/posts/template.md

@@ -1,5 +1,5 @@
 ---
-layout: '@/templates/BasePost.astro'
+
 title: 'aaa'
 description: ''
 pubDate: 2017-06-13T00:00:00Z