This commit is contained in:
tuna2134
2025-04-29 21:31:34 +00:00
parent ac705d36b0
commit 22109ff516
6 changed files with 98 additions and 96 deletions

1
.prettierrc Normal file
View File

@@ -0,0 +1 @@
tabWidth: 4

View File

@@ -3,32 +3,32 @@ import { Geist, Geist_Mono } from "next/font/google";
import "./globals.css";
const geistSans = Geist({
variable: "--font-geist-sans",
subsets: ["latin"],
variable: "--font-geist-sans",
subsets: ["latin"],
});
const geistMono = Geist_Mono({
variable: "--font-geist-mono",
subsets: ["latin"],
variable: "--font-geist-mono",
subsets: ["latin"],
});
export const metadata: Metadata = {
title: "tuna2134",
description: "tuna2134 official website",
title: "tuna2134",
description: "tuna2134 official website",
};
export default function RootLayout({
children,
children,
}: Readonly<{
children: React.ReactNode;
children: React.ReactNode;
}>) {
return (
<html lang="ja">
<body
className={`${geistSans.variable} ${geistMono.variable} antialiased`}
>
{children}
</body>
</html>
);
return (
<html lang="ja">
<body
className={`${geistSans.variable} ${geistMono.variable} antialiased`}
>
{children}
</body>
</html>
);
}

View File

@@ -2,32 +2,33 @@ import Timeline from "@/components/pages/home/timeline";
import Header from "@/components/pages/home/header";
export default function Home() {
return (
<>
<Header />
<div className="mt-6 mx-auto max-w-3xl px-4">
<Timeline
timeline={[
{
title: "プログラミングの世界に入り込む",
datetime: "2020/07",
description: "Discord Botを作るためにPythonを学び始めた。",
},
{
title: "sbv2-api 誕生",
datetime: "2025/09",
description:
"Discord botに組み込めたら面白いと思って開発を開始して作った。",
},
{
title: "New! ウェブサイト6代目開発開始(Proj C)",
datetime: "2025/04",
description:
"前のサイトを変えたくなった。そして再び一から作ることにした。",
},
]}
/>
</div>
</>
);
return (
<>
<Header />
<div className="mt-6 mx-auto max-w-3xl px-4">
<Timeline
timeline={[
{
title: "プログラミングの世界に入り込む",
datetime: "2020/07",
description:
"Discord Botを作るためにPythonを学び始めた。",
},
{
title: "sbv2-api 誕生",
datetime: "2025/09",
description:
"Discord botに組み込めたら面白いと思って開発を開始して作った。",
},
{
title: "New! ウェブサイト6代目開発開始(Proj C)",
datetime: "2025/04",
description:
"前のサイトを変えたくなった。そして再び一から作ることにした。",
},
]}
/>
</div>
</>
);
}

View File

@@ -1,30 +1,30 @@
import Image from "next/image";
const Header: React.FC = async () => {
const res = await fetch(
"https://discord.com/api/v10/users/739702692393517076",
{
headers: {
Authorization: `Bot ${process.env.DISCORD_TOKEN}`,
},
},
);
const data = await res.json();
const avatarURL = `https://cdn.discordapp.com/avatars/739702692393517076/${data.avatar}.png?size=1024`;
return (
<header className="h-screen w-screen flex justify-center items-center">
<div>
<Image
alt="avatar"
src={avatarURL}
width={156}
height={156}
className="mb-2 rounded-full"
/>
<h1 className="text-2xl font-bold text-center">tuna2134</h1>
</div>
</header>
);
const res = await fetch(
"https://discord.com/api/v10/users/739702692393517076",
{
headers: {
Authorization: `Bot ${process.env.DISCORD_TOKEN}`,
},
},
);
const data = await res.json();
const avatarURL = `https://cdn.discordapp.com/avatars/739702692393517076/${data.avatar}.png?size=1024`;
return (
<header className="h-screen w-screen flex justify-center items-center">
<div>
<Image
alt="avatar"
src={avatarURL}
width={156}
height={156}
className="mb-2 rounded-full"
/>
<h1 className="text-2xl font-bold text-center">tuna2134</h1>
</div>
</header>
);
};
export default Header;

View File

@@ -1,28 +1,28 @@
export interface TimelineData {
title: string;
datetime: string;
description: string;
title: string;
datetime: string;
description: string;
}
interface Props {
timeline: TimelineData[];
timeline: TimelineData[];
}
const Timeline: React.FC<Props> = ({ timeline }) => {
return (
<ol className="relative border-s border-gray-200">
{timeline.map((data, index) => (
<li className="mb-10 ms-6" key={index}>
<div className="absolute w-3 h-3 bg-[#00F3A4] rounded-full mt-1.5 -start-1.5 border border-white"></div>
<p className="text-gray-900/75 mb-1">{data.datetime}</p>
<h1 className="text-2xl font-bold mb-2 tracking-wider">
{data.title}
</h1>
<p>{data.description}</p>
</li>
))}
</ol>
);
return (
<ol className="relative border-s border-gray-200">
{timeline.map((data, index) => (
<li className="mb-10 ms-6" key={index}>
<div className="absolute w-3 h-3 bg-[#00F3A4] rounded-full mt-1.5 -start-1.5 border border-white"></div>
<p className="text-gray-900/75 mb-1">{data.datetime}</p>
<h1 className="text-2xl font-bold mb-2 tracking-wider">
{data.title}
</h1>
<p>{data.description}</p>
</li>
))}
</ol>
);
};
export default Timeline;

View File

@@ -1,18 +1,18 @@
import type { NextConfig } from "next";
const nextConfig: NextConfig = {
images: {
remotePatterns: [
{
protocol: "https",
hostname: "cdn.discordapp.com",
},
],
},
images: {
remotePatterns: [
{
protocol: "https",
hostname: "cdn.discordapp.com",
},
],
},
};
if (process.env.OUTPUT === "standalone") {
nextConfig.output = "standalone";
nextConfig.output = "standalone";
}
export default nextConfig;