cleanup

.gitignore

@@ -1,6 +1,7 @@
-examp_frontend/
+db/
-postgres/db
 */.env
-.env
+.env*
 todo
 sqldumps/
+logs/
+dist/

backend/package.json

@@ -3,19 +3,26 @@
   "version": "1.0.0",
   "main": "index.js",
   "scripts": {
-    "dev": "node backendServer.js",
+    "dev": "nodemon ./src/index.js",
-    "demo": "node backendServer.js",
+    "production": "node ./src/index.js"
-    "production": "node backendServer.js"
   },
   "keywords": [],
   "author": "",
   "license": "ISC",
   "description": "",
   "dependencies": {
+    "@prisma/client": "^6.14.0",
+    "@types/node": "^24.2.1",
     "cors": "^2.8.5",
     "dotenv": "^17.0.1",
     "express": "^5.1.0",
     "knex": "^3.1.0",
-    "pg": "^8.16.3"
+    "pg": "^8.16.3",
+    "prisma": "^6.14.0",
+    "ts-node": "^10.9.2",
+    "typescript": "^5.9.2"
+  },
+  "devDependencies": {
+    "nodemon": "^3.1.10"
   }
 }

backend/prisma/migrations/0_init/migration.sql

@@ -0,0 +1,93 @@
+-- CreateSchema
+CREATE SCHEMA IF NOT EXISTS "public";
+
+-- CreateTable
+CREATE TABLE "public"."ingredients" (
+    "id" SERIAL NOT NULL,
+    "name" VARCHAR(255) NOT NULL,
+    "type" VARCHAR(255),
+    "notes" VARCHAR(255),
+    "created_at" TIMESTAMPTZ(6) NOT NULL DEFAULT CURRENT_TIMESTAMP,
+    "updated_at" TIMESTAMPTZ(6) NOT NULL DEFAULT CURRENT_TIMESTAMP,
+
+    CONSTRAINT "ingredients_pkey" PRIMARY KEY ("id")
+);
+
+-- CreateTable
+CREATE TABLE "public"."knex_migrations" (
+    "id" SERIAL NOT NULL,
+    "name" VARCHAR(255),
+    "batch" INTEGER,
+    "migration_time" TIMESTAMPTZ(6),
+
+    CONSTRAINT "knex_migrations_pkey" PRIMARY KEY ("id")
+);
+
+-- CreateTable
+CREATE TABLE "public"."knex_migrations_lock" (
+    "index" SERIAL NOT NULL,
+    "is_locked" INTEGER,
+
+    CONSTRAINT "knex_migrations_lock_pkey" PRIMARY KEY ("index")
+);
+
+-- CreateTable
+CREATE TABLE "public"."recipe_ingredients" (
+    "id" SERIAL NOT NULL,
+    "recipe_id" INTEGER NOT NULL,
+    "ingredient_id" INTEGER,
+    "quantity" VARCHAR(255),
+    "unit" VARCHAR(255),
+    "notes" VARCHAR(255),
+    "created_at" TIMESTAMPTZ(6) NOT NULL DEFAULT CURRENT_TIMESTAMP,
+    "updated_at" TIMESTAMPTZ(6) NOT NULL DEFAULT CURRENT_TIMESTAMP,
+    "raw" VARCHAR(255) DEFAULT '',
+
+    CONSTRAINT "recipe_ingredients_pkey" PRIMARY KEY ("id")
+);
+
+-- CreateTable
+CREATE TABLE "public"."recipe_steps" (
+    "id" SERIAL NOT NULL,
+    "recipe_id" INTEGER,
+    "step_number" INTEGER,
+    "instruction" VARCHAR(510),
+    "created_at" TIMESTAMPTZ(6) NOT NULL DEFAULT CURRENT_TIMESTAMP,
+    "updated_at" TIMESTAMPTZ(6) NOT NULL DEFAULT CURRENT_TIMESTAMP,
+
+    CONSTRAINT "recipe_steps_pkey" PRIMARY KEY ("id")
+);
+
+-- CreateTable
+CREATE TABLE "public"."recipes" (
+    "id" SERIAL NOT NULL,
+    "name" VARCHAR(255) NOT NULL,
+    "cuisine" VARCHAR(255) NOT NULL,
+    "created_at" TIMESTAMPTZ(6) NOT NULL DEFAULT CURRENT_TIMESTAMP,
+    "updated_at" TIMESTAMPTZ(6) NOT NULL DEFAULT CURRENT_TIMESTAMP,
+    "author" VARCHAR(255),
+    "stars" INTEGER,
+    "prep_minutes" INTEGER,
+    "cook_minutes" INTEGER,
+
+    CONSTRAINT "recipes_pkey" PRIMARY KEY ("id")
+);
+
+-- CreateIndex
+CREATE UNIQUE INDEX "ingredients_name_unique" ON "public"."ingredients"("name");
+
+-- CreateIndex
+CREATE INDEX "recipe_ingredients_ingredient_id_index" ON "public"."recipe_ingredients"("ingredient_id");
+
+-- CreateIndex
+CREATE INDEX "recipe_ingredients_recipe_id_index" ON "public"."recipe_ingredients"("recipe_id");
+
+-- CreateIndex
+CREATE INDEX "recipe_steps_recipe_id_index" ON "public"."recipe_steps"("recipe_id");
+
+-- CreateIndex
+CREATE UNIQUE INDEX "recipe_steps_recipe_id_step_number_unique" ON "public"."recipe_steps"("recipe_id", "step_number");
+
+-- CreateIndex
+CREATE UNIQUE INDEX "recipes_name_unique" ON "public"."recipes"("name");
+

backend/prisma/migrations/20250813174641_remove_knex_migration_tables/migration.sql

@@ -0,0 +1,12 @@
+/*
+  Warnings:
+
+  - You are about to drop the `knex_migrations` table. If the table is not empty, all the data it contains will be lost.
+  - You are about to drop the `knex_migrations_lock` table. If the table is not empty, all the data it contains will be lost.
+
+*/
+-- DropTable
+DROP TABLE "public"."knex_migrations";
+
+-- DropTable
+DROP TABLE "public"."knex_migrations_lock";

backend/prisma/migrations/20250813232401_recipe_relationships/migration.sql

@@ -0,0 +1,20 @@
+/*
+  Warnings:
+
+  - You are about to drop the `ingredients` table. If the table is not empty, all the data it contains will be lost.
+
+*/
+-- AlterTable
+ALTER TABLE "public"."recipe_ingredients" ADD COLUMN     "recipesId" INTEGER;
+
+-- AlterTable
+ALTER TABLE "public"."recipe_steps" ADD COLUMN     "recipesId" INTEGER;
+
+-- DropTable
+DROP TABLE "public"."ingredients";
+
+-- AddForeignKey
+ALTER TABLE "public"."recipe_ingredients" ADD CONSTRAINT "recipe_ingredients_recipesId_fkey" FOREIGN KEY ("recipesId") REFERENCES "public"."recipes"("id") ON DELETE SET NULL ON UPDATE CASCADE;
+
+-- AddForeignKey
+ALTER TABLE "public"."recipe_steps" ADD CONSTRAINT "recipe_steps_recipesId_fkey" FOREIGN KEY ("recipesId") REFERENCES "public"."recipes"("id") ON DELETE SET NULL ON UPDATE CASCADE;

backend/prisma/migrations/20250813233727_fix_relationship_ref/migration.sql

@@ -0,0 +1,11 @@
+-- DropForeignKey
+ALTER TABLE "public"."recipe_ingredients" DROP CONSTRAINT "recipe_ingredients_recipesId_fkey";
+
+-- DropForeignKey
+ALTER TABLE "public"."recipe_steps" DROP CONSTRAINT "recipe_steps_recipesId_fkey";
+
+-- AddForeignKey
+ALTER TABLE "public"."recipe_ingredients" ADD CONSTRAINT "recipe_ingredients_recipe_id_fkey" FOREIGN KEY ("recipe_id") REFERENCES "public"."recipes"("id") ON DELETE RESTRICT ON UPDATE CASCADE;
+
+-- AddForeignKey
+ALTER TABLE "public"."recipe_steps" ADD CONSTRAINT "recipe_steps_recipe_id_fkey" FOREIGN KEY ("recipe_id") REFERENCES "public"."recipes"("id") ON DELETE SET NULL ON UPDATE CASCADE;

backend/prisma/migrations/migration_lock.toml

@@ -0,0 +1,3 @@
+# Please do not edit this file manually
+# It should be added in your version-control system (e.g., Git)
+provider = "postgresql"

backend/prisma/schema.prisma

@@ -0,0 +1,53 @@
+datasource db {
+  provider = "postgresql"
+  url      = env("DATABASE_URL")
+}
+
+generator client {
+  provider = "prisma-client-js"
+}
+
+model recipes {
+  id                Int                  @id @default(autoincrement())
+  name              String               @unique(map: "recipes_name_unique") @db.VarChar(255)
+  cuisine           String               @db.VarChar(255)
+  created_at        DateTime             @default(now()) @db.Timestamptz(6)
+  updated_at        DateTime             @default(now()) @db.Timestamptz(6)
+  author            String?              @db.VarChar(255)
+  stars             Int?
+  prep_minutes      Int?
+  cook_minutes      Int?
+  recipeIngredients recipe_ingredients[]
+  recipeSteps       recipe_steps[]
+}
+
+model recipe_ingredients {
+  id            Int      @id @default(autoincrement())
+  recipe_id     Int
+  ingredient_id Int?
+  quantity      String?  @db.VarChar(255)
+  unit          String?  @db.VarChar(255)
+  notes         String?  @db.VarChar(255)
+  created_at    DateTime @default(now()) @db.Timestamptz(6)
+  updated_at    DateTime @default(now()) @db.Timestamptz(6)
+  raw           String?  @default("") @db.VarChar(255)
+  recipes       recipes? @relation(fields: [recipe_id], references: [id])
+  recipesId     Int?
+
+  @@index([ingredient_id], map: "recipe_ingredients_ingredient_id_index")
+  @@index([recipe_id], map: "recipe_ingredients_recipe_id_index")
+}
+
+model recipe_steps {
+  id          Int      @id @default(autoincrement())
+  recipe_id   Int?
+  step_number Int?
+  instruction String?  @db.VarChar(510)
+  created_at  DateTime @default(now()) @db.Timestamptz(6)
+  updated_at  DateTime @default(now()) @db.Timestamptz(6)
+  recipes     recipes? @relation(fields: [recipe_id], references: [id])
+  recipesId   Int?
+
+  @@unique([recipe_id, step_number], map: "recipe_steps_recipe_id_step_number_unique")
+  @@index([recipe_id], map: "recipe_steps_recipe_id_index")
+}

backend/src/controllers/recipeController.js

@@ -0,0 +1,89 @@
+const RecipeModel = require("../models/recipeModel");
+const model = new RecipeModel();
+
+exports.test = async (req, res) => {
+  console.log("test");
+  res.json({ env: process.env.NODE_ENV });
+};
+
+exports.getAllRecipes = async (req, res) => {
+  try {
+    const recipes = await model.getAllRecipes();
+    res.json(recipes);
+  } catch (error) {
+    res.status(500).json({
+      msg: "Failed to fetch all recipes",
+      source: "recipeController",
+      error: error.message,
+    });
+  }
+};
+
+exports.getRecipeById = async (req, res) => {
+  const id = parseInt(req.params.id, 10);
+  try {
+    const recipe = await model.findById(id);
+    if (recipe) {
+      res.json(recipe);
+    } else {
+      res.status(404).json({ msg: "Recipe not found" });
+    }
+  } catch (error) {
+    res.status(500).json({
+      msg: "Failed to fetch recipe",
+      source: "recipeController",
+      error: error.message,
+    });
+  }
+};
+
+exports.addRecipe = async (req, res) => {
+  if (process.env.NODE_ENV === "demo") {
+    return;
+  }
+  try {
+    const createdRecipe = await model.addRecipe(req.body);
+    res.status(201).json(createdRecipe);
+  } catch (error) {
+    res.status(500).json({
+      msg: "Failed to add recipe",
+      source: "recipeController",
+      error: error.message,
+    });
+  }
+};
+
+exports.setStars = async (req, res) => {
+  if (process.env.NODE_ENV === "demo") {
+    return;
+  }
+  const id = parseInt(req.body.id, 10);
+  const stars = parseInt(req.body.stars, 10);
+  try {
+    const createdRecipe = await model.setStars(id, stars);
+    res.status(202).json(createdRecipe);
+  } catch (error) {
+    res.status(500).json({
+      msg: "Failed to set stars",
+      source: "recipeController",
+      error: error.message,
+    });
+  }
+};
+
+exports.deleteRecipe = async (req, res) => {
+  if (process.env.NODE_ENV === "demo") {
+    return;
+  }
+  const id = parseInt(req.body.id, 10);
+  try {
+    await model.deleteRecipe(id);
+    res.json({ success: "true" });
+  } catch (error) {
+    res.status(500).json({
+      msg: "Failed to delete recipe",
+      source: "recipeController",
+      error: error.message,
+    });
+  }
+};

backend/src/index.js

@@ -0,0 +1,41 @@
+const express = require("express");
+const cors = require("cors");
+const { PrismaClient } = require("@prisma/client");
+const appRoutes = require("./routes/appRoutes");
+
+const app = express();
+const port = process.env.PORT || 3000;
+const prisma = new PrismaClient();
+
+function setupMiddleware(app) {
+  app.use(cors());
+  app.use(express.json());
+  app.use("/api", appRoutes);
+}
+
+setupMiddleware(app);
+
+// Start server
+async function startServer() {
+  try {
+    app.listen(port);
+    console.log(`Server is running on http://localhost:${port}`);
+  } catch (error) {
+    console.error("Error starting the server:", error);
+  }
+}
+
+process.on("SIGINT", async () => {
+  try {
+    await prisma.$disconnect();
+    console.log("Prisma client disconnected");
+    process.exit(0);
+  } catch (error) {
+    console.error("Error disconnecting Prisma client:", error);
+    process.exit(1);
+  }
+});
+
+startServer();
+
+module.exports = { app, prisma };

backend/src/models/recipeModel.js

@@ -0,0 +1,134 @@
+const { PrismaClient } = require("@prisma/client");
+const Logger = require("../utils/logger.js");
+const logger = new Logger();
+
+class recipeModel {
+  constructor() {
+    this.prisma = new PrismaClient();
+  }
+
+  async getAllRecipes() {
+    try {
+      return await this.prisma.recipes.findMany();
+    } catch (err) {
+      console.error("Error fetching all recipies:", err);
+      throw new Error(err.message);
+    }
+  }
+
+  async findById(id) {
+    try {
+      const recipe = await this.prisma.recipes.findUnique({
+        where: { id },
+        include: { recipeSteps: true, recipeIngredients: true },
+      });
+      if (!recipe) {
+        logger.warn(`recipe with id ${id} cannot be found`);
+        return null;
+      }
+      const data = {
+        details: {
+          id: recipe.id,
+          name: recipe.name,
+          author: recipe.author,
+          cuisine: recipe.cuisine,
+          stars: recipe.stars,
+          prep_minutes: recipe.prep_minutes,
+          cook_minutes: recipe.cook_minutes,
+        },
+        ingredients: recipe.recipeIngredients.map((ing) => ing.raw),
+        steps: recipe.recipeSteps.map((step, idx) => ({
+          step_idx: step.step_number,
+          instruction: step.instruction,
+        })),
+      };
+      return data;
+    } catch (err) {
+      console.log("Error finding recipe:", err);
+      logger.error("error finding recipe", err);
+      throw new Error(err.message);
+    }
+  }
+  async addRecipe(recipeData) {
+    const {
+      name,
+      author,
+      cuisine,
+      stars,
+      ingredients,
+      steps,
+      prep_minutes,
+      cook_minutes,
+    } = recipeData;
+    try {
+      const createdRecipe = await this.prisma.recipes.create({
+        data: {
+          name,
+          author,
+          cuisine,
+          prep_minutes,
+          cook_minutes,
+          stars,
+          recipeIngredients: {
+            create: ingredients.map((ing) => ({ raw: ing })),
+          },
+          recipeSteps: {
+            create: Object.keys(steps).map((stepNumber) => ({
+              step_number: parseInt(stepNumber),
+              instruction: steps[stepNumber],
+            })),
+          },
+        },
+      });
+
+      logger.info("new recipe created", {
+        id: createdRecipe.id,
+        name: createdRecipe.name,
+      });
+      return createdRecipe;
+    } catch (error) {
+      console.log(error);
+      logger.error("error creating recipe", err);
+      throw new Error("Failed to add recipe");
+    }
+  }
+
+  async setStars(id, stars) {
+    try {
+      await this.prisma.recipes.update({
+        where: { id },
+        data: { stars },
+      });
+      return { message: "stars updated" };
+    } catch (err) {
+      console.error("Error updating stars:", err);
+      logger.error("error setting stars", err);
+      throw new Error(err.message);
+    }
+  }
+
+  async deleteRecipe(id) {
+    try {
+      await this.prisma.recipe_ingredients.deleteMany({
+        where: { recipe_id: id },
+      });
+
+      await this.prisma.recipe_steps.deleteMany({
+        where: { recipe_id: id },
+      });
+      const deletedRecipe = await this.prisma.recipes.delete({
+        where: { id },
+      });
+      logger.info("recipe deleted", {
+        id: deletedRecipe.id,
+        name: deletedRecipe.name,
+      });
+      return { message: "Recipe deleted successfully" };
+    } catch (err) {
+      console.error("Error deleting recipe:", err);
+      logger.error("error deleting recipe", err);
+      throw new Error(err.message);
+    }
+  }
+}
+module.exports = recipeModel;

backend/src/routes/appRoutes.js

@@ -0,0 +1,18 @@
+const express = require("express");
+const recipeController = require("../controllers/recipeController");
+
+const router = express.Router();
+
+router.get("/test", recipeController.test);
+
+router.get("/recipes", recipeController.getAllRecipes);
+
+router.get("/recipe/:id", recipeController.getRecipeById);
+
+router.post("/add-recipe", recipeController.addRecipe);
+
+router.post("/set-stars", recipeController.setStars);
+
+router.delete("/delete-recipe", recipeController.deleteRecipe);
+
+module.exports = router;

backend/src/utils/logger.js

@@ -0,0 +1,33 @@
+const fs = require("fs");
+
+class Logger {
+  constructor(filePath) {
+    this.filePath = "/logs/app.log";
+  }
+
+  log(level, message, params) {
+    const logEntry = {
+      timestamp: new Date().toISOString(),
+      level: level,
+      message: message,
+      params: params,
+    };
+    fs.appendFile(this.filePath, JSON.stringify(logEntry) + "\n", (err) => {
+      if (err) throw err;
+    });
+  }
+
+  info(message, params = {}) {
+    this.log("info", message, params);
+  }
+
+  warn(message, params = {}) {
+    this.log("warn", message, params);
+  }
+
+  error(message, params = {}) {
+    this.log("error", message, params);
+  }
+}
+
+module.exports = Logger;

backend/tsconfig.json

@@ -0,0 +1,16 @@
+{
+  "compilerOptions": {
+    "target": "ES2020",
+    "module": "CommonJS",
+    "moduleResolution": "node",
+    "esModuleInterop": true,
+    "forceConsistentCasingInFileNames": true,
+    "strict": true,
+    "skipLibCheck": true,
+    "outDir": "dist"
+  },
+  "include": [
+    "src",
+    "scripts"
+  ]
+}

docker-compose.yaml

@@ -12,7 +12,7 @@ services:
     ports:
       - "${DB_PORT}:5432"
     volumes:
-      - ./postgres/db:/var/lib/postgresql/data
+      - ./db:/var/lib/postgresql/data
   backend:
     image: recipes_backend
     container_name: recipes_backend_${ID}
@@ -24,6 +24,7 @@ services:
       - "${BACKEND_PORT}:3000"
     volumes:
       - ./backend:/usr/src/app
+      - ./logs:/logs
     environment:
       - NODE_ENV=${NODE_ENV}
       - DB_USER=${DB_USER}
@@ -40,5 +41,6 @@ services:
       - "${FRONTEND_PORT}:80"
     volumes:
       - ./frontend:/usr/src/app
+      - "$FRONTEND_BUILD_DIR:/usr/src/app/dist"
     environment:
       - NODE_ENV=${NODE_ENV}

frontend/Dockerfile

@@ -10,5 +10,4 @@ COPY . .
 
 EXPOSE 80
 
-# CMD ["npm", "run", "$NODE_ENV"]
 CMD npm run $NODE_ENV

frontend/src/pages/RecipeIngredients.tsx

@@ -1,10 +1,8 @@
 import { getRecipeIngredients } from "../services/frontendApi.js";
 import { useState, useEffect } from "react";
-import { type Ingredient } from "../types/Recipe.ts"
 
 function RecipeIngredients() {
-
+  const [recipeIngredients, setRecipeIngredients] = useState<string[]>([]);
-  const [recipeIngredients, setRecipeIngredients] = useState<Ingredient[]>([]);
   const [error, setError] = useState<string | null>(null);
   const [loading, setLoading] = useState(true);
 
@@ -13,36 +11,32 @@ function RecipeIngredients() {
       try {
         const recipeIngredients = await getRecipeIngredients();
         setRecipeIngredients(recipeIngredients);
-        console.log(recipeIngredients)
+        console.log(recipeIngredients);
       } catch (err) {
         console.log(err);
         setError("Failed to load recipe ingredients...");
-        console.log(error)
+        console.log(error);
       } finally {
         setLoading(false);
       }
     };
     loadRecipeIngredients();
   }, []);
-  console.log(recipeIngredients)
+  console.log(recipeIngredients);
   return (
-    // should this be a string[]? only if we are only returning raw. otherwise i will need to type and return the ingredient object. This template shoudl work for steps though, so maybe setting that up is a good first step
+    <div className="page-outer">
-    <div className='page-outer'>
       {loading ? (
         <div className="loading">Loading...</div>
       ) : (
         <div className="recipe-outer bg-amber-100 p-4 md:p-8 lg:p-12">
           <div className="recipes-grid grid grid-cols-1 md:grid-cols-2 gap-6 lg:gap-8">
-            {recipeIngredients.map(ing => (
+            {recipeIngredients.map((ing, idx) => (
-              <li key={ing.id}>
+              <li key={idx}>{ing}</li>
-                {ing.raw}
-              </li>
             ))}
           </div>
         </div>
       )}
     </div>
-  )
+  );
-
 }
-export default RecipeIngredients
+export default RecipeIngredients;

frontend/src/pages/RecipePage.tsx

@@ -1,17 +1,21 @@
 import { useParams, useNavigate, Link } from "react-router-dom";
 import { useState, useEffect } from "react";
-import { getRecipeById, deleteRecipe, setDBStars } from "../services/frontendApi.js";
+import {
-import { type Recipe, type Ingredient } from "../types/Recipe"
+  getRecipeById,
-import Modal from '../components/Modal.tsx'
+  deleteRecipe,
-import DemoModal from '../components/DemoModal.tsx'
+  setDBStars,
-import StarRating from "../components/StarRating.tsx"
+} from "../services/frontendApi.js";
-import TimeDisplay from '../components/TimeDisplay.tsx'
+import { type Recipe } from "../types/Recipe";
+import Modal from "../components/Modal.tsx";
+import DemoModal from "../components/DemoModal.tsx";
+import StarRating from "../components/StarRating.tsx";
+import TimeDisplay from "../components/TimeDisplay.tsx";
 
 function RecipePage() {
   const [recipe, setRecipe] = useState<Recipe>({
     details: {},
     ingredients: [],
-    steps: []
+    steps: [],
   });
   const [error, setError] = useState<string | null>(null);
   const [loading, setLoading] = useState(true);
@@ -20,16 +24,21 @@ function RecipePage() {
   const [showConfirmModal, setShowConfirmModal] = useState(false);
   const [showDemoModal, setShowDemoModal] = useState(false);
   const { id } = useParams();
-  const isWebSource = recipe && recipe.details && recipe.details.author
+  const isWebSource =
+    recipe && recipe.details && recipe.details.author
       ? /http|com/.test(recipe.details.author) //etc
       : false;
   const navigate = useNavigate();
 
-  const openModal = () => { setShowConfirmModal(true) };
+  const openModal = () => {
-  const closeModal = () => { setShowConfirmModal(false) };
+    setShowConfirmModal(true);
+  };
+  const closeModal = () => {
+    setShowConfirmModal(false);
+  };
 
   const confirmDelete = () => {
-    if (process.env.NODE_ENV === 'demo') {
+    if (process.env.NODE_ENV === "demo") {
       closeModal();
       setShowDemoModal(true);
     } else {
@@ -43,13 +52,13 @@ function RecipePage() {
       try {
         const recipe = await getRecipeById(id);
         if (!recipe.details) {
-          setError("Sorry, this recipe no longer exists")
+          setError("Sorry, this recipe no longer exists");
         } else {
           setRecipe(recipe);
-          setStars(recipe.details?.stars ?? 0)
+          setStars(recipe.details?.stars ?? 0);
           setInitialStars(recipe.details?.stars ?? 0);
-          if (process.env.NODE_ENV === 'dev') {
+          if (process.env.NODE_ENV === "dev") {
-            console.log(recipe)
+            console.log(recipe);
           }
         }
       } catch (error) {
@@ -77,38 +86,56 @@ function RecipePage() {
   const handleDelete = async (id: number | void) => {
     try {
       await deleteRecipe(id);
-      navigate('/')
+      navigate("/");
     } catch (error) {
       console.error("Error deleting recipe:", error);
     }
   };
   return (
     <div className="recipe page-outer">
-
-
       {loading ? (
         <div className="loading">Loading...</div>
       ) : error ? (
         <div>
           <div className="error-message text-lg">{error}</div>
           <div className="m-2">
-            <Link to="/" className="ar-button bg-amber-600 text-white py-2 px-4 rounded hover:bg-amber-700">
+            <Link
+              to="/"
+              className="ar-button bg-amber-600 text-white py-2 px-4 rounded hover:bg-amber-700"
+            >
               Return to Cookbook
             </Link>
           </div>
         </div>
       ) : (
-
         <div className="border-b-2 border-amber-300 pb-4">
           <div className="recipe-card">
             <div className="flex relative justify-between">
-              <button onClick={() => { }} className="invisible ar-button py-1 px-1 rounded self-start">🗑️</button>
+              <button
-              <h3 className="text-center max-w-lg px-4 text-2xl lg:text-3xl font-bold text-amber-900">{recipe.details.name}</h3>
+                onClick={() => {}}
-              <button onClick={openModal} className="ar-button bg-amber-500 text-white py-1 px-1 rounded hover:bg-amber-600 self-start">🗑️</button>
+                className="invisible ar-button py-1 px-1 rounded self-start"
+              >
+                🗑️
+              </button>
+              <h3 className="text-center max-w-lg px-4 text-2xl lg:text-3xl font-bold text-amber-900">
+                {recipe.details.name}
+              </h3>
+              <button
+                onClick={openModal}
+                className="ar-button bg-amber-500 text-white py-1 px-1 rounded hover:bg-amber-600 self-start"
+              >
+                🗑️
+              </button>
             </div>
             <div className="mt-1">
-              <p className="text-amber-700 italic text-lg">{recipe.details.cuisine}</p>
+              <p className="text-amber-700 italic text-lg">
-              <p>prep: <TimeDisplay minutes={recipe.details.prep_minutes ?? 0} /> | cook: <TimeDisplay minutes={recipe.details.cook_minutes ?? 0} /></p>
+                {recipe.details.cuisine}
+              </p>
+              <p>
+                prep: <TimeDisplay minutes={recipe.details.prep_minutes ?? 0} />{" "}
+                | cook:{" "}
+                <TimeDisplay minutes={recipe.details.cook_minutes ?? 0} />
+              </p>
             </div>
           </div>
 
@@ -118,10 +145,10 @@ function RecipePage() {
                 Ingredients:
               </h4>
               <ul className="space-y-2">
-                {recipe.ingredients.map((ingredient: Ingredient, index) => (
+                {recipe.ingredients.map((ingredient: string, index) => (
                   <li key={index} className="text-gray-700 flex items-start">
                     <span className="w-1.5 h-1.5 bg-amber-400 rounded-full mt-2 mr-3 flex-shrink-0"></span>
-                    <span className="font-medium text-left">{ingredient.raw}</span>
+                    <span className="font-medium text-left">{ingredient}</span>
                   </li>
                 ))}
               </ul>
@@ -132,12 +159,18 @@ function RecipePage() {
                 Instructions:
               </h4>
               <ol className="space-y-3">
-                {recipe.steps && Object.keys(recipe.steps || {}).map((stepNumber) => (
+                {recipe.steps &&
-                  <li key={stepNumber} className="text-gray-700 flex items-start">
+                  Object.keys(recipe.steps || {}).map((stepNumber) => (
+                    <li
+                      key={stepNumber}
+                      className="text-gray-700 flex items-start"
+                    >
                       <span className="bg-amber-500 text-white rounded-full w-6 h-6 flex items-center justify-center text-sm font-bold mr-3 mt-0.5 flex-shrink-0">
                         {recipe.steps[parseInt(stepNumber)].step_number}
                       </span>
-                    <span className="leading-relaxed text-left">{recipe.steps[parseInt(stepNumber)].instruction}</span>
+                      <span className="leading-relaxed text-left">
+                        {recipe.steps[parseInt(stepNumber)].instruction}
+                      </span>
                     </li>
                   ))}
               </ol>
@@ -152,13 +185,15 @@ function RecipePage() {
                 <span>From the kitchen of {recipe.details.author}</span>
               )}
               <span>
-                <StarRating rating={stars} onRatingChange={(newRating: number) => setStars(newRating)} />
+                <StarRating
+                  rating={stars}
+                  onRatingChange={(newRating: number) => setStars(newRating)}
+                />
               </span>
             </div>
           </div>
         </div>
-      )
+      )}
-      }
       <Modal
         isOpen={showConfirmModal}
         onClose={closeModal}

frontend/src/services/frontendApi.js

@@ -1,27 +1,27 @@
-const baseUrl = process.env.NODE_ENV !== 'dev'
+const baseUrl =
-  ? '/'
+  process.env.NODE_ENV !== "dev" ? "/api" : "http://localhost:3000/api";
-  : 'http://localhost:3000/';
 
 export const getRecipes = async () => {
-  const response = await fetch(`${baseUrl}backend/recipes`);
+  console.log(`${baseUrl}/recipes`);
+  const response = await fetch(`${baseUrl}/recipes`);
   const data = await response.json();
   return data;
 };
 
 export const getRecipeSteps = async () => {
-  const response = await fetch(`${baseUrl}backend/recipe-steps`);
+  const response = await fetch(`${baseUrl}/recipe-steps`);
   const data = await response.json();
   return data;
 };
 
 export const getRecipeIngredients = async () => {
-  const response = await fetch(`${baseUrl}backend/recipe-ingredients`);
+  const response = await fetch(`${baseUrl}/recipe-ingredients`);
   const data = await response.json();
   return data;
 };
 
 export const getRecipeById = async (id) => {
-  const response = await fetch(`${baseUrl}backend/recipe/${id}`);
+  const response = await fetch(`${baseUrl}/recipe/${id}`);
   const data = await response.json();
   if (!data || !data.details) {
     return { details: null };
@@ -32,7 +32,7 @@ export const getRecipeById = async (id) => {
 export const addRecipe = async (recipeData) => {
   console.log(JSON.stringify(recipeData));
   // return
-  const response = await fetch(`${baseUrl}backend/add-recipe`, {
+  const response = await fetch(`${baseUrl}/add-recipe`, {
     method: "POST",
     headers: { "Content-Type": "application/json" },
     body: JSON.stringify(recipeData),
@@ -45,7 +45,7 @@ export const addRecipe = async (recipeData) => {
 export const setDBStars = async (id, stars) => {
   console.log(JSON.stringify({ id: id, stars: stars }));
   // return
-  const response = await fetch(`${baseUrl}backend/set-stars`, {
+  const response = await fetch(`${baseUrl}/set-stars`, {
     method: "POST",
     headers: { "Content-Type": "application/json" },
     body: JSON.stringify({ id: id, stars: stars }),
@@ -58,7 +58,7 @@ export const setDBStars = async (id, stars) => {
 export const deleteRecipe = async (id) => {
   console.log(id);
   // return
-  const response = await fetch(`${baseUrl}backend/delete-recipe`, {
+  const response = await fetch(`${baseUrl}/delete-recipe`, {
     method: "DELETE",
     headers: { "Content-Type": "application/json" },
     body: JSON.stringify({ id }),

frontend/src/types/Recipe.ts

@@ -4,13 +4,6 @@ interface Step {
   instruction: string;
 }
 
-interface Ingredient {
-  id?: number;
-  name?: string;
-  quantity?: number;
-  unit?: string;
-  raw?: string;
-}
 interface Recipe {
   details: {
     id?: number;
@@ -20,8 +13,8 @@ interface Recipe {
     cuisine?: string;
     prep_minutes?: number;
     cook_minutes?: number;
-  },
+  };
-  ingredients: Ingredient[],
+  ingredients: string[];
   steps: Step[];
 }
 // smaller Recipe type returned by backend at /recipes for all
@@ -34,5 +27,4 @@ interface RecipeSmall {
   prep_minutes: number;
 }
 
-
+export type { Recipe, Step, RecipeSmall };
-export type { Recipe, Ingredient, Step, RecipeSmall }

postgres/docker-compose.yaml

@@ -1,15 +0,0 @@
-services:
-  db:
-    container_name: recipe_postgres
-    image: docker.io/library/postgres:17
-    restart: always
-    env_file:
-      - .env
-    environment:
-      - POSTGRES_USER=${DB_USER}
-      - POSTGRES_PASSWORD=${DB_PASSWORD}
-      - POSTGRES_DB=${DB_NAME}
-    ports:
-      - "5432:5432"
-    volumes:
-      - ./db:/var/lib/postgresql/data