Added exercises to everything

Author: mattpocock

book-content/chapters/02-ide-superpowers.md

@@ -576,4 +576,4 @@ function getRandomPercentage() {
 }
 ```
 
-These are just some of the options provided by the Quick Fix menu. There's so much you can achieve with them, and we're only scratching the surface. Keep exploring and experimenting to discover their full potential!
+These are just some of the options provided by the Quick Fix menu. There's so much you can achieve with them, and we're only scratching the surface. Keep exploring and experimenting to discover their full potential!

book-content/chapters/05-unions-literals-and-narrowing.md

@@ -1462,6 +1462,11 @@ However, TypeScript is showing us errors below `'radius'` and `'sideLength'`.
 
 Your task is to update the implementation of the `calculateArea` function so that destructuring properties from the passed in `Shape` works without errors. Hint: the examples I showed in the chapter _didn't_ use destructuring, but some destructuring is possible.
 
+<Exercise
+  title="Exercise 1: Destructuring a Discriminated Union"
+  filePath="/src/018-unions-and-narrowing/075-destructuring-a-discriminated-union.problem.ts"
+/>
+
 #### Exercise 2: Narrowing a Discriminated Union with a Switch Statement
 
 Here we have our `calculateArea` function from the previous exercise, but without any destructuring.
@@ -1478,6 +1483,11 @@ function calculateArea(shape: Shape) {
 
 Your challenge is to refactor this function to use a `switch` statement instead of the `if/else` statement. The `switch` statement should be used to narrow the type of `shape` and calculate the area accordingly.
 
+<Exercise
+  title="Exercise 2: Narrowing a Discriminated Union with a Switch Statement"
+  filePath="/src/018-unions-and-narrowing/076-narrowing-a-discriminated-union-with-a-switch-statement.problem.ts"
+/>
+
 #### Exercise 3: Discriminated Tuples
 
 Here we have a `fetchData` function that returns a promise that resolves to an `APIResponse` tuple that consists of two elements.
@@ -1570,6 +1580,11 @@ If the first element is `"success"`, then the second element should be an array
 
 Your challenge is to redefine the `APIResponse` type to be a discriminated tuple that only allows for the specific combinations for the `success` and `error` states defined above.
 
+<Exercise
+  title="Exercise 3: Discriminated Tuples"
+  filePath="/src/018-unions-and-narrowing/078-destructuring-a-discriminated-tuple.problem.ts"
+/>
+
 #### Exercise 4: Handling Defaults with a Discriminated Union
 
 We're back with our `calculateArea` function:
@@ -1634,6 +1649,11 @@ Your challenge is to:
 1. Make updates to the `Shape` discriminated union that will allow for us to omit `kind`.
 2. Make adjustments to the `calculateArea` function to ensure that TypeScript's type narrowing works properly within the function.
 
+<Exercise
+  title="Exercise 4: Handling Defaults with a Discriminated Union"
+  filePath="/src/018-unions-and-narrowing/080-adding-defaults-to-discriminated-union.problem.ts"
+/>
+
 #### Solution 1: Destructuring a Discriminated Union
 
 Before we look at the working solution, let's look at an attempt that doesn't work out.

book-content/chapters/06-objects.md

@@ -323,12 +323,22 @@ type Product = {
 
 Your task is to create a new `BaseEntity` type that includes the `id` and `createdAt` properties. Then, use the `&` operator to create `User` and `Product` types that intersect with `BaseEntity`.
 
+<Exercise
+  title="Exercise 1: Create an Intersection Type"
+  filePath="/src/020-objects/081-extend-object-using-intersections.problem.ts"
+/>
+
 #### Exercise 2: Extending Interfaces
 
 After the previous exercise, you'll have a `BaseEntity` type along with `User` and `Product` types that intersect with it.
 
 This time, your task is to refactor the types to be interfaces, and use the `extends` keyword to extend the `BaseEntity` type. For extra credit, try creating and extending multiple smaller interfaces.
 
+<Exercise
+  title="Exercise 2: Extending Interfaces"
+  filePath="/src/020-objects/082-extend-object-using-interfaces.problem.ts"
+/>
+
 #### Solution 1: Create an Intersection Type
 
 To solve this challenge, we'll create a new `BaseEntity` type with the common properties:
@@ -668,6 +678,11 @@ scores.science = 85;
 
 Your task is to give `scores` a type annotation to support the dynamic subject keys. There are three ways: an inline index signature, a type, an interface, or a `Record`.
 
+<Exercise
+  title="Exercise 1: Use an Index Signature for Dynamic Keys"
+  filePath="/src/020-objects/084-index-signatures.problem.ts"
+/>
+
 #### Exercise 2: Default Properties with Dynamic Keys
 
 Here, we're trying to model a situation where we want some required keys - `math`, `english`, and `science` - on our scores object.
@@ -693,6 +708,11 @@ The definition of scores should be erroring, because `science` is missing - but
 
 Your task is to update the `Scores` interface to specify default keys for `math`, `english`, and `science` while allowing for any other subject to be added. Once you've updated the type correctly, the red squiggly line below `@ts-expect-error` will go away because `science` will be required but missing. See if you can use `interface extends` to achieve this.
 
+<Exercise
+  title="Exercise 2: Default Properties with Dynamic Keys"
+  filePath="/src/020-objects/085-index-signatures-with-defined-keys.problem.ts"
+/>
+
 #### Exercise 3: Restricting Object Keys With Records
 
 Here we have a `configurations` object, typed as `Configurations` which is currently unknown.
@@ -730,6 +750,11 @@ const configurations: Configurations = {
 
 Update the `Configurations` type so that only the keys from `Environment` are allowed on the `configurations` object. Once you've updated the type correctly, the red squiggly line below `@ts-expect-error` will go away because `notAllowed` will be disallowed properly.
 
+<Exercise
+  title="Exercise 3: Restricting Object Keys With Records"
+  filePath="/src/020-objects/087-record-type-with-union-as-keys.problem.ts"
+/>
+
 #### Exercise 4: Dynamic Key Support
 
 Consider this `hasKey` function that accepts an object and a key, then calls `object.hasOwnProperty` on that object:
@@ -802,6 +827,11 @@ it("Should work on symbol keys", () => {
 
 Your task is to update the `hasKey` function so that all of these tests pass. Try to be as concise as possible!
 
+<Exercise
+  title="Exercise 4: Dynamic Key Support"
+  filePath="/src/020-objects/086-property-key-type.problem.ts"
+/>
+
 #### Solution 1: Use an Index Signature for Dynamic Keys
 
 Here are the three solutions:
@@ -1262,6 +1292,11 @@ Your task is to update the typing so that only the `name` and `email` fields are
 
 You can use the helper types we've looked at to accomplish this, but for extra practice try using just interfaces.
 
+<Exercise
+  title="Exercise 1: Expecting Certain Properties"
+  filePath="/src/020-objects/089-pick-type-helper.problem.ts"
+/>
+
 #### Exercise 2: Updating a Product
 
 Here we have a function `updateProduct` that takes two arguments: an `id`, and a `productInfo` object derived from the `Product` type, excluding the `id` field.
@@ -1308,6 +1343,11 @@ updateProduct(1, {
 
 Your challenge is to modify the `productInfo` parameter to reflect these requirements. The `id` should remain absent from `productInfo`, but we also want all other properties in `productInfo` to be optional.
 
+<Exercise
+  title="Exercise 2: Updating a Product"
+  filePath="/src/020-objects/091-omit-type-helper.problem.ts"
+/>
+
 #### Solution 1: Expecting Certain Properties
 
 There are quite a few ways to solve this problem. Here are a few examples:

book-content/chapters/07-mutability.md

@@ -373,6 +373,11 @@ modifyButtons(buttonsToChange);
 
 Your task is to determine why this error shows up, then resolve it.
 
+<Exercise
+  title="Exercise 1: Inference with an Array of Objects"
+  filePath="/src/028-mutability/098-object-property-inference.problem.ts"
+/>
+
 #### Exercise 2: Avoiding Array Mutation
 
 This `printNames` function accepts an array of `name` strings and logs them to the console. However, there are also non-working `@ts-expect-error` comments that should not allow for names to be added or changed:
@@ -394,6 +399,11 @@ function printNames(names: string[]) {
 
 Your task is to update the type of the `names` parameter so that the array cannot be mutated. There are two ways to solve this problem.
 
+<Exercise
+  title="Exercise 2: Avoiding Array Mutation"
+  filePath="/src/028-mutability/103-readonly-arrays.problem.ts"
+/>
+
 #### Exercise 3: An Unsafe Tuple
 
 Here we have a `dangerousFunction` which accepts an array of numbers as an argument:
@@ -439,6 +449,11 @@ Your task is to adjust the type of `Coordinate` such that TypeScript triggers an
 
 Note that you should only change `Coordinate`, and leave the function untouched.
 
+<Exercise
+  title="Exercise 3: An Unsafe Tuple"
+  filePath="/src/028-mutability/104.5-fixing-unsafe-tuples.problem.ts"
+/>
+
 #### Solution 1: Inference with an Array of Objects
 
 Hovering over the `buttonsToChange` variable shows us that it is being inferred as an array of objects with a `type` property of type `string`:
@@ -791,6 +806,11 @@ Depending on whether or not the fetch operation is successful, the tuple should
 
 Hint: There are two possible approaches to solve this challenge. One way would be to define an explicit return type for the function. Alternatively, you could attempt to add or change type annotations for the `return` values within the function.
 
+<Exercise
+  title="Exercise 1: Returning A Tuple From A Function"
+  filePath="/src/028-mutability/106-as-const-to-make-functions-infer-a-tuple.problem.ts"
+/>
+
 #### Exercise 2: Inferring Literal Values In Arrays
 
 Let's revisit a previous exercise and evolve our solution.
@@ -834,6 +854,11 @@ This time, your challenge is to solve the error by finding a different solution.
 
 You should not alter the `ButtonAttributes` type definition or the `modifyButtons` function.
 
+<Exercise
+  title="Exercise 2: Inferring Literal Values In Arrays"
+  filePath="/src/028-mutability/107-as-const-can-make-strings-infer-as-their-literals-in-objects.explainer.ts"
+/>
+
 #### Solution 1: Returning A Tuple From A Function
 
 As mentioned, there are two different solutions to this challenge.

book-content/chapters/08-classes.md

@@ -723,6 +723,11 @@ As seen from the `@ts-expect-error` directives, we also expect these properties
 
 Your challenge is to implement the `CanvasNode` class to satisfy these requirements. For extra practice, solve the challenge with and without the use of a constructor.
 
+<Exercise
+  title="Exercise 1: Creating a Class"
+  filePath="/src/030-classes/108-understand-classes.problem.ts"
+/>
+
 ### Exercise 2: Implementing Class Methods
 
 In this exercise, we've simplified our `CanvasNode` class so that it no longer has read-only properties:
@@ -761,6 +766,11 @@ Currently, there is an error under the `move` method call because the `CanvasNod
 
 Your task is to add a `move` method to the `CanvasNode` class that will update the `x` and `y` properties to the new location.
 
+<Exercise
+  title="Exercise 2: Implementing Class Methods"
+  filePath="/src/030-classes/109-class-methods.problem.ts"
+/>
+
 ### Exercise 3: Implement a Getter
 
 Let's continue working with the `CanvasNode` class, which now has a constructor that accepts an optional argument, renamed to `position`. This `position` is an object that replaces the individual `x` and `y` we had before:
@@ -826,6 +836,11 @@ it("Should be able to receive an initial position", () => {
 
 Your task is to update the `CanvasNode` class to include a `position` getter that will allow for the test cases to pass.
 
+<Exercise
+  title="Exercise 3: Implement a Getter"
+  filePath="/src/030-classes/111-getters.problem.ts"
+/>
+
 ### Exercise 4: Implement a Setter
 
 The `CanvasNode` class has been updated so that `x` and `y` are now private properties:
@@ -860,6 +875,11 @@ canvasNode.position = { x: 10, y: 20 };
 
 Your task is to write a setter for the `position` property that will allow for the test case to pass.
 
+<Exercise
+  title="Exercise 4: Implement a Setter"
+  filePath="/src/030-classes/113-setters.problem.ts"
+/>
+
 ### Exercise 5: Extending a Class
 
 Here we have a more complex version of the `CanvasNode` class.
@@ -889,6 +909,11 @@ Your task is to refactor the `CanvasNode` class to split the `x` and `y` propert
 
 If you like, you can use an `abstract` class to define `Shape`.
 
+<Exercise
+  title="Exercise 5: Extending a Class"
+  filePath="/src/030-classes/114-extending-other-classes.problem.ts"
+/>
+
 ### Solution 1: Creating a Class
 
 Here's an example of a `CanvasNode` class with a constructor that meets the requirements:

book-content/chapters/10-deriving-types.md

@@ -522,6 +522,12 @@ Notice there is a lot of duplication here. Both the `FormValues` interface and `
 
 Your task is to modify the `inputs` Record so its keys are derived from the `FormValues` interface.
 
+
+<Exercise
+  title="Exercise 1: Reduce Key Repetition"
+  filePath="/src/040-deriving-types-from-values/125-keyof.problem.ts"
+/>
+
 ### Exercise 2: Derive a Type from a Value
 
 Here, we have an object named `configurations` that comprises a set of deployment environments for `development`, `production`, and `staging`.
@@ -555,6 +561,12 @@ We want to use the `Environment` type across our application. However, the `conf
 
 Your task is to update the `Environment` type so that it is derived from the `configurations` object.
 
+
+<Exercise
+  title="Exercise 2: Derive a Type from a Value"
+  filePath="/src/040-deriving-types-from-values/126-typeof-keyword.problem.ts"
+/>
+
 ### Exercise 3: Accessing Specific Values
 
 Here were have an `programModeEnumMap` object that keeps different groupings in sync. There is also a `ProgramModeMap` type that uses `typeof` to represent the entire enum mapping:
@@ -585,6 +597,12 @@ type test = Expect<Equal<Group, "group">>;
 
 Your task is to find the proper way to type `Group` so the test passes as expected.
 
+
+<Exercise
+  title="Exercise 3: Accessing Specific Values"
+  filePath="/src/040-deriving-types-from-values/135-indexed-access-types.problem.ts"
+/>
+
 ### Exercise 4: Unions with Indexed Access Types
 
 This exercise starts with the same `programModeEnumMap` and `ProgramModeMap` as the previous exercise:
@@ -613,6 +631,12 @@ type test = Expect<
 
 This time, your challenge is to update the `PlannedPrograms` type to use an indexed access type to extract a union of the `ProgramModeMap` values that included "`planned`".
 
+
+<Exercise
+  title="Exercise 4: Unions with Indexed Access Types"
+  filePath="/src/040-deriving-types-from-values/136-pass-unions-to-indexed-access-types.problem.ts"
+/>
+
 ### Exercise 5: Extract a Union of All Values
 
 We're back with the `programModeEnumMap` and `ProgramModeMap` type:
@@ -652,6 +676,11 @@ type test = Expect<
 
 Using what you've learned so far, your task is to update the `AllPrograms` type to use an indexed access type to create a union of all the values from the `programModeEnumMap` object.
 
+<Exercise
+  title="Exercise 5: Extract a Union of All Values"
+  filePath="/src/040-deriving-types-from-values/137-pass-keyof-into-an-indexed-access-type.problem.ts"
+/>
+
 ### Exercise 6: Create a Union from an `as const` Array
 
 Here's an array of `programModes` wrapped in an `as const`:
@@ -691,6 +720,11 @@ Your task is to determine how to create the `AllPrograms` type in order for the
 
 Note that just using `keyof` and `typeof` in an approach similar to the previous exercise's solution won't quite work to solve this one! This is tricky to find - but as a hint: you can pass primitive types to indexed access types.
 
+<Exercise
+  title="Exercise 6: Create a Union from an `as const` Array"
+  filePath="/src/040-deriving-types-from-values/138-create-a-union-from-an-as-const-array.problem.ts"
+/>
+
 ### Solution 1: Reduce Key Repetition
 
 The solution is to use `keyof` to extract the keys from the `FormValues` interface and use them as the keys for the `inputs` Record:
@@ -1041,6 +1075,11 @@ In addition to being a bit annoying to write and read, the other problem with th
 
 Your task is to use a utility type to fix this problem.
 
+<Exercise
+  title="Exercise 7: A Single Source of Truth"
+  filePath="/src/040-deriving-types-from-values/132-parameters-type-helper.problem.ts"
+/>
+
 ### Exercise 8: Typing Based on Return Value
 
 Say we're working with a `createUser` function from a third-party library:
@@ -1079,6 +1118,11 @@ type test = Expect<
 
 Your task is to update the `User` type so the test passes as expected.
 
+<Exercise
+  title="Exercise 8: Typing Based on Return Value"
+  filePath="/src/040-deriving-types-from-values/133-return-type.problem.ts"
+/>
+
 ### Exercise 9: Unwrapping a Promise
 
 This time the `createUser` function from the third-party library is asynchronous:
@@ -1111,6 +1155,11 @@ Like before, assume that you do not have access to the implementation of the `fe
 
 Your task is to update the `User` type so the test passes as expected.
 
+<Exercise
+  title="Exercise 9: Unwrapping a Promise"
+  filePath="/src/040-deriving-types-from-values/134-awaited-type-helper.problem.ts"
+/>
+
 ### Solution 7: A Single Source of Truth
 
 The `Parameters` utility type is key to this solution, but there is an additional step to follow.
@@ -1442,4 +1491,4 @@ The decision to derive or decouple is all about reducing your future workload.
 
 Are the two types so related that updates to one will need to ripple to the other? Derive.
 
-Are they so unrelated that coupling them could result in more work down the line? Decouple.
+Are they so unrelated that coupling them could result in more work down the line? Decouple.