Codelab: Recipe Book Page
Build a real recipe book page from scratch — define recipe data with objects and arrays, then render it to the browser using JavaScript.
Step 1 of 7
In this codelab, you'll build a recipe book page that renders data from JavaScript to the browser!
So far in this module, you've worked with data in the console. In this codelab, you'll take the next step: storing recipe data as JavaScript objects and arrays, then using code to create HTML elements and display them on a real web page.
By the end, you'll have a styled recipe book page with multiple recipes — each showing its name, cook time, and ingredients list. This is the exact same pattern that real web applications use to display dynamic data.
Learn more on MDN