fix(curriculum): correct casing for TypeScript (#67147)

This commit is contained in:
Huyen Nguyen
2026-04-28 23:21:04 +07:00
committed by GitHub
parent bbe577c77c
commit ba1eacf64e
9 changed files with 21 additions and 21 deletions
+3 -3
View File
@@ -6276,11 +6276,11 @@
"lab-digital-pet-game": {
"title": "Build a Digital Pet Game",
"intro": [
"In this lab, you'll practice what you learned about Typescript and React by building a digital pet game."
"In this lab, you'll practice what you learned about TypeScript and React by building a digital pet game."
]
},
"review-typescript": {
"title": "Typescript Review",
"title": "TypeScript Review",
"intro": [
"Before you take the TypeScript quiz, you should review everything you've learned so far.",
"Open up this page to review all of the concepts taught including data types in TypeScript, generics, type narrowing and more."
@@ -6288,7 +6288,7 @@
},
"quiz-typescript": {
"title": "TypeScript Quiz",
"intro": ["Test what you've learned on Typescript with this quiz."]
"intro": ["Test what you've learned on TypeScript with this quiz."]
},
"review-front-end-libraries": {
"title": "Front-End Libraries Review",
@@ -19,7 +19,7 @@ Or maybe you're looking for something a bit more practical? Consider an AI assis
An icon pack, such as _VS Code Great Icons_, can help make your file tree cleaner and easier to parse at a glance. And an extension like _Colorize_ can help you understand the values in your CSS properties.
You'll also want language-specific extensions for your projects. If you are using JavaScript, you will likely want _ESLint_ and _Prettier_ to lint and format your code. If you are using TypeScript, you might want _Pretty Typescript Errors_ for easier to read messages.
You'll also want language-specific extensions for your projects. If you are using JavaScript, you will likely want _ESLint_ and _Prettier_ to lint and format your code. If you are using TypeScript, you might want _Pretty TypeScript Errors_ for easier to read messages.
Finally, you can also have a bit of fun with your editor. _VS Code Pets_ offers configurable virtual pets to keep you company while you squash some bugs.
@@ -119,7 +119,7 @@ The final four blocks are where the magic really happens.
run: pnpm run test
```
We have an `Install Dependencies` block, which installs the npm packages. Our `Lint Source Files` block runs the linter, the `Verify Build` block ensures that the Typescript code can compile, and the `Run Tests` block runs the unit tests.
We have an `Install Dependencies` block, which installs the npm packages. Our `Lint Source Files` block runs the linter, the `Verify Build` block ensures that the TypeScript code can compile, and the `Run Tests` block runs the unit tests.
The important thing to know about actions is, by default, if one of these steps fails the remaining ones will be skipped and the entire run will be marked as a failure.
@@ -17,7 +17,7 @@ To pass the quiz, you must correctly answer at least 18 of the 20 questions belo
#### --text--
What is Typescript?
What is TypeScript?
#### --distractors--
@@ -1,6 +1,6 @@
---
id: 6724e296dceca21b82426229
title: Typescript Review
title: TypeScript Review
challengeType: 31
dashedName: review-typescript
---
@@ -255,4 +255,4 @@ Here are descriptions of the compiler options used in the example above:
# --assignment--
Review the Typescript topics and concepts.
Review the TypeScript topics and concepts.
@@ -12,7 +12,7 @@ You have a working circle area calculation logic now. You can type in a radius a
However, if you continue writing this way for rectangles and triangles, things will become a clutter of loose variables and repeated logic. To prevent this, you can structure the data using **interfaces**, and create a function that handles all area calculation cases.
An interface defines the structure of an object by specifying its property types. Here's what an interface looks like in Typescript.
An interface defines the structure of an object by specifying its property types. Here's what an interface looks like in TypeScript.
```ts
interface Footballer {
@@ -7,7 +7,7 @@ dashedName: step-18
# --description--
Your `getElement` function needs a return type. In Typescript, a return type is the type of value a function gives back when it is done running.
Your `getElement` function needs a return type. In TypeScript, a return type is the type of value a function gives back when it is done running.
Here's how to specify a return type:
@@ -23,14 +23,14 @@ For the return type of the `getElement` function, make it `HTMLElement`.
# --hints--
Your `getElement` function should have a return type of `HTMLElement`.
Your `getElement` function should have a return type of `HTMLElement`.
```js
const explorer = await __helpers.Explorer(code);
const { getElement } = explorer.allFunctions;
assert.isTrue(
getElement.hasReturnAnnotation('HTMLElement')
);
const explorer = await __helpers.Explorer(code);
const { getElement } = explorer.allFunctions;
assert.isTrue(
getElement.hasReturnAnnotation('HTMLElement')
);
```
# --seed--
@@ -9,7 +9,7 @@ dashedName: step-4
Now you can start by implementing the area of circle calculation. You would have to select the elements for it and cast the selection using the `as` keyword.
The `as` keyword is used for type assertions. It tells Typescript to treat a value as a specific type without changing the value itself. This is useful when Typescript cannot automatically know the exact type of a value. Here's a typical usage of it:
The `as` keyword is used for type assertions. It tells TypeScript to treat a value as a specific type without changing the value itself. This is useful when TypeScript cannot automatically know the exact type of a value. Here's a typical usage of it:
```ts
const container = document.getElementById("main-section") as HTMLElement;
@@ -34,9 +34,9 @@ assert.match(__helpers.removeJSComments(code), /const\s+circleGroup\s*=/);
You should cast the `circleGroup` selection as `HTMLElement`.
```js
const explorer = await __helpers.Explorer(code);
const { circleGroup } = explorer.variables;
assert.isTrue(circleGroup.value.hasCast("HTMLElement"));
const explorer = await __helpers.Explorer(code);
const { circleGroup } = explorer.variables;
assert.isTrue(circleGroup.value.hasCast("HTMLElement"));
```
# --seed--
@@ -4,7 +4,7 @@
"isUpcomingChange": true,
"dashedName": "review-typescript",
"challengeOrder": [
{ "id": "6724e296dceca21b82426229", "title": "Typescript Review" }
{ "id": "6724e296dceca21b82426229", "title": "TypeScript Review" }
],
"helpCategory": "JavaScript"
}