While coding, trying to remember whether a variable is a string or a number gets tiring. When you misremember, the error usually blows up on the user's screen. TypeScript steps in right here and catches that problem while you are still typing.TypeScript is a language that adds a type system on top of JavaScript. The code you write still compiles to JavaScript, so it runs in the browser or on the server. The difference is that errors surface at write time, not at runtime. This article covers type safety from its practical side.
What does the TypeScript type system give you?
When you pass the wrong kind of data to a function, the editor warns you instantly. The error appears on your screen before the code ships. This way, hours-long bug hunts end before they even start.The basic types are simple: string, number, boolean, array, and object. The real power hides in union types, though. A value can take more than one type, and you state each one explicitly.
type Status = "pending" | "approved" | "cancelled";
function process(status: Status) {
// status can only be one of these three values
}This approach cuts typos at the root. Write "aproved" instead of "approved" and the editor flags it in red immediately. The official everyday types section explains these concepts with examples.
Reusable code with generics
You do not want to rewrite the same logic for different types over and over. That is exactly why generics exist. You define a function independent of type, then set the type when you call it.
function firstItem<T>(list: T[]): T | undefined {
return list[0];
}
const num = firstItem([1, 2, 3]); // number
const text = firstItem(["a", "b"]); // stringHere T is a placeholder. Whatever array you call the function with, the return type adjusts to match it. You write one function and avoid building a separate solution for every type. Generics make life much easier with API responses and data layers in particular.
Type transformations with utility types
TypeScript lets you transform existing types with built-in utility types. Instead of defining a new type, you reshape an existing one. I gathered the most used ones in the table below.
Utility typeWhat it does
Partial<T> | Makes all fields optional
Required<T> | Makes all fields mandatory
Pick<T, K> | Creates a new type with only the selected fields
Omit<T, K> | Creates a new type by removing the named fields
Record<K, V> | Defines a type with a key value mapping
Picture a user update form. Not all fields are required; you send only the ones that changed. Partial is exactly what you need here. You avoid rewriting the same data type for both creation and updates.
Why should strict mode be on?
The real protection of TypeScript comes with strict mode. You enable this setting in the tsconfig file, and it turns on many strict checks at once. Without it, you lose half of the safety the language offers.The two most important checks are strictNullChecks and noImplicitAny. The first forces you to handle null and undefined values explicitly. The second flags every value you leave without a type as an error.
{
"compilerOptions": {
"strict": true,
"noUncheckedIndexedAccess": true
}
}One habit to avoid is reaching for the any type freely. any turns off all type checking for that value. If you have data whose type you do not know, use unknown instead of any. unknown forces you to check the type before using it and keeps your safety intact.
Benefits on the backend and frontend
TypeScript is not just for browser code. You get the same guarantees when writing a backend on Node.js. Deno runs TypeScript directly, without a separate setup step. You define the type of an API response once and share it on both server and client.This shared type structure is a huge win for teams. When the backend renames a field, the frontend code fails to compile and the error shows up instantly. From database models to the API layer, everything stays consistent.
- The compiler shows you what you broke during refactoring.
- The editor reminds you of field names through autocomplete.
- A new developer grasps the code faster thanks to the types.
- Many bugs get caught even before you write a test.
In short, and the next step
TypeScript adds a serious safety layer to JavaScript projects at a low cost. As you learn the type system, generics, and utility types, you write fewer bugs. Turning on strict mode from the start also saves you time in the long run.At Kritm Cloud Solutions, we build custom software with TypeScript and modern JavaScript. We set up web, mobile, and API projects on a type-safe architecture and ship them on our cloud infrastructure. Take a look at our services, or get in touch for your project.
