Skip to content

FOUNDATIONS · LESSON 1 OF 24

Set up TypeScript and run your first program

Understand the path from TypeScript source to running JavaScript.

  • Node.js
  • npm
  • tsc
  • type erasure

Your runnable checkpoint

Extract into a new practice folder. Each download includes complete source, package.json, tsconfig.json and an offline lesson. Use Node.js 22 or 24. Each checkpoint is independent.

Install with npm install. Run npm run check, then npm run build. Terminal lessons use npm start; browser lessons use npm run serve and http://127.0.0.1:4173.

1. Understand the concepts

TypeScript adds a static type checker to JavaScript. It helps you catch mismatched values before running a program. The JavaScript runtime still performs the work; most type annotations disappear during compilation. A successful type check is useful evidence, not proof that every input or calculation is correct.

You should already know JavaScript variables, functions, arrays, objects and basic control flow. Install Node.js 22 or 24 with npm and a code editor. On an M1 Mac choose the ARM64 installer from nodejs.org. Check node --version and npm --version in Terminal or Windows Command Prompt.

Download this checkpoint, extract it, and open a terminal in the folder containing package.json. Run npm install, npm run check, npm run build, then npm start. npm scripts find the project-local compiler; you do not need a global TypeScript installation.

Every checkpoint pins TypeScript 5.9.3 for reproducibility; it is the course baseline, not a claim about the newest release. Keep the package-lock.json created by npm install. Later installs can use npm ci. Each ZIP is independent, so extract it into a separate directory.

src/main.ts is your source. tsc reads tsconfig.json and writes dist/main.js. Node runs that generated file. Rebuild after editing source. noEmitOnError prevents new JavaScript output when a type error exists, but an old dist folder can still contain an earlier build.

2. Build and run

These are complete files. Preserve the paths shown below, including the src directory. The package and compiler configuration are included at the end.

src/main.ts

src/main.ts
const learner: string = "Asha";
function greet(name: string): string {
  return `Welcome, ${name}!`;
}
console.log(greet(learner));

package.json

package.json
{
  "name": "edupoly-typescript-setup-and-first-program",
  "private": true,
  "version": "1.0.0",
  "type": "module",
  "scripts": {
    "check": "tsc --noEmit",
    "build": "tsc",
    "start": "node dist/main.js"
  },
  "devDependencies": {
    "typescript": "5.9.3"
  }
}

tsconfig.json

tsconfig.json
{
  "compilerOptions": {
    "target": "ES2022",
    "module": "NodeNext",
    "moduleResolution": "NodeNext",
    "lib": [
      "ES2022",
      "DOM"
    ],
    "strict": true,
    "noUncheckedIndexedAccess": true,
    "exactOptionalPropertyTypes": true,
    "noEmitOnError": true,
    "verbatimModuleSyntax": true,
    "rootDir": "src",
    "outDir": "dist",
    "sourceMap": true,
    "types": [],
    "moduleDetection": "force"
  },
  "include": [
    "src/**/*"
  ]
}

3. Trace the code and check the result

  1. The string annotation describes learner; it does not convert a number to text.
  2. greet promises to accept a string and return a string.
  3. Inspect dist/main.js after building: the annotations are gone.

Expected result

Welcome, Asha!

4. Practice independently

Change learner to 42, run npm run check, then repair the error.

Show the explanation

The compiler rejects number assigned to string. Use "42" if text is intended, or redesign the function to accept a number explicitly.

When something goes wrong

If tsc is missing, run npm install in the folder containing package.json. If the output looks old, rebuild before running. Read the first compiler diagnostic and check the indicated field or argument. For module errors, preserve the .js extensions in imports. Browser examples must run through the included local server, not directly as TypeScript files.

Read the related official TypeScript documentation ↗