Create Recipe Schema Markup for Rich Search Results Generate Schema.org Recipe JSON-LD with ingredients, steps, nutrition, and cook time.

The Recipe Schema Generator tool works under the hood by utilizing React for building its user interface and managing state changes. It uses the `useState` hook from React to store values of various form fields such as recipe name, description, image URL, author name, preparation time, cooking time, total time, servings, category, cuisine, calories, ingredients, instructions, rating value, review count, and keywords. The tool then processes these stored values through a series of conditional statements in the `generateSchema` function to construct a schema object that adheres to Google's recipe rich results requirements.

The `toISO` function is used to convert preparation, cooking, and total times from minutes to ISO 8601 duration format, which is required by Google for recipe rich results. For instance, if the user inputs 30 minutes for preparation time, this function converts it into PT30M. The tool also uses JavaScript's built-in `JSON.stringify` method to convert the schema object into a JSON-LD string with indentation for better readability.

The ingredients and instructions are processed using array methods like `split`, `filter`, and `map`. Ingredients are split by newline characters, filtered to remove empty lines, and then included in the schema as an array of strings. Instructions are mapped over to create HowToStep objects with a text property, which is required by Google for recipe rich results. The tool also checks if rating value and review count are provided, and if so, it creates an AggregateRating object to include in the schema.

When the user clicks the "Copy with Script Tag" button, the `handleCopy` function uses the `copyToClipboard` utility from the `@/lib/utils` module to copy the generated JSON-LD string wrapped in a script tag to the clipboard. This allows users to easily paste the schema into their website's HTML code, enabling Google to parse and display rich recipe results. The tool's output is formatted according to Google's requirements for recipe schema, which includes properties like name, image, author, description, prepTime, cookTime, recipeYield, recipeCategory, recipeCuisine, nutrition, and aggregateRating.