Technologia

TypeScript

JavaScript z supermocami. Typowanie statyczne, autocompletion, refactoring — standard w nowoczesnym web development.

Czym jest TypeScript?

TypeScript to nadzbiór JavaScript stworzony przez Microsoft. Dodaje opcjonalne typowanie statyczne, interfejsy, generics i zaawansowane narzędzia do refactoringu. Kompiluje się do czystego JavaScript i działa wszędzie, gdzie działa JS.

TypeScript jest de facto standardem w ekosystemie React, Next.js, Angular, Nest.js i większości nowoczesnych frameworków. Używa go ponad 78% profesjonalnych projektów webowych.

Przykłady kodu

Typy i interfejsy

TypeScript interface User { id: string; name: string; email: string; role: 'admin' | 'user' | 'editor'; createdAt: Date; } type CreateUserDTO = Omit<User, 'id' | 'createdAt'>; const createUser = (data: CreateUserDTO): User => ({ ...data, id: crypto.randomUUID(), createdAt: new Date(), });

Generics

TypeScript async function fetchData<T>( url: string, schema: ZodSchema<T> ): Promise<T> { const res = await fetch(url); const json = await res.json(); return schema.parse(json); // runtime validation } // Użycie — pełny type safety const users = await fetchData('/api/users', UserArraySchema); users.map(u => u.name); // ✅ autocomplete działa

React Component

TSX / React interface ButtonProps { variant: 'primary' | 'outline' | 'ghost'; size?: 'sm' | 'md' | 'lg'; children: React.ReactNode; onClick?: () => void; disabled?: boolean; } export const Button = ({ variant, size = 'md', children, ...props }: ButtonProps) => ( <button className={cn('btn', `btn-${variant}`, `btn-${size}`)} {...props} > {children} </button> );

API Route (Next.js)

Next.js API import { NextRequest, NextResponse } from 'next/server'; import { db } from '@/lib/db'; export async function GET(req: NextRequest) { const { searchParams } = new URL(req.url); const page = Number(searchParams.get('page')) || 1; const users = await db.user.findMany({ skip: (page - 1) * 20, take: 20, orderBy: { createdAt: 'desc' }, }); return NextResponse.json({ users, page }); }

Ocena kompetencji

Ekosystem
99%
Type safety
95%
Popularność
97%
Łatwość nauki
80%
Wydajność
72%
Tooling (IDE)
98%

Co potrafi TypeScript

Frontend (React/Next.js)

SPA, SSR, SSG, ISR. Komponenty, hooks, server components. Cały ekosystem React.

Backend (Node.js/Nest.js)

REST/GraphQL API, mikroserwisy, WebSockets, kolejki, CRON jobs.

Full-stack

Jeden język na froncie i backendzie. Shared types, monorepo, end-to-end type safety.

Tooling

Najlepsze IDE support w branży. ESLint, Prettier, auto-import, refactoring.

Testy

Jest, Vitest, Playwright, Cypress. Type-safe mocks i fixtures.

Walidacja runtime

Zod, io-ts, Valibot — schema validation z inferencją typów.

Kiedy wybrać TypeScript?

Idealny gdy: budujesz aplikację webową (SPA, SSR), potrzebujesz full-stack JS/TS, pracujesz w zespole (typy = dokumentacja), budujesz SaaS, dashboard, e-commerce.

Nie najlepszy gdy: budujesz natywną aplikację mobilną (lepiej Flutter/Swift), potrzebujesz heavy-compute (lepiej Go/Rust), budujesz ML pipeline (lepiej Python).