frontend/src/api/schedule/scheduleAPI.ts

@@ -1,6 +1,12 @@
 import apiClient from "@_api/apiClient";
-import type { AdminScheduleSummaryListResponse, ScheduleCreateRequest, ScheduleCreateResponse, ScheduleStatus, ScheduleUpdateRequest, ScheduleWithThemeListResponse } from "./scheduleTypes";
-import type { AuditInfo } from "@_api/common/commonTypes";
+import type {AuditInfo} from "@_api/common/commonTypes";
+import type {
+    AdminScheduleSummaryListResponse,
+    ScheduleCreateRequest,
+    ScheduleCreateResponse,
+    ScheduleUpdateRequest,
+    ScheduleWithThemeListResponse
+} from "./scheduleTypes";
 
 // admin 
 export const fetchAdminSchedules = async (storeId: string, date?: string, themeId?: string): Promise<AdminScheduleSummaryListResponse> => {

frontend/src/api/store/storeAPI.ts

@@ -12,11 +12,11 @@ export const getStores = async (sidoCode?: string, sigunguCode?: string): Promis
     const queryParams: string[] = [];
 
     if (sidoCode && sidoCode.trim() !== '') {
-        queryParams.push(`sidoCode=${sidoCode}`);
+        queryParams.push(`sido=${sidoCode}`);
     }
 
     if (sigunguCode && sigunguCode.trim() !== '') {
-        queryParams.push(`sigunguCode=${sigunguCode}`);
+        queryParams.push(`sigungu=${sigunguCode}`);
     }
 
     const baseUrl = `/stores`;

frontend/src/api/theme/themeAPI.ts

@@ -42,3 +42,7 @@ export const fetchThemesByIds = async (request: ThemeIdListResponse): Promise<Th
 export const fetchThemeById = async (id: string): Promise<ThemeInfoResponse> => {
     return await apiClient.get<ThemeInfoResponse>(`/themes/${id}`);
 }
+
+export const fetchMostReservedThemes = async (count: number): Promise<ThemeInfoListResponse> => {
+    return await apiClient.get<ThemeInfoListResponse>(`/themes/most-reserved?count=${count}`);
+};

frontend/src/pages/HomePage.tsx

@@ -1,8 +1,7 @@
-import {fetchMostReservedThemeIds} from '@_api/reservation/reservationAPI';
 import '@_css/home-page-v2.css';
 import React, {useEffect, useState} from 'react';
 import {useNavigate} from 'react-router-dom';
-import {fetchThemesByIds} from '@_api/theme/themeAPI';
+import {fetchMostReservedThemes} from '@_api/theme/themeAPI';
 import {DifficultyKoreanMap, mapThemeResponse, type ThemeInfoResponse} from '@_api/theme/themeTypes';
 
 const HomePage: React.FC = () => {
@@ -13,19 +12,8 @@ const HomePage: React.FC = () => {
   useEffect(() => {
     const fetchData = async () => {
       try {
-        const themeIds = await fetchMostReservedThemeIds().then(res => {
-          const themeIds = res.themeIds;
-          if (themeIds.length === 0) {
-            setRanking([]);
-            return;
-          }
-          return themeIds;
-        })
-        
-        if (themeIds === undefined) return;
-        if (themeIds.length === 0) return;
-
-        const response = await fetchThemesByIds({ themeIds: themeIds });
+        const themeFetchCount = 10;
+        const response = await fetchMostReservedThemes(themeFetchCount);
         setRanking(response.themes.map(mapThemeResponse));
       } catch (err) {
         console.error('Error fetching ranking:', err);

frontend/src/pages/ReservationStep1Page.tsx

@@ -60,9 +60,13 @@ const ReservationStep1Page: React.FC = () => {
     }, [selectedSido]);
 
     useEffect(() => {
+        if (selectedSido) {
             getStores(selectedSido, selectedSigungu)
                 .then(res => setStoreList(res.stores))
                 .catch(handleError);
+        } else {
+            setStoreList([]);
+        }
         setSelectedStore(null);
     }, [selectedSido, selectedSigungu]);