codex-lv2-may-2025

Level Navigation: 1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

Current Level: 16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34

---

Level 16: Error Handling (Optional Challenge)

What You’ll Do

Add proper error handling to your API calls.

Instructions

• Use .catch() to handle network errors (connection issues, timeouts)
• Use if(response.ok === false) { console.log('API Error: ' + response.status + ' ' + response.statusText) } to handle API errors (404, 500, etc.)
• Display user-friendly error messages to your users (not just console logs)
• Test your error handling by temporarily breaking the API URL:
  • Change https:// to thtps:// (typo in protocol)
  • Add extra characters to the URL like &latitude=500 (There is not latitude 500, latitude goes from -90 to 90.)
  • Put a typo in the endpoint path, for example: change /v1/forecast to /v1/forecst (missing ‘a’)
  • Remember to fix the URL back to working state when done testing

💡 Code Hints

Need help with error handling? Check out these snippets:

• Error handling: See SNIPPETS.md for .catch() examples
• User messages: Use setText() to show error messages to users

✅ Check

1. Open your webpage in a browser
2. Click the button to trigger your API call
3. You should see the API response in the output area
4. Temporarily break your API URL (add “x” to the end)
5. Click the button again - you should see a user-friendly error message
6. Fix the API URL and test again - it should work normally

---

---

---

Level Navigation: 1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

Current Level: 16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34