diff --git a/package.json b/package.json
index d1f223bb..24d44713 100644
--- a/package.json
+++ b/package.json
@@ -38,6 +38,7 @@
     "next-themes": "^0.2.1",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
+    "react-error-boundary": "^4.0.11",
     "react-hook-form": "^7.47.0",
     "react-lottie-player": "^1.5.5",
     "sharp": "^0.32.6",
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 8f02f745..5ed303dc 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -77,6 +77,9 @@ dependencies:
   react-dom:
     specifier: ^18.2.0
     version: 18.2.0(react@18.2.0)
+  react-error-boundary:
+    specifier: ^4.0.11
+    version: 4.0.11(react@18.2.0)
   react-hook-form:
     specifier: ^7.47.0
     version: 7.47.0(react@18.2.0)
@@ -11428,6 +11431,15 @@ packages:
       react-is: 18.1.0
     dev: true
 
+  /react-error-boundary@4.0.11(react@18.2.0):
+    resolution: {integrity: sha512-U13ul67aP5DOSPNSCWQ/eO0AQEYzEFkVljULQIjMV0KlffTAhxuDoBKdO0pb/JZ8mDhMKFZ9NZi0BmLGUiNphw==}
+    peerDependencies:
+      react: '>=16.13.1'
+    dependencies:
+      '@babel/runtime': 7.23.2
+      react: 18.2.0
+    dev: false
+
   /react-hook-form@7.47.0(react@18.2.0):
     resolution: {integrity: sha512-F/TroLjTICipmHeFlMrLtNLceO2xr1jU3CyiNla5zdwsGUGu2UOxxR4UyJgLlhMwLW/Wzp4cpJ7CPfgJIeKdSg==}
     engines: {node: '>=12.22.0'}
diff --git a/src/app/(root)/(routes)/cards/components/card-list-content/CardListContent.tsx b/src/app/(root)/(routes)/cards/components/card-list-content/CardListContent.tsx
index cc140464..9411a23e 100644
--- a/src/app/(root)/(routes)/cards/components/card-list-content/CardListContent.tsx
+++ b/src/app/(root)/(routes)/cards/components/card-list-content/CardListContent.tsx
@@ -1,6 +1,7 @@
 'use client'
 
 import { useEffect, useRef } from 'react'
+import { ErrorBoundary } from 'react-error-boundary'
 import { useSearchParams } from 'next/navigation'
 import ExceptionBoundary from '@/components/domain/exception-boundary'
 import { useCardsQuery } from '@/hooks/api/queries/useCardsQuery'
@@ -54,7 +55,9 @@ const CardListContent = () => {
         isEmpty={isEmpty}
         isFetchingNextPage={isFetchingNextPage}
       >
-        <CardList />
+        <ErrorBoundary fallback={<div>렌더링 중 문제가 발생했습니다.</div>}>
+          <CardList />
+        </ErrorBoundary>
       </ExceptionBoundary>
       <div ref={lastElementRef} />
     </>
diff --git a/src/app/(root)/(routes)/cards/my/components/my-card-list-content/MyCardListContent.tsx b/src/app/(root)/(routes)/cards/my/components/my-card-list-content/MyCardListContent.tsx
index b2e9578b..39f7393c 100644
--- a/src/app/(root)/(routes)/cards/my/components/my-card-list-content/MyCardListContent.tsx
+++ b/src/app/(root)/(routes)/cards/my/components/my-card-list-content/MyCardListContent.tsx
@@ -1,6 +1,7 @@
 'use client'
 
 import { useEffect, useRef, useState } from 'react'
+import { ErrorBoundary } from 'react-error-boundary'
 import ExceptionBoundary from '@/components/domain/exception-boundary'
 import { useMyCardsQuery } from '@/hooks/api/queries/useMyCardsQuery'
 import { useIntersectionObserver } from '@/hooks/useIntersectionObserver'
@@ -48,7 +49,9 @@ const MyCardListContent = () => {
         isEmpty={isEmpty}
         isFetchingNextPage={isFetchingNextPage}
       >
-        <MyCardList data={data} />
+        <ErrorBoundary fallback={<div>렌더링 중 문제가 발생했습니다.</div>}>
+          <MyCardList data={data} />
+        </ErrorBoundary>
       </ExceptionBoundary>
 
       <div ref={lastElementRef} />
diff --git a/src/app/(root)/(routes)/cards/my/components/my-card-list/MyCardList.tsx b/src/app/(root)/(routes)/cards/my/components/my-card-list/MyCardList.tsx
index c82e950d..b0cb4cc4 100644
--- a/src/app/(root)/(routes)/cards/my/components/my-card-list/MyCardList.tsx
+++ b/src/app/(root)/(routes)/cards/my/components/my-card-list/MyCardList.tsx
@@ -8,16 +8,20 @@ const MyCardList = ({
   data,
 }: {
   data: InfiniteData<GetMyCardListRes, unknown> | undefined
-}) => (
-  <>
-    {data?.pages.map(({ data: { cardList } }: GetMyCardListRes, pageIndex) => (
-      <Fragment key={pageIndex}>
-        {cardList.map((myCard: Card) => (
-          <MyCard key={myCard.cardId} card={myCard} />
-        ))}
-      </Fragment>
-    ))}
-  </>
-)
+}) => {
+  return (
+    <>
+      {data?.pages.map(
+        ({ data: { cardList } }: GetMyCardListRes, pageIndex) => (
+          <Fragment key={pageIndex}>
+            {cardList.map((myCard: Card) => (
+              <MyCard key={myCard.cardId} card={myCard} />
+            ))}
+          </Fragment>
+        ),
+      )}
+    </>
+  )
+}
 
 export default MyCardList
diff --git a/src/app/(root)/(routes)/chatrooms/components/chat-room-list-content/ChatRoomListContent.tsx b/src/app/(root)/(routes)/chatrooms/components/chat-room-list-content/ChatRoomListContent.tsx
index eb63ca28..fd9c6277 100644
--- a/src/app/(root)/(routes)/chatrooms/components/chat-room-list-content/ChatRoomListContent.tsx
+++ b/src/app/(root)/(routes)/chatrooms/components/chat-room-list-content/ChatRoomListContent.tsx
@@ -1,6 +1,7 @@
 'use client'
 
 import { useEffect, useRef, Fragment } from 'react'
+import { ErrorBoundary } from 'react-error-boundary'
 import ExceptionBoundary from '@/components/domain/exception-boundary'
 import { useChatRoomsQuery } from '@/hooks/api/queries/useChatRoomsQuery'
 import { useIntersectionObserver } from '@/hooks/useIntersectionObserver'
@@ -39,7 +40,9 @@ const ChatRoomListContent = () => {
         isEmpty={isEmpty}
         isFetchingNextPage={isFetchingNextPage}
       >
-        <ChatRoomList data={data} />
+        <ErrorBoundary fallback={<div>렌더링 중 문제가 발생했습니다.</div>}>
+          <ChatRoomList data={data} />
+        </ErrorBoundary>
       </ExceptionBoundary>
 
       <div ref={lastElementRef} />
diff --git a/src/app/(root)/(routes)/dibs/components/MyDibsTemplate.tsx b/src/app/(root)/(routes)/dibs/components/MyDibsTemplate.tsx
index 18997628..758f5196 100644
--- a/src/app/(root)/(routes)/dibs/components/MyDibsTemplate.tsx
+++ b/src/app/(root)/(routes)/dibs/components/MyDibsTemplate.tsx
@@ -1,6 +1,7 @@
 'use client'
 
 import { useEffect, useRef } from 'react'
+import { ErrorBoundary } from 'react-error-boundary'
 import ExceptionBoundary from '@/components/domain/exception-boundary'
 import { useMyDibsQuery } from '@/hooks/api/queries/useMyDibsQuery'
 import { useIntersectionObserver } from '@/hooks/useIntersectionObserver'
@@ -40,7 +41,9 @@ const MyDibsTemplate = () => {
         isEmpty={isEmpty}
         isFetchingNextPage={isFetchingNextPage}
       >
-        <MyDibsList data={data} />
+        <ErrorBoundary fallback={<div>렌더링 중 문제가 발생했습니다.</div>}>
+          <MyDibsList data={data} />
+        </ErrorBoundary>
       </ExceptionBoundary>
 
       <div ref={lastElementRef} />
diff --git a/src/app/(root)/(routes)/history/components/my-trade-history-list-content/MyTradeHistoryListContent.tsx b/src/app/(root)/(routes)/history/components/my-trade-history-list-content/MyTradeHistoryListContent.tsx
index 86c770da..96bd21bf 100644
--- a/src/app/(root)/(routes)/history/components/my-trade-history-list-content/MyTradeHistoryListContent.tsx
+++ b/src/app/(root)/(routes)/history/components/my-trade-history-list-content/MyTradeHistoryListContent.tsx
@@ -1,6 +1,7 @@
 'use client'
 
 import { useEffect, useRef, Fragment } from 'react'
+import { ErrorBoundary } from 'react-error-boundary'
 import ExceptionBoundary from '@/components/domain/exception-boundary'
 import { useMyTradeHistoryQuery } from '@/hooks/api/queries/useMyTradeHistoriesQuery'
 import { useIntersectionObserver } from '@/hooks/useIntersectionObserver'
@@ -39,7 +40,9 @@ const MyTradeHistoryListContent = () => {
         isEmpty={isEmpty}
         isFetchingNextPage={isFetchingNextPage}
       >
-        <MyTradeHistoryList data={data} />
+        <ErrorBoundary fallback={<div>렌더링 중 문제가 발생했습니다.</div>}>
+          <MyTradeHistoryList data={data} />
+        </ErrorBoundary>
       </ExceptionBoundary>
 
       <div ref={lastElementRef} />
diff --git a/src/app/(root)/(routes)/notifications/components/notification-list-content/NotificationListContent.tsx b/src/app/(root)/(routes)/notifications/components/notification-list-content/NotificationListContent.tsx
index 1f0b7822..02e81654 100644
--- a/src/app/(root)/(routes)/notifications/components/notification-list-content/NotificationListContent.tsx
+++ b/src/app/(root)/(routes)/notifications/components/notification-list-content/NotificationListContent.tsx
@@ -1,6 +1,7 @@
 'use client'
 
 import { useEffect, useRef, useState } from 'react'
+import { ErrorBoundary } from 'react-error-boundary'
 import ExceptionBoundary from '@/components/domain/exception-boundary'
 import { useNotificationsQuery } from '@/hooks/api/queries/useNotificationsQuery'
 import { useIntersectionObserver } from '@/hooks/useIntersectionObserver'
@@ -45,7 +46,9 @@ const NotificationListContent = () => {
         isEmpty={isEmpty}
         isFetchingNextPage={isFetchingNextPage}
       >
-        <NotificationList data={data} />
+        <ErrorBoundary fallback={<div>렌더링 중 문제가 발생했습니다.</div>}>
+          <NotificationList data={data} />
+        </ErrorBoundary>
       </ExceptionBoundary>
       <div ref={lastElementRef} />
     </>
diff --git a/src/app/(root)/(routes)/suggestions/[myCardId]/components/my-suggestion-list-content/MySuggestionListContent.tsx b/src/app/(root)/(routes)/suggestions/[myCardId]/components/my-suggestion-list-content/MySuggestionListContent.tsx
index 333be6e6..56d47a55 100644
--- a/src/app/(root)/(routes)/suggestions/[myCardId]/components/my-suggestion-list-content/MySuggestionListContent.tsx
+++ b/src/app/(root)/(routes)/suggestions/[myCardId]/components/my-suggestion-list-content/MySuggestionListContent.tsx
@@ -1,6 +1,7 @@
 'use client'
 
 import { useEffect, useRef, useState } from 'react'
+import { ErrorBoundary } from 'react-error-boundary'
 import { useParams } from 'next/navigation'
 import ExceptionBoundary from '@/components/domain/exception-boundary'
 import { useMySuggestionsQuery } from '@/hooks/api/queries/useMySuggestionsQuery'
@@ -51,11 +52,13 @@ const MySuggestionListContent = () => {
         isEmpty={isEmpty}
         isFetchingNextPage={isFetchingNextPage}
       >
-        <MySuggestionList
-          data={data}
-          suggestionTypeState={suggestionTypeState}
-          directionTypeState={directionTypeState}
-        />
+        <ErrorBoundary fallback={<div>렌더링 중 문제가 발생했습니다.</div>}>
+          <MySuggestionList
+            data={data}
+            suggestionTypeState={suggestionTypeState}
+            directionTypeState={directionTypeState}
+          />
+        </ErrorBoundary>
       </ExceptionBoundary>
 
       <div ref={lastElementRef} />
diff --git a/src/components/domain/exception-boundary/ExceptionBoundary.tsx b/src/components/domain/exception-boundary/ExceptionBoundary.tsx
index f2bec3b2..48ee3273 100644
--- a/src/components/domain/exception-boundary/ExceptionBoundary.tsx
+++ b/src/components/domain/exception-boundary/ExceptionBoundary.tsx
@@ -18,7 +18,7 @@ const ExceptionBoundary: React.FC<ExceptionBoundaryProps> = ({
   children,
 }: ExceptionBoundaryProps) => {
   if (isLoading) {
-    return <Loading />
+    return <div>데이터 없음</div>
   }
 
   if (isError) {
@@ -26,19 +26,12 @@ const ExceptionBoundary: React.FC<ExceptionBoundaryProps> = ({
   }
 
   if (isEmpty) {
-    return (
-      <NoData
-        title="해당 물건이 존재 하지 않습니다."
-        onClickButton={() => router.push('/cards/new')}
-        buttonContent="물건 등록하러 가기"
-      />
-    )
+    return <div>데이터가 존재하지 않습니다.</div>
   }
-
   return (
     <>
       {children}
-      {isFetchingNextPage && <div>다음 페이지 불러오는중...</div>}
+      {isFetchingNextPage && <Loading />}
     </>
   )
 }
diff --git a/src/contexts/TanstackQueryContext.tsx b/src/contexts/TanstackQueryContext.tsx
index 64af7e12..328aa752 100644
--- a/src/contexts/TanstackQueryContext.tsx
+++ b/src/contexts/TanstackQueryContext.tsx
@@ -14,6 +14,7 @@ const TanstackQueryGlobalConfig = {
       retry: 3,
       retryDelay: 1000,
       suspense: true,
+      useErrorBoundary: true,
     },
   },
 }
diff --git a/src/hooks/api/queries/useCardsQuery.ts b/src/hooks/api/queries/useCardsQuery.ts
index 0abf3968..eb8dde15 100644
--- a/src/hooks/api/queries/useCardsQuery.ts
+++ b/src/hooks/api/queries/useCardsQuery.ts
@@ -29,5 +29,6 @@ export const useCardsQuery = ({
       return lastPage.data.nextCursorId
     },
     staleTime: LIST_STALE_TIME,
+    gcTime: 0,
   })
 }