renaming, restructuring, adding an api util to the frontend (currently editPage only and a mock backend

frontend/src/components/recipes/RecipeListPage.tsx

@@ -0,0 +1,24 @@
+import { recipes } from "../../mock_data/recipes"
+import RecipeListItem from "./RecipeListItem"
+
+/**
+ * Displays a list of recipes in a sidebar layout.
+ * Each recipe link fills the available width.
+ */
+export default function RecipeListPage() {
+  return (
+    <div className="sidebar">
+      <h1 className="sidebar-title">Recipes</h1>
+
+      <div className="flex flex-col gap-2">
+        {recipes.map((recipe) => (
+          <RecipeListItem 
+            key={recipe.id}
+            title = {recipe.title}
+            targetPath={'recipe/'+recipe.id}
+          />
+        ))}
+      </div>
+    </div>
+  )
+}