1. Introduction
Before writing TypeScript code, you need a working development environment: Node.js and npm installed on your machine, the TypeScript compiler installed as a package, and a configuration file (tsconfig.json) that tells the compiler how to check and build your project.
Cricket analogy: Before a team can play, you need the ground prepared, the pitch report ready, and the match rules confirmed — similarly, before writing TypeScript you need Node.js, npm, and a tsconfig.json that sets the rules for checking your code.
This lesson walks through the typical steps: installing TypeScript, generating a config file, writing a simple .ts file, and compiling and running it with Node.js.
Cricket analogy: Just as a net session walks a batter through stance, backlift, and shot selection step by step, this lesson walks through installing TypeScript, generating a config, writing a .ts file, and running it.
2. Syntax
# Install Node.js first (from nodejs.org), then install TypeScript as a dev dependency
npm init -y
npm install --save-dev typescript
# Generate a default tsconfig.json file
npx tsc --init
# Compile a single file
npx tsc hello.ts
# Run the compiled JavaScript with Node.js
node hello.js3. Explanation
TypeScript is distributed as an npm package, so the standard setup uses Node.js and npm (or yarn/pnpm) to install it into a project, typically as a devDependency since it's only needed during development/build, not at runtime. Running npx tsc --init generates a tsconfig.json file with common compiler options (like target, module, and strict) that control how your TypeScript is checked and compiled.
Cricket analogy: Installing TypeScript via npm as a devDependency is like a team hiring a specialist analyst only for pre-season prep, not for matchday; running npx tsc --init is like drafting the season's playing conditions document (target, module, strict) up front.
Once configured, running tsc compiles every .ts file covered by tsconfig.json into JavaScript, placing the output according to the outDir setting (or next to the source file if unset). Many developers also install ts-node, a tool that compiles and runs TypeScript directly in one step during development, without a separate compile phase.
Cricket analogy: Running tsc compiles every .ts file the way a groundstaff prepares every pitch listed in the season fixtures, placing finished output in outDir; ts-node is like a practice net that lets a batter face live bowling immediately, without separate preparation.
A common gotcha: installing TypeScript globally (npm install -g typescript) works for quick experiments, but production and team projects should install it locally as a devDependency in each project. This ensures everyone on the team — and your CI pipeline — uses the exact same TypeScript version, avoiding 'works on my machine' compiler version mismatches.
4. Example
// File: greet.ts
function greet(name: string, times: number = 1): string[] {
const messages: string[] = [];
for (let i = 0; i < times; i++) {
messages.push(`Hello, ${name}!`);
}
return messages;
}
const result = greet("TypeScript", 3);
result.forEach((msg) => console.log(msg));
// Compile with: npx tsc greet.ts
// Run with: node greet.js5. Output
Hello, TypeScript!
Hello, TypeScript!
Hello, TypeScript!6. Key Takeaways
- TypeScript requires Node.js and npm to install and run its compiler tooling.
- Install TypeScript locally per project with 'npm install --save-dev typescript' for consistent versions across a team.
- 'npx tsc --init' generates a tsconfig.json that controls compiler behavior (target, module, strict, outDir, etc.).
- Running 'tsc' compiles .ts files into plain .js files, which Node.js or a browser can then execute.
- Tools like ts-node let you run TypeScript directly during development without a separate manual compile step.
Practice what you learned
1. Which command generates a default tsconfig.json file in a project?
2. A common misconception is that TypeScript can run directly in Node.js or a browser without any build step. What is actually true?
3. Why is it generally recommended to install TypeScript as a local devDependency rather than only globally?
4. What does the 'tsc' command do when run against a .ts file with no errors?
5. What is the purpose of a tool like ts-node in a TypeScript workflow?
Was this page helpful?
You May Also Like
Introduction to TypeScript Programming
An overview of TypeScript as a typed superset of JavaScript, why it exists, and how it improves reliability in large codebases.
Configuring tsconfig.json in TypeScript
How tsconfig.json controls TypeScript compiler behavior, including strictness, target/module output, file inclusion, and output directories.
Features of TypeScript
A tour of TypeScript's core language features — static typing, interfaces, generics, and tooling — that set it apart from plain JavaScript.
Modules in TypeScript
How TypeScript uses ES module syntax (import/export) to organize code across files, with type-only imports and module resolution basics.
Declaration Files (.d.ts) in TypeScript
How .d.ts files describe the shape of JavaScript code for the TypeScript compiler, including DefinitelyTyped (@types) packages.
Related Reading
Related Study Notes in Programming
Browse all study notesApache Spark Study Notes
Programming · 30 topics
ProgrammingApache Flink Study Notes
Programming · 30 topics
ProgrammingHadoop Study Notes
Programming · 30 topics
ProgrammingSnowflake Study Notes
Programming · 30 topics
ProgrammingApache Airflow Study Notes
Programming · 30 topics
Programmingdbt (Data Build Tool) Study Notes
Programming · 30 topics