Search

Lessons (40)

• Small Functions That Do One Thing

  Short, focused functions are easy to name, test and reuse. Learn how to spot a function doing too …

• JavaScript Essentials: Event Loop, Closures & this

  … Closures The big idea A function is like a backpack traveller : wherever it goes, it carries a backpack …

• Serverless Architecture

  … you write functions, the cloud runs them when an event happens , scales them automatically (even to zero), and …

• TypeScript Essentials

  … They're erased from the output, so TypeScript adds zero runtime cost. ts function total(price: number, quantity …

• Comments & Formatting

  … Lying (outdated) comments js // Returns the price in dollars ← written 2 years ago function getPrice(item) { return item …

• Code Smells & Refactoring

  … they prove behaviour didn't change. The smell catalogue Smell Looks like Fix (refactoring) --- --- --- --- 1 Long function 80 …

• React Hooks in Practice

  … never inside if , loops or nested functions. 2. Only call hooks from React functions (components or custom hooks …

• Hash Maps & Sets

  … A hash function turns a key (like "apple" ) into a number (a bucket index), so the computer jumps …

• Recursion & Backtracking

  A function that calls itself to solve smaller copies of a problem. Learn to think recursively, visualise the …

• Meaningful Names

  … Learn simple rules for naming variables, functions and classes so code explains itself. The big idea A name …

• What Is Clean Code?

  … Which one would you rather debug at 2 a.m.? ❌ Hard to read js function calc(a, b …

• Trees & Binary Search Trees

  … node.right; } return null; } function insert(node, value) { if (!node) return new TreeNode(value); if (value < node.value …

• Stacks & Queues

  … When a function returns, its frame is popped. js function a() { b(); } function b() { c(); } function c() { console …

• O — Open/Closed Principle

  … the growing if/else js // ❌ Every new payment method = edit this function again function processPayment(order, method) { if …

• React Fundamentals

  … When state changes, React re-renders that component (and its children). jsx import { useState } from "react"; function Counter …

• Clean Error Handling

  … Fail fast with guard clauses Check bad input at the top of the function and exit immediately. This …

• Big-O Notation Made Simple

  … same work no matter how big the array is function first(arr) { return arr[0]; } // O(n): one …

• Linked Lists

  … Traverse js function toArray(head) { const values = []; for (let node = head; node !== null; node = node.next) values.push …

• I — Interface Segregation Principle

  … string) { / … / } } // Functions ask only for what they need function printReport(printer: Printer, report: Document) { printer.print(report); // accepts …

• KISS: Keep It Simple, Stupid

  … Simplify conditions js // ❌ function getShippingCost(country) { if (country === "US") { return 5; } else if (country === "CA") { return 8; } else …

• Behavioral Patterns I: Observer, Strategy, Command, State

  … 0] S -- D[by weight] In JavaScript, a strategy is usually just a function . You use it every …

• SOLID at a Glance

  … TypeScript adds real interfaces. - Functions are first-class, so you can often pass a function where Java would …

• Sorting Algorithms

  … After each pass, the largest remaining item has floated to the end. js function bubbleSort(arr) { for (let …

• S — Single Responsibility Principle

  … jsx // ❌ Fetching + state + formatting + rendering in one component function UserProfile({ id }) { const [user, setUser] = useState(null); useEffect(() = { fetch …

• Binary Search

  … record it and keep searching left . js function firstIndexOf(sorted, target) { let lo = 0, hi = sorted.length - 1 …

• Two Pointers & Sliding Window

  … pair with target sum (sorted array) js function pairWithSum(sorted, target) { let left = 0; let right = sorted.length …

• D — Dependency Inversion Principle

  … Mailer, ) {} } DIP with plain functions In JavaScript you don't need classes. A higher-order function works just …

• Graphs: BFS & DFS

  … in an unweighted graph, it finds the shortest path (fewest edges). js function shortestPath(graph, start, goal) { const …

• DBMS Foundations, Keys & Normalization

  … Start from functional dependencies, split tables only when the split preserves necessary relationships, and stop when the design …

• What Are Design Patterns?

  … JavaScript's first-class functions , closures and modules make several of them much simpler: - Strategy → just pass a …

• Next.js Rendering: CSR, SSR, SSG, ISR & Server Components

  … the default when a page uses no request-specific data export default async function Page() { / … / } // ISR: regenerate at …

• Dynamic Programming

  … 5. Answer: dp[target] . js function coinChange(coins, amount) { const dp = new Array(amount + 1).fill(Infinity); dp …

• Arrays & Strings

  … Loop once, track something js // Find max, min, sum in one O(n) pass function stats(nums) { let …

• Behavioral Patterns II: Chain, Template, Iterator, Mediator, Memento, Visitor

  … pass the varying steps as functions (Strategy) instead of subclassing, i.e. composition over inheritance. --- 3. Iterator 📺 Analogy …

• Structural Patterns: How to Connect Objects

  … each wraps a function and returns a function with the same shape const withLogging = (fn, name) = async (...args …

• YAGNI: You Aren't Gonna Need It

  … new XmlFormatter() }; // … 300 lines } } js // ✅ Exactly what was asked function ordersToCsv(orders) { const header = "id,customer,total"; const …

• DRY: Don't Repeat Yourself

  … If merged, you will add flags: js // ❌ The wrong abstraction grows ugly function validateName(name, isUser, allowLong, allowSpaces …

• MVC, MVP & MVVM

  … all the state and logic, no JSX function useLoginViewModel() { const [email, setEmail] = useState(""); const [password, setPassword] = useState(""); const …

• Creational Patterns: How to Make Objects

  … one place that knows how to create notifiers function createNotifier(type) { const Notifier = notifiers[type]; if (!Notifier) throw …

• L — Liskov Substitution Principle

  … swim() Red flag 2: instanceof checks js // ❌ The caller has to know about the special case function makeBirdsFly …