fix(course-tour-info) : sheet bottom에서 올라오는 거 right로 변경

src/app/(pages)/course/_components/course-surrond-tour/course-surrond-info.tsx

@@ -105,8 +105,8 @@ export function CourseSurrondInfo() {
         주변 정보 보기
       </SheetTrigger>
       <SheetContent
-        side='bottom'
-        className='mobile-area bg-gray-bg flex h-screen flex-col'
+        side='right'
+        className='bg-gray-bg flex h-screen w-full flex-col'
       >
         <SheetHeader className='border-gray-0 flex-shrink-0 border-b-8'>
           <SheetTitle className='flex h-14 w-full items-center justify-between px-4 py-3'>
@@ -130,7 +130,6 @@ export function CourseSurrondInfo() {
         >
           {allTourInfo.map((item, index) => {
             const shouldAttachObserver = index % 10 === 5; // 6번째 (0-based index 5)
-
             return (
               <div
                 key={`${item.contentId}-${index}`}

src/app/(pages)/home/page.tsx

@@ -1,17 +1,51 @@
+import {
+  dehydrate,
+  HydrationBoundary,
+  QueryClient,
+} from '@tanstack/react-query';
 import { HomeHeader, RecentCourse, CourseSection } from './_components';
+import {
+  getUserDataCached,
+  getPopularCourses,
+  getRecommendedCourses,
+  getCourseHistory,
+} from '@/lib/api/home';
 
-export default function HomePage() {
+export default async function HomePage() {
+  const queryClient = new QueryClient();
+
+  // 데이터 미리 가져오기 - 병렬 prefetch
+  await Promise.allSettled([
+    queryClient.prefetchQuery({
+      queryKey: ['userData'],
+      queryFn: getUserDataCached,
+    }),
+    queryClient.prefetchQuery({
+      queryKey: ['popularCourses'],
+      queryFn: getPopularCourses,
+    }),
+    queryClient.prefetchQuery({
+      queryKey: ['recommendedCourses'],
+      queryFn: getRecommendedCourses,
+    }),
+    queryClient.prefetchQuery({
+      queryKey: ['courseHistory'],
+      queryFn: getCourseHistory,
+    }),
+  ]);
   return (
-    <main className='flex w-full flex-col'>
-      <HomeHeader />
-      <div className='py-8'>
-        <RecentCourse />
-      </div>
-      <hr className='bg-gray-0 h-2 w-full' />
-      <div className='py-4'>
-        <CourseSection />
-      </div>
-      <div className='h-[64px]' />
-    </main>
+    <HydrationBoundary state={dehydrate(queryClient)}>
+      <main className='flex w-full flex-col'>
+        <HomeHeader />
+        <div className='py-8'>
+          <RecentCourse />
+        </div>
+        <hr className='bg-gray-0 h-2 w-full' />
+        <div className='py-4'>
+          <CourseSection />
+        </div>
+        <div className='h-[64px]' />
+      </main>
+    </HydrationBoundary>
   );
 }

src/components/ui/sheet.tsx

@@ -61,7 +61,7 @@ function SheetContent({
         className={cn(
           'bg-background data-[state=open]:animate-in data-[state=closed]:animate-out fixed z-[1000] flex flex-col shadow-lg transition ease-in-out data-[state=closed]:duration-300 data-[state=open]:duration-500',
           side === 'right' &&
-            'data-[state=closed]:slide-out-to-right data-[state=open]:slide-in-from-right inset-y-0 right-0 h-full w-3/4 border-l sm:max-w-sm',
+            'data-[state=closed]:slide-out-to-right data-[state=open]:slide-in-from-right inset-y-0 right-0 h-full w-full border-l sm:max-w-sm',
           side === 'left' &&
             'data-[state=closed]:slide-out-to-left data-[state=open]:slide-in-from-left inset-y-0 left-0 h-full w-3/4 border-r sm:max-w-sm',
           side === 'top' &&

src/lib/api/index.ts

@@ -1,6 +1,8 @@
 import { fetchQuery } from './fetch-query';
 import { fetchMutation, type MutationOptions } from './fetch-mutation';
 import { FetchOptions } from '@/interfaces/api/request.types';
+import { cache } from 'react';
+import { ApiResponse } from '@/interfaces/api/response.types';
 
 /**
  * 공개 URL 패턴 (토큰 불필요)
@@ -88,6 +90,23 @@ const addAuthHeaders = async (
     },
   };
 };
+
+/**
+ * @description 캐시된 GET 요청 함수
+ * @param endpoint API 엔드포인트
+ * @param options fetch 옵션 (캐싱 설정 포함)
+ * @returns Promise<ApiResponse<T>>
+ */
+export const cachedGet = cache(
+  async <T>(
+    endpoint: string,
+    options?: Omit<FetchOptions, 'method' | 'body'>,
+  ): Promise<ApiResponse<T>> => {
+    const enhancedOptions = await addAuthHeaders(endpoint, options);
+    return await fetchQuery<T>(endpoint, enhancedOptions);
+  },
+);
+
 /**
  * @description 편의를 위한 fetch API 래퍼 함수들
  * @example