feat: add error handling exercises with try/catch implementation

- Introduced new exercises focused on throwing and catching errors, including practical examples in TypeScript.
- Enhanced README files to explain error handling concepts and provide clear instructions for learners.
- Created corresponding solution and test files to validate the implementation of error handling logic.
- Updated the FINISHED.mdx to summarize the new concepts learned in error handling.

Author: kentcdodds

exercises/04.control-flow/06.problem.throwing-and-catching/README.mdx

@@ -0,0 +1,32 @@
+# Throwing and Catching Errors
+
+👨‍💼 We need to convert user input into a number. If the input is invalid, we
+should throw an error and handle it gracefully so the program can keep running.
+
+Sometimes the best control flow is to stop execution and report a problem:
+
+```ts
+function riskyWork() {
+	throw new Error('Something went wrong')
+}
+
+try {
+	riskyWork()
+} catch (error) {
+	console.error('Caught an error:', error)
+}
+```
+
+🐨 Open <InlineFile file="index.ts" /> and:
+
+1. Throw an error in `parseNumber` when the input isn't a valid number
+2. Wrap the call to `parseNumber(rawInput)` in a `try`/`catch`
+3. Set `resultMessage` to show either the parsed value or the error message
+
+<callout-info>
+	In a `catch` block, the `error` value is `unknown`. Use
+	`error instanceof Error` before reading `error.message`.
+</callout-info>
+
+📜 [MDN - throw](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/throw)
+📜 [MDN - try...catch](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/try...catch)

exercises/04.control-flow/06.problem.throwing-and-catching/index.ts

@@ -0,0 +1,27 @@
+// Throwing and Catching Errors
+// Errors interrupt normal control flow, but try/catch lets you recover
+
+const rawInput = 'not-a-number'
+
+function parseNumber(value: string) {
+	const parsed = Number(value)
+
+	if (Number.isNaN(parsed)) {
+		// 🐨 Throw a new Error with message `Invalid number: ${value}`
+		// 💰 throw new Error(`Invalid number: ${value}`)
+	}
+
+	return parsed
+}
+
+let resultMessage = ''
+
+// 🐨 Use a try/catch block to call parseNumber(rawInput)
+// - If it succeeds, set resultMessage to `Parsed value: ${parsed}`
+// - If it throws, set resultMessage to `Error: ${message}`
+// 💰 In the catch, check `error instanceof Error` before using `error.message`
+
+// console.log(resultMessage)
+
+// 🐨 Export parseNumber and resultMessage so we can verify your work
+// export { parseNumber, resultMessage }

exercises/04.control-flow/06.problem.throwing-and-catching/package.json

@@ -0,0 +1,10 @@
+{
+  "name": "exercises_04.control-flow_06.problem.throwing-and-catching",
+  "type": "module",
+  "scripts": {
+    "start": "npx @kentcdodds/log-module ./index.ts",
+    "start:watch": "npx @kentcdodds/log-module --watch ./index.ts",
+    "test": "node --test index.test.ts",
+    "test:watch": "node --watch --test index.test.ts"
+  }
+}

exercises/04.control-flow/06.solution.throwing-and-catching/README.mdx

@@ -0,0 +1,7 @@
+# Throwing and Catching Errors
+
+👨‍💼 Nice work! You made invalid input throw an error and used `try`/`catch` to
+recover with a helpful message.
+
+When you throw, you immediately exit the current flow. `catch` gives you a
+safe place to decide what happens next.

exercises/04.control-flow/06.solution.throwing-and-catching/index.test.ts

@@ -0,0 +1,40 @@
+import assert from 'node:assert/strict'
+import { test } from 'node:test'
+import * as solution from './index.ts'
+
+await test('parseNumber is exported', () => {
+	assert.ok('parseNumber' in solution, '🚨 Make sure you export "parseNumber"')
+})
+
+await test('parseNumber returns a number for valid input', () => {
+	assert.strictEqual(
+		solution.parseNumber('42'),
+		42,
+		'🚨 parseNumber should return 42 when given "42"',
+	)
+})
+
+await test('parseNumber throws for invalid input', () => {
+	assert.throws(
+		() => solution.parseNumber('not-a-number'),
+		{
+			message: 'Invalid number: not-a-number',
+		},
+		'🚨 parseNumber should throw an Error for invalid input',
+	)
+})
+
+await test('resultMessage is exported', () => {
+	assert.ok(
+		'resultMessage' in solution,
+		'🚨 Make sure you export "resultMessage"',
+	)
+})
+
+await test('resultMessage should show the error message', () => {
+	assert.strictEqual(
+		solution.resultMessage,
+		'Error: Invalid number: not-a-number',
+		'🚨 resultMessage should include the thrown error message',
+	)
+})

exercises/04.control-flow/06.solution.throwing-and-catching/index.ts

@@ -0,0 +1,31 @@
+// Throwing and Catching Errors
+// Errors interrupt normal control flow, but try/catch lets you recover
+
+const rawInput = 'not-a-number'
+
+function parseNumber(value: string) {
+	const parsed = Number(value)
+
+	if (Number.isNaN(parsed)) {
+		throw new Error(`Invalid number: ${value}`)
+	}
+
+	return parsed
+}
+
+let resultMessage = ''
+
+try {
+	const parsed = parseNumber(rawInput)
+	resultMessage = `Parsed value: ${parsed}`
+} catch (error) {
+	if (error instanceof Error) {
+		resultMessage = `Error: ${error.message}`
+	} else {
+		resultMessage = 'Error: Unknown error'
+	}
+}
+
+console.log(resultMessage)
+
+export { parseNumber, resultMessage }

exercises/04.control-flow/06.solution.throwing-and-catching/package.json

@@ -0,0 +1,10 @@
+{
+  "name": "exercises_04.control-flow_06.solution.throwing-and-catching",
+  "type": "module",
+  "scripts": {
+    "start": "npx @kentcdodds/log-module ./index.ts",
+    "start:watch": "npx @kentcdodds/log-module --watch ./index.ts",
+    "test": "node --test index.test.ts",
+    "test:watch": "node --watch --test index.test.ts"
+  }
+}

exercises/04.control-flow/FINISHED.mdx

@@ -9,5 +9,6 @@ You learned:
 - 🔁 **`for` loops** for counted repetition
 - 🔄 **`while` loops** for conditional repetition
 - ❓ **Ternary operator** for concise value selection
+- 🧯 **`try`/`catch`** for handling errors
 
 Next up: Functions—packaging up reusable logic with type-safe contracts!

exercises/04.control-flow/README.mdx

@@ -115,6 +115,19 @@ const status = age >= 18 ? 'adult' : 'minor'
 
 It has three parts: condition, value if true, value if false.
 
+## Error Handling
+
+Sometimes code needs to stop early when something goes wrong. You can **throw**
+an error to interrupt normal flow, and **catch** it to recover:
+
+```ts
+try {
+	riskyWork()
+} catch (error) {
+	console.error(error)
+}
+```
+
 <callout-info>
 	TypeScript's type narrowing works inside conditionals. When you check a type,
 	TypeScript knows the more specific type inside that block.

instructor/01-workshop-overview.md

@@ -0,0 +1,147 @@
+# Epic Workshop Overview
+
+## What is an Epic Workshop?
+
+An Epic Workshop is a hands-on, interactive learning experience where students learn by writing code. The Epic Workshop App provides the infrastructure to run these workshops locally, presenting exercises with problems to solve and solutions to compare against.
+
+## Core Terminology
+
+Understanding these terms is essential:
+
+### Workshop
+The entire learning experience. A workshop has a title, subtitle, and contains multiple exercises. Example: "React Fundamentals" or "Mocking Techniques in Vitest"
+
+### Exercise
+A major learning topic within a workshop. Each exercise has:
+- An introduction (`README.mdx`) explaining the concept
+- Multiple steps (problem/solution pairs)
+- A summary (`FINISHED.mdx`)
+
+Example exercises: "Hello World in JS", "Functions", "Form Validation"
+
+### Step
+A focused, atomic task within an exercise. Each step has:
+- A **Problem**: The starting state where students implement something
+- A **Solution**: The expected final state students should arrive at
+
+### Problem
+The initial code state. Contains:
+- Starter code with TODO comments and emoji markers
+- A `README.mdx` with instructions
+- All necessary configuration files
+
+### Solution
+The completed code state. Contains:
+- Fully implemented code
+- A `README.mdx` explaining the solution
+- Often includes tests to verify the solution
+
+### Playground
+A sandbox area where learners can experiment. When they click "Set to Playground" in the UI, the app copies the contents of any exercise step to the playground.
+
+### Example
+Standalone, runnable code samples in the `examples/` directory that demonstrate concepts without being exercises.
+
+## Workshop Structure Hierarchy
+
+```
+Workshop
+├── exercises/
+│   ├── README.mdx (Workshop Intro)
+│   ├── 01.exercise-name/
+│   │   ├── README.mdx (Exercise Intro)
+│   │   ├── 01.problem.step-name/
+│   │   │   ├── README.mdx (Problem Instructions)
+│   │   │   └── [code files]
+│   │   ├── 01.solution.step-name/
+│   │   │   ├── README.mdx (Solution Explanation)
+│   │   │   └── [code files]
+│   │   ├── 02.problem.next-step/
+│   │   ├── 02.solution.next-step/
+│   │   └── FINISHED.mdx (Exercise Summary)
+│   ├── 02.next-exercise/
+│   └── FINISHED.mdx (Workshop Wrap-up)
+├── examples/
+├── playground/
+└── package.json
+```
+
+## App Types
+
+Epic Workshops support two types of apps:
+
+### Simple Apps
+No `package.json` with a `dev` script. The workshop app serves files directly.
+
+**Use for:**
+- HTML/CSS/JS exercises
+- Single-file React exercises
+- Quick demonstrations
+
+**Files:**
+- `index.tsx` or `index.html` (required)
+- `index.css` (optional, auto-included)
+- `api.server.ts` (optional, for server-side logic)
+
+### Project Apps
+Has a `package.json` with a `dev` script. Runs as a separate server.
+
+**Use for:**
+- Full applications (Remix, Vite, etc.)
+- Exercises requiring build tools
+- Complex multi-file projects
+
+**Requirements:**
+- `package.json` with `"scripts": { "dev": "..." }`
+- Dev server must use the `PORT` environment variable
+
+## Learning Flow
+
+The typical learner experience:
+
+1. **Read the Exercise Intro** - Understand the concept being taught
+2. **Read the Problem Instructions** - Understand what to implement
+3. **Implement the Solution** - Write code in the problem directory
+4. **Compare with Solution** - Use the diff tab to see differences
+5. **Run Tests** (if available) - Verify the implementation
+6. **Read the Summary** - Reflect on what was learned
+7. **Move to Next Step** - Continue the learning journey
+
+## Key Design Principles
+
+### 1. Incremental Complexity
+Start with the simplest possible example and build complexity gradually. Each step should introduce ONE new concept.
+
+### 2. Problem-Solution Pairs
+Every problem must have a corresponding solution. The solution should be the minimal change needed from the problem to complete the task.
+
+### 3. Clear Instructions
+Use emoji characters to guide learners:
+- 👨‍💼 Peter the Product Manager - Context and requirements
+- 🐨 Kody the Koala - Specific instructions
+- 🧝‍♀️ Kellie the Co-worker - Pre-done work context
+- 🦺 Lily the Life Jacket - TypeScript guidance
+- 💰 Marty the Money Bag - Tips and hints
+- 📜 Dominic the Document - Documentation links
+- 📝 Nancy the Notepad - Note-taking prompts
+- 🦉 Olivia the Owl - Best practices
+- 💣 Barry the Bomb - Code to delete
+- 🚨 Alfred the Alert - Test failure help
+
+### 4. Real-World Relevance
+Exercises should mirror actual development tasks. Use realistic examples, not contrived scenarios.
+
+### 5. Self-Contained Steps
+Each step should be completable independently. Don't require knowledge from later steps to complete earlier ones.
+
+## What Makes a Great Workshop
+
+Based on analysis of successful Epic Workshops:
+
+1. **Clear Learning Objectives** - Each exercise has a specific goal
+2. **Appropriate Scope** - 6-10 exercises, 2-6 steps per exercise
+3. **Consistent Difficulty Progression** - Gets harder gradually
+4. **Rich Context** - Explains "why" not just "what"
+5. **Quality Code** - Production-grade patterns and practices
+6. **Helpful Diffs** - Problem and solution differ meaningfully but not overwhelmingly
+7. **Engaging Content** - Uses emoji characters, videos, and callouts effectively