diff --git a/src/app/board/[id]/page.tsx b/src/app/board/[id]/page.tsx
index 48e0df2b..11cde13b 100644
--- a/src/app/board/[id]/page.tsx
+++ b/src/app/board/[id]/page.tsx
@@ -1,7 +1,7 @@
 import { notFound } from 'next/navigation';
 import { Header } from '@/components/server';
 import { Suspense } from '@suspensive/react';
-import { Content, HydratedBoardDetail, BoardDetailLoading } from '@/app/board/components';
+import { Content, BoardDetail, BoardDetailLoading } from '@/app/board/components';
 
 const BoardDetailPage = async ({
   params: { id },
@@ -18,7 +18,7 @@ const BoardDetailPage = async ({
       <Header />
       <Content verticalCenter={false}>
         <Suspense fallback={<BoardDetailLoading />}>
-          <HydratedBoardDetail boardId={boardId} />
+          <BoardDetail />
         </Suspense>
       </Content>
     </>
diff --git a/src/app/home/components/BoardSection/BoardSection.tsx b/src/app/home/components/BoardSection/BoardSection.tsx
index 0666e72e..6656a9d9 100644
--- a/src/app/home/components/BoardSection/BoardSection.tsx
+++ b/src/app/home/components/BoardSection/BoardSection.tsx
@@ -1,12 +1,7 @@
 import clsx from 'clsx';
 import { Suspense } from '@suspensive/react';
 import { SvgIcon, Typography } from '@/components';
-import {
-  HydratedBoardCardList,
-  BoardCardListLoading,
-  RegionsFilter,
-  RegionsFilterLoading,
-} from '@/app/home/components';
+import { BoardCardListLoading, RegionsFilter, RegionsFilterLoading, BoardCardList } from '@/app/home/components';
 import { animate } from '@/styles/theme.css';
 import { section, title } from './BoardSection.css';
 
@@ -20,7 +15,7 @@ const BoardSection = async () => {
         <RegionsFilter />
       </Suspense>
       <Suspense fallback={<BoardCardListLoading />}>
-        <HydratedBoardCardList />
+        <BoardCardList />
       </Suspense>
     </section>
   );