A1: Detail Specification
The recipe website will open with index.php and will show a menu bar with two links “All recipes” and “Add a new recipe”. The “All recipes” page will function as a homepage and will also show the content of index.php.
“Add a new recipe” (add-recipe.php) page will show a form that will allow entering a new recipe. The page should be structured exactly as this page http://tastykitchen.com/recipes/edit- recipe/ (Links to an external site.)Links to an external site. (you need to sign in as a member to access the page). You will make the following modifications to the page:
- category: show at least 5 different categories
- servings: use radio buttons instead, use values 1, 2, 3, 4, 5, 6+
- quantity: use a textfield, but you need to check that the value entered is always a number,
such as 0.5 or 2.5
- units: use few common units, such as pound(s), gram(s), ounce(s), pcs, ml, tbl spoon,
teaspoon, cup
- instead of being able to add ingredients one by one, provide 10 entry rows. Note: The +
button on tasty kitchen website uses Javascript – we did not cover that so far. Instead, show 10 rows and have one submit button at the end of the form that will submit ALL the fields to the server at the same time. The most sensible way to do 10 rows is to populate such section via the for loop, which will allow you have the number of rows as a global constant that you can change to whatever value you see fit (e.g. 10). remember you need to generate the names of the fields as well and then process them on the PHP side.
- tags: add all tags into the single textfield
- ignore uploading the photo part
“Processing entry page” (process-recipe.php) is an intermediary page shown after successful entry. To process the form entry, you need to properly validate each entry, i.e. that the information was entered, it is of expected kind and the values are from the expected range. After you have validated the entry, you will store the recipe in the flat text file, one recipe per line. For this, you will need to encode the entered values. Each recipe should be given an identifier. After the successful entry, you will display the page that says the recipe was stored successfully and you will provide the link to view the entered recipe, see details page specification below for the requirement how to show the recipe link.If an error occurs, e.g. wrong information was entered, or there was a missing information, you need to redirect the processing to add-recipe.php, display the form again with prefilling the values that were entered before. You need to display the error message as well.
“All recipes” (index.php) shows the list of recipes stored in the text file. Each list item will show the name of the recipe, prep time, cook time, and level. The item will be made into the hyperlink that will link to the third page “Recipe Details”.
To generate the list, you need to read the file with stored recipes, compose the list item text from parts of the stored information, generate the hyperlink to the recipe details page and add id as a parameter to the link. If there are no recipes stored in the file, the page will show text “No recipes available.”
“Recipe details” (details.php) will show information about one recipe, that which id is provided as a parameter. The page displays the information that is nicely formatted using html table tag. Again, look at how tasty kitchen website shows individual recipes (click on any existing recipes). Take it as an inspiration, you can format your details page as you wish. You do not need to have any other links/information beyond what you entered when you created the recipe. Remember that you need to handle the case where id submitted is not the valid one.
Other requirements:
- You need to use include/require command for header and footer
- You need to create a css style file that will contain styles used by your page
- All the assets you will use (images, helper files) need to be placed in a separate directory.
- The text file with recipes must be placed into a separate directory called recipes.