imnya.ng/src/app/page.tsx
2025-05-07 22:54:43 +09:00

75 lines
2.8 KiB
TypeScript

import "../link.css";
import { useState, useEffect } from "react";
import Image from "@/profile.avif";
import Timeline from "@/components/TimeLine";
import Contact from "@/components/Contact";
export function Page() {
const [age, setAge] = useState<number>(0);
const [post, setPost] = useState<any>({});
useEffect(() => {
// 나이 계산
const referenceDate = new Date(2010, 10, 8); // 2010년 11월 8일 (0-indexed)
const currentDate = new Date();
let calculatedAge = currentDate.getFullYear() - referenceDate.getFullYear();
if (currentDate < new Date(currentDate.getFullYear(), referenceDate.getMonth(), referenceDate.getDate())) {
calculatedAge -= 1;
}
setAge(calculatedAge);
}, []);
useEffect(() => {
// 블로그 데이터 가져오기
fetch("https://api.imnya.ng/rss")
.then(response => response.json())
.then(data => {
if (data) setPost(data[0] || {});
})
.catch(error => console.error("Error fetching posts:", error));
}, []);
return (
<div className="flex flex-col justify-center">
<div className="max-w-3xl px-4 mx-auto pt-24 pb-12 leading-8">
<h1 className="mb-4"><a href="mailto:me@imnya.ng" className="text-5xl font-medium font-serif font-ntype">me@imnya.ng</a></h1>
<p>
<span className="font-extrabold"> </span> <span className="font-extrabold"></span> <span className="font-extrabold"></span>.
</p>
<p>
{" "}
<a className="link-pink" target="_blank" href="https://github.com/team-neko/two_hearts" title="Chrome New Tab Extension">
Two Hearts
</a>,{" "}
<a className="link-amber" target="_blank" href="https://instagram.com/today.isangjeong" title="Post meal in Instagram">
</a>,{" "}
<a className="link-emerald" target="_blank" href="https://github.com/team-neko/dynamic-kawaii" title="Dark Pink VSCode Theme">
Dynamic Kawaii
</a> .
</p>
<picture className="block bg-gray-100 my-4 rounded-xl aspect-3-2 overflow-hidden image-scale object-shadowed">
<img src={Image} className="w-full aspect-3-2 object-cover object-center" />
</picture>
<p>
{age} <span className="font-extrabold"> </span> {" "}
<span className="font-extrabold"> </span> <span className="font-extrabold"> </span> .
</p>
<br />
<p>
:{" "}
<a href={post.link} className="text-muted-foreground">
{post.title}
</a>
</p>
<Timeline />
<Contact />
</div>
</div>
);
}