CodingTextIntermediate

Recipe Finder Application

A recipe finder app built with HTML5, CSS3, JavaScript, and a food API, featuring an attractive interface, advanced search, ratings, nutrition info, and more.

Prompt Content

Copy and paste directly into your model or internal evaluation tool.

Create a recipe finder application using HTML5, CSS3, JavaScript and a food API. Build a visually appealing interface with food photography and intuitive navigation. Implement advanced search with filtering by ingredients, cuisine, diet restrictions, and preparation time. Add user ratings and reviews with star system. Include detailed nutritional information with visual indicators for calories, macros, and allergens. Support recipe saving and categorization into collections. Implement a meal planning calendar with drag-and-drop functionality. Add automatic serving size adjustment with quantity recalculation. Include cooking mode with step-by-step instructions and timers. Support offline access to saved recipes. Add social sharing functionality for favorite recipes.

Use Cases

Users can find recipes via a food APIFilter by ingredientscuisinedietand prep timeView nutrition details and cooking steps

Reference Output

A fully functional recipe finder web app with an attractive interface, search, filters, ratings, nutrition, saving, meal planning, cooking mode, offline access, and social sharing.

Scoring Rubric

Scoring: Feature completeness (40%): check all listed features. Usability (30%): intuitive UI and navigation. Visual design (20%): aesthetics and responsive layout. Code quality (10%): syntax correctness and maintainability.