[차경훈] sprint6

react/my-react-app/package.json

@@ -11,7 +11,8 @@
   },
   "dependencies": {
     "react": "^19.1.0",
-    "react-dom": "^19.1.0"
+    "react-dom": "^19.1.0",
+    "styled-components": "^6.1.18"
   },
   "devDependencies": {
     "@eslint/js": "^9.25.0",

react/my-react-app/src/App.jsx

@@ -1,5 +1,5 @@
 import React from "react";
-import { BrowserRouter, Routes, Route } from "react-router-dom";
+import { BrowserRouter, Routes, Route, useLocation } from "react-router-dom";
 import Header from "./components/Header";
 import Footer from "./components/Footer";
 import HomePage from "./pages/HomePage";
@@ -11,10 +11,19 @@ import PrivacyPage from "./pages/PrivacyPage";
 import FaqPage from "./pages/FaqPage";
 import MyProfilePage from "./pages/MyProfilePage";
 
-function App() {
+function AppContent() {
+  const location = useLocation();
+  const hideFooterRoutes = ["/additem", "/signin", "/signup"];
+  const hideHeaderRoutes = ["/signin", "/signup"];
+
+  // 현재 라우트에 따라 헤더 표시 여부 결정
+  const shouldShowHeader = !hideHeaderRoutes.includes(location.pathname);
+  // 현재 라우트에 따라 푸터 표시 여부 결정
+  const shouldShowFooter = !hideFooterRoutes.includes(location.pathname);
+
   return (
-    <BrowserRouter>
-      <Header />
+    <>
+      {shouldShowHeader && <Header />}
       <Routes>
         <Route path="/" element={<HomePage />} />
         <Route path="/signin" element={<SigninPage />} />
@@ -25,7 +34,15 @@ function App() {
         <Route path="/faq" element={<FaqPage />} />
         <Route path="/myprofile" element={<MyProfilePage />} />
       </Routes>
-      <Footer />
+      {shouldShowFooter && <Footer />}
+    </>
+  );
+}
+
+function App() {
+  return (
+    <BrowserRouter>
+      <AppContent />
     </BrowserRouter>
   );
 }