feat: 헤더 누르면 이동하는거

Author: zaewc

src/shared/ui/Header/index.tsx

@@ -109,8 +109,8 @@ export default function Header() {
     { section: "SloganSecondSection", label: "2025 광탈페 슬로건" },
     // { section: "section3", label: "FaQ" },
     { section: "PreliminaryFourthSection", label: "2025 광탈페 예선 다시보기" },
-    { section: "ReservationFifthSection", label: "본선 좌석예매" },
-    { section: "FinalsSixthSection", label: "본선" },
+    { section: "FinalsSixthSection", label: "2025 광탈페 본선 다시보기" },
+    { section: "ReservationFifthSection", label: "본선 수상팀 명단" },
   ];
 
   const handleScrollToSection = (section: string) => {

src/views/home/ui/HomePage/index.tsx

@@ -15,10 +15,10 @@ const ReservationFifthSection = dynamic(() => import("@/widgets/main/Reservation
   ssr: false,
 });
 
-// const FinalsSixthSection = dynamic(() => import("@/widgets/main/FinalsSixthSection"), {
-//   loading: () => <SectionPlaceholder />,
-//   ssr: false,
-// });
+const FinalsSixthSection = dynamic(() => import("@/widgets/main/FinalsSixthSection"), {
+  loading: () => <SectionPlaceholder />,
+  ssr: false,
+});
 
 const SeventhSection = dynamic(() => import("@/widgets/main/SevenSection"), {
   loading: () => <SectionPlaceholder />,
@@ -53,10 +53,10 @@ const HomePage = () => {
         <PreliminaryFourthSection />
       </LazySection>
 
-      {/* 
+      
       <LazySection fallback={<SectionPlaceholder height="500px" />} rootMargin="300px">
         <FinalsSixthSection />
-      </LazySection> */}
+      </LazySection>
 
       <LazySection fallback={<SectionPlaceholder height="500px" />} rootMargin="300px">
         <ReservationFifthSection />

src/widgets/main/FinalsSixthSection/index.tsx

@@ -2,51 +2,33 @@
 
 import { cn } from "@/shared/utils/cn";
 import { SectionTitle } from "@/shared/ui/SectionTitle";
-import dynamic from "next/dynamic";
+// import dynamic from "next/dynamic";
 import YouTubeLazyEmbed from "@/shared/ui/YouTubeLazyEmbed";
-import MapButtonComponent from "@/widgets/mapbutton";
+// import MapButtonComponent from "@/widgets/mapbutton";
 
-const Map = dynamic(
-  () => import("@/entities/home/ui/Map").then(module => ({ default: module.Map })),
-  {
-    ssr: false,
-  },
-);
+// const Map = dynamic(
+//   () => import("@/entities/home/ui/Map").then(module => ({ default: module.Map })),
+//   {
+//     ssr: false,
+//   },
+// );
 
 const FinalsSixthSection = () => {
   return (
     <section id="FinalsSixthSection" className={cn("flex flex-col items-center my-20")}>
-      <div className={cn("w-[70%] mobile:w-full mobile:px-16")}>
+      <div className={cn("w-[70%] mobile:w-full")}>
         <SectionTitle
-          title="본선"
-          description="光트로(예선)을 거쳐 선정된 참가팀이 서로의 무대를 즐기며 재능과 끼를 맘껏 펼치고 서로 나누는 축제의 시간입니다.
-"
-          className={cn("mt-[66px] mobile:mt-[1.7rem]")}
+          title="2025 광탈페 본선"
+          className={cn("mt-[66px] mobile:mt-[1.7rem] mb-28")}
         />
-        <div className={cn("mt-[5rem] mobile:mt-20")}>
-          <p className={cn("text-title4b mobile:text-body3b place-self-start mb-24 mobile:mb-0")}>
-            오시는 길
-          </p>
-          <div className="flex gap-6 mobile:flex-col tablet:flex-col">
-            <div className="flex-1 flex gap-6 mobile:flex-col tablet:flex-col">
-              <div className="w-[40%] mobile:w-full tablet:w-full pb-4 flex flex-col justify-between mobile:pb-0">
-                <p className={cn("text-body2r text-gray-500 mobile:text-caption2r mobile:py-8")}>
-                  ∙ 일시: 2025.9.27.(토) <br />∙ 장소: 조선대학교 해오름관
-                </p>
-                <MapButtonComponent />
-              </div>
-              <div className={cn("flex-1")}>
-                <Map
-                  address="광주광역시 동구 필문대로 309 조선대학교 해오름관"
-                  className={cn("h-full mobile:h-[250px] tablet:h-[250px] rounded-[20px]")}
-                />
-              </div>
-            </div>
-            <div className={cn("flex-1")}>
-              <div className={cn("w-full")}>
-                <YouTubeLazyEmbed videoId="jSTTkW3dZgE" title="2025 광탈페 길찾기" />
-              </div>
-            </div>
+
+        <div
+          className={cn(
+            "flex w-full flex-col items-start gap-10 justify-between mb-[90px] mobile:mb-[38px]",
+          )}
+        >
+          <div className={cn("w-full mobile:w-full mobile:mt-16 mobile:px-16")}>
+            <YouTubeLazyEmbed videoId="J-Bj9cM4c3M" title="2025 광탈페 본선 다시보기" />
           </div>
         </div>
       </div>

src/widgets/main/PreliminaryFourthSection/index.tsx

@@ -116,22 +116,6 @@ const PreliminaryFourthSection = () => {
           </div>
         </div>
       </div>
-      <div className={cn("w-[70%] mobile:w-full")}>
-        <SectionTitle
-          title="2025 광탈페 본선"
-          className={cn("mt-[66px] mobile:mt-[1.7rem] mb-28")}
-        />
-
-        <div
-          className={cn(
-            "flex w-full flex-col items-start gap-10 justify-between mb-[90px] mobile:mb-[38px]",
-          )}
-        >
-          <div className={cn("w-full mobile:w-full mobile:mt-16 mobile:px-16")}>
-            <YouTubeLazyEmbed videoId="J-Bj9cM4c3M" title="2025 광탈페 본선 다시보기" />
-          </div>
-        </div>
-      </div>
     </section>
   );
 };