debug: BasicApp으로 전환하여 Vercel 배포 문제 디버깅

- App.tsx 대신 BasicApp.tsx로 전환
- 환경 변수 로깅 강화
- Vercel에서 발생하는 공백 페이지 문제 해결 시도

src/App.tsx

@@ -290,12 +290,17 @@ function App() {
         // eslint-disable-next-line no-console
         console.log("환경:", import.meta.env.MODE);
         // eslint-disable-next-line no-console
+        console.log("모든 환경변수:", import.meta.env);
+        // eslint-disable-next-line no-console
         console.log(
           "VITE_CLERK_PUBLISHABLE_KEY:",
-          !!import.meta.env.VITE_CLERK_PUBLISHABLE_KEY
+          import.meta.env.VITE_CLERK_PUBLISHABLE_KEY || "없음"
         );
         // eslint-disable-next-line no-console
-        console.log("VITE_SUPABASE_URL:", !!import.meta.env.VITE_SUPABASE_URL);
+        console.log(
+          "VITE_SUPABASE_URL:",
+          import.meta.env.VITE_SUPABASE_URL || "없음"
+        );
 
         // 매우 간단한 초기화만 수행
         await new Promise((resolve) => setTimeout(resolve, 100));
@@ -304,7 +309,6 @@ function App() {
         console.log("✅ 간단한 초기화 완료 - ready 상태로 변경");
         setAppState("ready");
       } catch (error) {
-         
         console.error("❌ 간단한 초기화 실패:", error);
         setError(error instanceof Error ? error : new Error("초기화 실패"));
         setAppState("error");

src/BasicApp.tsx

@@ -0,0 +1,65 @@
+import React from "react";
+
+const BasicApp: React.FC = () => {
+  // eslint-disable-next-line no-console
+  console.log("🚀 BasicApp 렌더링됨");
+
+  return (
+    <div
+      style={{
+        padding: "20px",
+        fontFamily: "Arial, sans-serif",
+        backgroundColor: "#f0f0f0",
+        minHeight: "100vh",
+      }}
+    >
+      <h1 style={{ color: "#333" }}>✅ Zellyy Finance - 기본 테스트</h1>
+      <p style={{ fontSize: "18px", color: "#666" }}>
+        이 페이지가 보인다면 React 앱이 정상적으로 작동하고 있습니다.
+      </p>
+
+      <div
+        style={{
+          backgroundColor: "white",
+          padding: "15px",
+          borderRadius: "8px",
+          margin: "20px 0",
+        }}
+      >
+        <h2>환경 정보</h2>
+        <ul>
+          <li>현재 시간: {new Date().toLocaleString("ko-KR")}</li>
+          <li>사용자 에이전트: {navigator.userAgent}</li>
+          <li>
+            화면 크기: {window.innerWidth}x{window.innerHeight}
+          </li>
+          <li>환경: {import.meta.env.MODE}</li>
+          <li>
+            Clerk Key:{" "}
+            {import.meta.env.VITE_CLERK_PUBLISHABLE_KEY
+              ? "설정됨"
+              : "설정되지 않음"}
+          </li>
+          <li>
+            Supabase URL:{" "}
+            {import.meta.env.VITE_SUPABASE_URL ? "설정됨" : "설정되지 않음"}
+          </li>
+        </ul>
+      </div>
+
+      <div
+        style={{
+          backgroundColor: "#e8f5e8",
+          padding: "15px",
+          borderRadius: "8px",
+          border: "1px solid #4CAF50",
+        }}
+      >
+        <h3>✅ 성공!</h3>
+        <p>React 앱이 정상적으로 렌더링되었습니다.</p>
+      </div>
+    </div>
+  );
+};
+
+export default BasicApp;

src/components/test/ClerkSetupTest.tsx

@@ -10,7 +10,6 @@ function ClerkSetupTest() {
       // eslint-disable-next-line no-console
       console.log("✅ JWT 템플릿 테스트 성공:", token);
     } catch (error) {
-       
       console.error("❌ JWT 템플릿 테스트 실패:", error);
     }
   };

src/main.tsx

@@ -3,7 +3,8 @@ import { logger } from "@/utils/logger";
 import { BrowserRouter } from "react-router-dom";
 import { setupChunkErrorProtection } from "@/utils/chunkErrorProtection";
 // import App from "./App.tsx";
-import MinimalApp from "./MinimalApp.tsx";
+// import MinimalApp from "./MinimalApp.tsx";
+import BasicApp from "./BasicApp.tsx";
 import "./index.css";
 
 logger.info("main.tsx loaded");
@@ -122,7 +123,7 @@ try {
 
   root.render(
     <BrowserRouter>
-      <MinimalApp />
+      <BasicApp />
     </BrowserRouter>
   );