codex-lv3-may-2025

Level Navigation: 1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19⚡

20

Level 5: Create Button and Handler (Console Log)

Goal: Add a fetch meals function with console logging.

User Story: As a developer, I want to create a button handler so that I can test the connection to my database.

---

What You’ll Do

Add the fetch meals function with console logging and connect it to your button.

Instructions

• Create an async function handleFetchMeals() that logs “Fetching meals…” to console
• Add a comment indicating we’ll add the actual fetch logic in the next step
• Update the button to call the function with onClick={handleFetchMeals}

💡 Code Hints

Need help with the button handler? Check out these snippets:

Show Me: fetch function

async function handleFetchMeals() {
    console.log("Fetching meals...")
    // We'll add the actual fetch logic in the next step
}

Show Me: button with onClick

<button onClick={handleFetchMeals}>Fetch Meals</button>

✅ Check

1. Click the “Fetch Meals” button
2. Check the browser console - you should see “Fetching meals…”
3. No JavaScript errors occur
4. The button responds to clicks
5. Console logging is working correctly

---

---