fix(front,back) Добавил на бек выгрузку категорий, начало разработки shop

frontend/src/pages/About.jsx

@@ -1,6 +1,18 @@
 import PageLayout from "../components/PageLayout";
+import { useState, useEffect } from "react"
+import * as api from '../api/index'
 
 export default function Shop() {
+
+  const [items, setItems] = useState([])
+  const [loading, setLoading] = useState(true);
+
+  useEffect(() => {
+    pa
+  })
+
+
+
   return (
     <PageLayout>
       <main className="px-16 grow w-full">

frontend/src/pages/Shop.jsx

@@ -1,14 +1,38 @@
 import PageLayout from "../components/PageLayout";
+import * as api from "../api/index";
+import { useState, useEffect } from "react";
 
 export default function Shop() {
+  const [items, setItems] = useState([]);
+  const [categories, setCategories] = useState([]);
+  const [activeCategory, setActiveCategory] = useState("all");
+  const [loading, setLoading] = useState(true);
+
+  useEffect(() => {
+    Promise.all([api.getAllItems(), api.getAllCategories()])
+      .then((itemsRes, categoriesRes) => {
+        setItems(itemsRes.data);
+        setCategories(categoriesRes.data);
+        setLoading(false);
+      })
+      .catch((err) => {
+        console.error("Ошибка при загрузке товара", err);
+        setLoading(false);
+      });
+  }, []);
+
+  const filteredItems =
+    activeCategory === "all"
+      ? items
+      : items.fitler(
+        (item) =>
+          item.category?.toLowerCase() === activeCategory.toLowerCase(),
+      );
+
   return (
     <PageLayout>
       <main className="px-16 grow w-full">
-        <div className="flex flex-row text-white">
-          <div className="text-4xl flex-col">
-            <h1 className="uppercase">fish fish</h1>
-          </div>
-        </div>
+        <div className="flex flex-row text-white"></div>
       </main>
     </PageLayout>
   );