404 error fixes.txt

Image error 404: In the models file with the routes (recipes.js) we use express.static, the built-in middleware function to serve static files. It had the path ../public, which means any files we refer to in our code must be in public and have a relative path to public. In new.ejs and index.ejs, we want to find the images for each recipe, so we use recipe-01.jpg and img/recipe-01.jpg in our img src="" for those respective files. We treat the path in express.static() as our root and link the necessary images.
If you get a 404 error, that means the file path is wrong, although it might look right from your point of view. For example, if the image, test.jpg, is on the same level as the file linking it, you would assume that <img src="test.jpg" alt = "test"> would suffice, but not if test.jpg is not in the folder referenced in express.static. It must be in that folder and also have a correct path. For example, if public is our folder, and we have an img and code folder inside, you might think of doing something like "../img/image.jpg" for an .ejs file inside the code folder. You are backing out of code, going into img, and getting image.jpg. If you have router.use(express.static(__dirname + '/public'));, the correct way is "img/image.jpg", which clearly gives .../public/img/image.jpg. We would have done ".../public/../img/image.jpg", an error.