Update App.tsx

src/App.tsx

@@ -8,6 +8,41 @@ import Project from "@/components/Home/Project";
 import "./index.css";
 
 export function App() {
+    useEffect(() => {
+        // 초기 로드 시 hash에 맞게 스크롤
+        const scrollToHash = () => {
+            const hash = window.location.hash.substring(1);
+            if (hash) {
+                const element = document.getElementById(hash);
+                if (element) {
+                    setTimeout(() => {
+                        element.scrollIntoView({ behavior: "smooth" });
+                    }, 100); // 브라우저가 레이아웃을 그릴 시간을 줌
+                }
+            }
+        };
+        scrollToHash();
+
+        // 스크롤 시 hash 업데이트 로직
+        const sections = document.querySelectorAll(".section");
+        const observer = new IntersectionObserver(
+            (entries) => {
+                entries.forEach(entry => {
+                    if (entry.isIntersecting) {
+                        window.history.replaceState(null, "", `#${entry.target.id}`);
+                    }
+                });
+            },
+            { threshold: 0.6 } // 60% 보이면 활성화
+        );
+
+        sections.forEach(section => observer.observe(section));
+
+        return () => {
+            sections.forEach(section => observer.unobserve(section));
+        };
+    }, []);
+
     useEffect(() => {
         // img 위에서 스크롤 방지
         const handleWheel = (event) => {