TypeScript Tutorial

Create a type Address (street, city, pin, optional landmark) and a type Customer with a readonly id, name and an array of addresses.

Create an interface Shape with area(): number. Create Circle and Rectangle classes that implement it, and a function totalArea(shapes: Shape[]).

Model a payment method that is either a card (cardNumber, expiry) or UPI (upiId), with a "method" discriminator, and write describe(p) returning a string for each.

Create a Theme type from the array const themes = ["light", "dark", "system"] and a function setTheme(t: Theme).

Create a string enum LogLevel (Debug, Info, Warn, Error) and a function log(level, msg) that prefixes the message with the level value.

Write a type Validator = (value: string) => string | null (null means valid) and a function validateAll(value, validators: Validator[]) that returns the first error or null.

Write formatDate(date: Date, options?) where options has optional locale (default "en-IN") and withTime (default false).

Write a generic function last<T>(items: T[]): T | undefined that returns the final element.

Write a class BankAccount with a readonly accountNumber, a private balance starting at 0, deposit(amount) and a balance getter. Reject negative deposits.

In class Car, make engineNumber private readonly, speed protected and model public. Add a static wheels = 4.

Create class AppError extends Error with a statusCode, and NotFoundError extends AppError that always uses 404 and a message like "User not found".

Create abstract class Employee with name, an abstract monthlyPay(): number and a normal method payslip() returning "<name>: ₹<pay>". Implement FullTime (salary/12) and Contractor (hours × rate).

Write describe(x: string | string[] | undefined) that returns "nothing", the string itself, or the items joined with commas.

Write isNonEmptyString(x: unknown): x is string that returns true only for strings with at least one non-space character, and use it to filter ["a", "", 3, " b "].

Given interface Product { id: number; name: string; price: number; stock: number }, create: ProductForm (no id), ProductPatch (all form fields optional) and StockMap (Record of product name to stock).

Write a generic getProp<T, K extends keyof T>(obj: T, key: K): T[K] and show that getProp(user, "age") returns number for user = { name: "Asha", age: 24 }.

You install the JS library "slugify-lite" and get “Could not find a declaration file”. Write a declaration for its default export slugify(text: string): string.

Write a tsconfig.json for a Node.js API that compiles src/ to dist/ with strict checks and source maps.

Fix all strict errors: function firstUpper(list) { return list[0].toUpperCase(); }

Write getJson<T>(url: string, fallback: T): Promise<T> that returns the parsed JSON, or the fallback if the request fails for any reason.

Create a typed Avatar component with props src (string), alt (string), size ("sm" | "md" | "lg", default "md") and optional onClick.

Write a typed UserService with a method getById(id: number): Observable<User> using HttpClient, where User has id, name and email.

Project 2 starter: write sortBy<T>(items: T[], key: keyof T, dir: "asc" | "desc" = "asc"): T[] that returns a sorted copy.