Merge pull request #473 from soma0078/React-이송아-sprint7

[이송아] sprint7

src/App.js

@@ -0,0 +1,33 @@
+import { BrowserRouter, Route, Routes } from 'react-router-dom';
+// import HomePage from './pages/HomePage/HomePage';
+// import LoginPage from './pages/LoginPage/LoginPage';
+import MarketPage from './pages/MarketPage/MarketPage';
+import AddItemPage from './pages/AddItemPage/AddItemPage';
+// import CommunityFeedPage from './pages/CommunityFeedPage/CommunityFeedPage';
+import Header from './components/Layout/Header';
+import ProductPage from './pages/ProductPage/ProductPage';
+
+function App() {
+  return (
+    <BrowserRouter>
+      {/* Global Navigation Bar */}
+      <Header />
+
+      <div className="withHeader">
+        <Routes>
+          {/* React Router v6부터는 path="/" 대신 간단하게 `index`라고 표기하면 돼요 */}
+          {/* <Route index element={<HomePage />} /> */}
+          {/* <Route path="login" element={<LoginPage />} /> */}
+          <Route path="items">
+            <Route index element={<MarketPage />} />
+            <Route path="products/:productId" element={<ProductPage />} />
+          </Route>
+          <Route path="additem" element={<AddItemPage />} />
+          {/* <Route path="community" element={<CommunityFeedPage />} /> */}
+        </Routes>
+      </div>
+    </BrowserRouter>
+  );
+}
+
+export default App;

src/api/itemApi.js

@@ -0,0 +1,46 @@
+export async function getProducts(params = {}) {
+  // URLSearchParams을 이용하면 파라미터 값을 자동으로 쉽게 인코딩할 수 있어요.
+  const query = new URLSearchParams(params).toString();
+
+  try {
+    const response = await fetch(`https://panda-market-api.vercel.app/products?${query}`);
+    if (!response.ok) {
+      throw new Error(`HTTP error: ${response.status}`);
+    }
+    const body = await response.json();
+    return body;
+  } catch (error) {
+    console.error('Failed to fetch products:', error);
+    throw error;
+  }
+}
+
+export async function getProductDetails(productId) {
+  try {
+    const response = await fetch(`https://panda-market-api.vercel.app/products/${productId}`);
+    if (!response.ok) {
+      throw new Error('Failed to fetch product details');
+    }
+    const data = await response.json();
+    return data;
+  } catch (error) {
+    console.error('Error fetching product:', error);
+    throw error;
+  }
+}
+
+export async function getProductComments(productId, commentId) {
+  try {
+    const response = await fetch(`https://panda-market-api.vercel.app/products/${productId}/${commentId}`);
+    if (!response.ok) {
+      throw new Error('Failed to fetch product comments');
+    }
+    const responseData = await response.json();
+
+    // 'list' 키에 해당하는 배열을 반환합니다.
+    return responseData.list || [];
+  } catch (error) {
+    console.error('Error fetching product comments:', error);
+    throw error;
+  }
+}