좀 많은게 바뀐거 같아요

src/app/index.tsx

@@ -0,0 +1,20 @@
+import "../index.css";
+import { BrowserRouter, Routes, Route } from "react-router";
+import { Page } from "./page";
+import RedirectTimeline from "./utils/RedirectTimeline";
+import NotFound from "./utils/NotFound";
+import { ThemeProvider } from "@/components/theme-provider";
+
+export default function App() {
+  return (
+    <ThemeProvider>
+      <BrowserRouter>
+        <Routes>
+          <Route path="/" element={<Page />} />
+          <Route path="/timeline" element={<RedirectTimeline />} />
+          <Route path="/*" element={<NotFound />} />
+        </Routes>
+      </BrowserRouter>
+    </ThemeProvider>
+  );
+}

src/app/page.tsx

@@ -0,0 +1,75 @@
+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="text-5xl font-medium font-serif font-ntype mb-4">imnya.ng</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>
+	);
+}

src/app/utils/NotFound.tsx

@@ -0,0 +1,8 @@
+export default function NotFound() {
+    return (
+        <div>
+            <h1>404 - Not Found</h1>
+            <p>The page you are looking for does not exist.</p>
+        </div>
+    );
+}

src/app/utils/RedirectTimeline.tsx

@@ -0,0 +1,10 @@
+import { useEffect } from "react";
+import { useNavigate } from "react-router";
+export default function RedirectTimeline() {
+    const navigate = useNavigate();
+    useEffect(() => {
+        navigate("/#timeline");
+    }, [navigate]);
+
+    return (<></>)
+}