add isr page

pages/isr.tsx

@@ -0,0 +1,34 @@
+import React, { FC } from "react";
+import { fetchGuitars } from "../lib/strapi";
+import { GetStaticProps } from "next";
+import { Guitar, GuitarResponse } from "../type/guitars";
+
+// ===========================
+// getStaticPropsのpropsに設定したデータを引数で受け取れる
+// ==========================
+const Isr: FC<GuitarResponse> = ({ guitars }) => {
+  return (
+    <div>
+      {guitars.map((guitar: Guitar) => {
+        return <div key={guitar.id}>{guitar.attributes.name}</div>;
+      })}
+    </div>
+  );
+};
+
+// ===============================
+// 静的サイト作成時にはgetStaticPropsの中で
+// 表示データを作成する
+// ===============================
+export const getStaticProps: GetStaticProps = async () => {
+  const guitars = await fetchGuitars();
+  return {
+    props: {
+      guitars,
+    },
+    // キャッシュする秒数
+    revalidate: 20,
+  };
+};
+
+export default Isr;