[김수연] sprint11

package.json

@@ -10,15 +10,21 @@
   },
   "dependencies": {
     "@babel/runtime": "^7.27.1",
+    "@hookform/resolvers": "^5.0.1",
+    "@tanstack/react-query": "^5.76.2",
+    "@tanstack/react-query-devtools": "^5.77.1",
     "@types/styled-components": "^5.1.34",
     "axios": "^1.9.0",
     "clsx": "^2.1.1",
     "next": "15.3.0",
     "react": "^19.0.0",
     "react-dom": "^19.0.0",
+    "react-hook-form": "^7.56.4",
     "react-router-dom": "^7.5.0",
     "sass": "^1.89.0",
     "styled-components": "^6.1.18",
+    "use-debounce": "^10.0.4",
+    "zod": "^3.25.28",
     "zustand": "^5.0.5"
   },
   "devDependencies": {

src/app/ClientLayout.tsx

@@ -1,18 +1,23 @@
 'use client'
 
-import { ThemeProvider } from 'styled-components'
-import { theme } from '../styles/theme'
+import React, { useState } from 'react'
+import { QueryClient, QueryClientProvider } from '@tanstack/react-query'
+import { ReactQueryDevtools } from '@tanstack/react-query-devtools'
+
 import GlobalStyles from '../styles/GlobalStyles'
 
 export default function ClientLayout({
   children,
 }: {
   children: React.ReactNode
 }) {
+  const [queryClient] = useState(() => new QueryClient())
   return (
-    <ThemeProvider theme={theme}>
+    <QueryClientProvider client={queryClient}>
       <GlobalStyles />
       {children}
-    </ThemeProvider>
+
+      <ReactQueryDevtools initialIsOpen={false} />
+    </QueryClientProvider>
   )
 }