What Happens When You Type a URL and Press Enter
DNS lookups, TCP and TLS handshakes, HTTP requests, servers, and the browser's rendering pipeline. The whole journey of a web page, explained so it finally clicks.
Read →TypeScript catches bugs before they ship and makes refactoring far less scary, but it has real costs. What you gain, what it won't do for you, and how to adopt it without a painful rewrite.
Few topics start arguments among JavaScript developers like TypeScript. Some swear they'll never write untyped code again; others see it as ceremony that slows them down. Both have a point. Here's an honest look at what TypeScript gives you, what it costs, and when it's worth it.
TypeScript is JavaScript with type annotations. You write .ts files, a compiler checks the types, and the output is plain JavaScript. The types disappear at runtime.
type User = {
id: number
name: string
email?: string // optional
}
function greet(user: User): string {
return `Hello, ${user.name}`
}
greet({ id: 1, nme: 'Asha' })
// Error: Object literal may only specify known properties,
// and 'nme' does not exist in type 'User'.
That typo would have been a silent undefined in JavaScript. TypeScript catches it as you type.
1. Bugs caught before running the code. Typos, wrong argument orders, missing properties, calling a method on something that might be null. A lot of everyday mistakes never make it past your editor.
2. Fearless refactoring. Rename a field or change a function signature, and the compiler lists every place that needs updating. In a large JavaScript codebase, that kind of change is guesswork.
3. Better editor experience. Accurate autocomplete, inline documentation and "go to definition" that works across the whole project.
4. Code that documents itself. A function signature tells you exactly what goes in and what comes out. New teammates understand code faster.
5. Safer API contracts. Sharing types between frontend and backend means a changed API response breaks the build instead of breaking production.
This is the most important misunderstanding to avoid: TypeScript doesn't check data at runtime.
const res = await fetch('/api/user')
const user: User = await res.json() // TypeScript trusts you here
If the API returns something different, TypeScript has no idea. Data from APIs, forms, files and databases must still be validated at runtime, usually with a schema library like Zod, Valibot or similar, which can also generate the TypeScript type for you:
import { z } from 'zod'
const UserSchema = z.object({ id: z.number(), name: z.string(), email: z.string().email().optional() })
type User = z.infer<typeof UserSchema>
const user = UserSchema.parse(await res.json()) // validated and typed
You don't need a rewrite:
tsconfig.json with allowJs: true, so JavaScript and TypeScript files coexist.// @ts-check to JavaScript files to get type checking via JSDoc comments.strict: true as soon as possible. Most of TypeScript's value comes from strict mode, especially strict null checks.any. It switches off checking. Use unknown when you truly don't know a type, then narrow it.null, say so. The compiler will make you handle it.For most professional web development, yes, TypeScript is worth it. The upfront cost is paid back quickly in fewer bugs and much safer changes, and it's widely expected in job listings. Just remember that it's a development-time tool: validate real data at runtime, and keep your types simple.
Learn JavaScript fundamentals first, then add TypeScript. Once you're comfortable with the language, TypeScript's errors will make much more sense.
No. Types are removed before the code runs, so the output is ordinary JavaScript with the same runtime performance.
No, TypeScript compiles to JavaScript and depends on it. It's become very common for professional projects, but JavaScript remains the language that actually runs.
DNS lookups, TCP and TLS handshakes, HTTP requests, servers, and the browser's rendering pipeline. The whole journey of a web page, explained so it finally clicks.
Read →There are dozens of HTTP status codes, but about fifteen cover nearly everything. What each one means, when to return it, and the mix-ups (401 vs 403, 301 vs 302) that confuse everyone.
Read →A, AAAA, CNAME, MX, TXT and NS records in plain English, why DNS changes seem slow, and the troubleshooting commands that tell you what is really going on.
Read →