지도크기오류 수정

App.tsx

@@ -58,6 +58,24 @@ const UserLocationIcon = L.divIcon({
   iconAnchor: [20, 20],
 });
 
+const MapResizer = () => {
+  const map = useMap();
+  useEffect(() => {
+    const handleResize = () => {
+      setTimeout(() => {
+        map.invalidateSize();
+      }, 100);
+    };
+    
+    // Initial resize to fix gray area on load
+    handleResize();
+
+    window.addEventListener('resize', handleResize);
+    return () => window.removeEventListener('resize', handleResize);
+  }, [map]);
+  return null;
+};
+
 const ChangeView = ({ center, zoom }: { center: [number, number], zoom?: number }) => {
   const map = useMap();
   useEffect(() => {
@@ -365,7 +383,8 @@ const App: React.FC = () => {
       </div>
 
       <div className="flex-1 relative">
-        <MapContainer center={mapCenter} zoom={17} zoomControl={false}>
+        <MapContainer center={mapCenter} zoom={currentZoom} zoomControl={false} style={{ height: '100%', width: '100%' }}>
+          <MapResizer />
           <ChangeView center={mapCenter} />
           <TileLayer url="https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png" />
           <MapInterface 

server.js

@@ -11,6 +11,7 @@ const __dirname = path.dirname(__filename);
 
 const app = express();
 const PORT = process.env.PORT || 3000;
+const isDebug = process.env.NODE_ENV !== 'production' || process.env.DEBUG === 'true';
 
 // Middleware
 app.use(cors());
@@ -57,10 +58,10 @@ async function initializeDB() {
 // Routes
 app.get('/api/markers', async (req, res) => {
   const host = req.headers.host;
-  console.log(`[API] GET /api/markers - Host: ${host} - Fetching from SQLite`);
+  if (isDebug) console.log(`[API] GET /api/markers - Host: ${host} - Fetching from SQLite`);
   try {
     const markers = await db.all('SELECT * FROM markers');
-    console.log(`[API] Found ${markers.length} markers`);
+    if (isDebug) console.log(`[API] Found ${markers.length} markers`);
     // Convert isPublic from 0/1 to boolean
     const formattedMarkers = markers.map(m => ({
       ...m,
@@ -75,7 +76,7 @@ app.get('/api/markers', async (req, res) => {
 
 app.post('/api/markers', async (req, res) => {
   const { id, name, ssid, password, lat, lng, securityType, iconType, description, addedBy, createdAt, isPublic } = req.body;
-  console.log(`[API] POST /api/markers - Saving marker: ${name} (${ssid}) to SQLite`);
+  if (isDebug) console.log(`[API] POST /api/markers - Saving marker: ${name} (${ssid}) to SQLite`);
   
   try {
     await db.run(`
@@ -83,7 +84,7 @@ app.post('/api/markers', async (req, res) => {
       VALUES (?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?)
     `, [id, name, ssid, password, lat, lng, securityType, iconType, description || '', addedBy, createdAt, isPublic ? 1 : 0]);
     
-    console.log(`[API] Successfully saved marker: ${id}`);
+    if (isDebug) console.log(`[API] Successfully saved marker: ${id}`);
     res.json({ success: true });
   } catch (error) {
     console.error(error);
@@ -93,10 +94,10 @@ app.post('/api/markers', async (req, res) => {
 
 app.delete('/api/markers/:id', async (req, res) => {
   const { id } = req.params;
-  console.log(`[API] DELETE /api/markers/${id} - Deleting marker from SQLite`);
+  if (isDebug) console.log(`[API] DELETE /api/markers/${id} - Deleting marker from SQLite`);
   try {
     await db.run('DELETE FROM markers WHERE id = ?', [id]);
-    console.log(`[API] Successfully deleted marker: ${id}`);
+    if (isDebug) console.log(`[API] Successfully deleted marker: ${id}`);
     res.json({ success: true });
   } catch (error) {
     console.error(error);

services/api.ts

@@ -2,16 +2,16 @@
 import { WiFiHotspot } from '../types';
 
 const API_Base_URL = '/api/markers';
+const isDebug = import.meta.env.DEV;
 
 export const apiService = {
   getHotspots: async (): Promise<WiFiHotspot[]> => {
-    const fullUrl = `${window.location.origin}${API_Base_URL}`;
+    if (isDebug) console.log(`[API Call] GET ${window.location.origin}${API_Base_URL}`);
-    console.log(`[API Call] GET ${fullUrl} (Origin: ${window.location.origin})`);
     try {
-      const response = await fetch(API_Base_URL, { cache: 'no-store' }); // 캐시 방지 추가
+      const response = await fetch(API_Base_URL, { cache: 'no-store' });
       if (!response.ok) throw new Error('Failed to fetch markers');
       const data = await response.json();
-      console.log(`[API Response] Received ${data.length} hotspots`, data);
+      if (isDebug) console.log(`[API Response] Received ${data.length} hotspots`, data);
       return data;
     } catch (e) {
       console.error("Failed to load hotspots from API", e);
@@ -20,7 +20,7 @@ export const apiService = {
   },
 
   saveHotspot: async (hotspot: WiFiHotspot): Promise<void> => {
-    console.log(`[API Call] POST ${API_Base_URL}`, hotspot);
+    if (isDebug) console.log(`[API Call] POST ${API_Base_URL}`, hotspot);
     try {
       const response = await fetch(API_Base_URL, {
         method: 'POST',
@@ -31,7 +31,7 @@ export const apiService = {
       });
       if (!response.ok) throw new Error('Failed to save marker');
       const data = await response.json();
-      console.log(`[API Response] Save success:`, data);
+      if (isDebug) console.log(`[API Response] Save success:`, data);
       // Trigger a storage event to refresh UI if needed (keeping compatibility)
       window.dispatchEvent(new Event('storage_updated'));
     } catch (e) {
@@ -41,14 +41,14 @@ export const apiService = {
 
   deleteHotspot: async (id: string): Promise<void> => {
     const url = `${API_Base_URL}/${id}`;
-    console.log(`[API Call] DELETE ${url}`);
+    if (isDebug) console.log(`[API Call] DELETE ${url}`);
     try {
       const response = await fetch(url, {
         method: 'DELETE',
       });
       if (!response.ok) throw new Error('Failed to delete marker');
       const data = await response.json();
-      console.log(`[API Response] Delete success:`, data);
+      if (isDebug) console.log(`[API Response] Delete success:`, data);
       window.dispatchEvent(new Event('storage_updated'));
     } catch (e) {
       console.error("Failed to delete hotspot", e);

services/geminiService.ts

@@ -3,6 +3,7 @@ import { GoogleGenAI, Type } from "@google/genai";
 
 const apiKey = import.meta.env.VITE_GEMINI_API_KEY || process.env.GEMINI_API_KEY || process.env.API_KEY || '';
 if (!apiKey) console.error("API Key is missing!");
+const isDebug = import.meta.env.DEV;
 const ai = new GoogleGenAI({ apiKey });
 
 export interface DetailedSearchResult {
@@ -15,7 +16,7 @@ export interface DetailedSearchResult {
 export const geminiService = {
   async searchNearbyWiFi(query: string, location: { lat: number, lng: number }) {
     try {
-      console.log("Stage 1: 정보 검색 시작...");
+      if (isDebug) console.log("Stage 1: 정보 검색 시작...");
       
       // Stage 1: Google Search/Maps Grounding을 통해 원시 데이터 확보
       const searchResponse = await ai.models.generateContent({
@@ -36,13 +37,13 @@ export const geminiService = {
       });
 
       const rawText = searchResponse.text || "";
-      console.log("Stage 1 원문 결과:", rawText);
+      if (isDebug) console.log("Stage 1 원문 결과:", rawText);
 
       if (!rawText) {
         return { text: "검색 결과를 가져오지 못했습니다.", results: [] };
       }
 
-      console.log("Stage 2: 데이터 구조화 추출 시작...");
+      if (isDebug) console.log("Stage 2: 데이터 구조화 추출 시작...");
 
       // Stage 2: 획득한 텍스트에서 JSON 형태로 좌표 및 정보 정밀 추출
       const parseResponse = await ai.models.generateContent({
@@ -74,7 +75,7 @@ export const geminiService = {
       let results: DetailedSearchResult[] = [];
       try {
         results = JSON.parse(parseResponse.text || "[]");
-        console.log("Stage 2 추출 성공:", results);
+        if (isDebug) console.log("Stage 2 추출 성공:", results);
       } catch (e) {
         console.error("JSON 파싱 실패:", e);
       }