Search

Lessons (9)

• React Fundamentals

  … name }) . JSX rules: return one root element (or a fragment < …</ ), use className instead of class , write {expression} for …

• React Hooks in Practice

  … memory jsx const [todos, setTodos] = useState([]); const [filter, setFilter] = useState("all"); // Lazy initial value: the function runs only …

• React vs Vue vs Angular

  … You + community Google Templates JSX (JavaScript) HTML templates ( v-if , v-for ) or JSX HTML templates ( @if , @for …

• State Management (Redux, Zustand, TanStack Query)

  … Don't hand-roll that with useEffect + useState . jsx import { useQuery, useMutation, useQueryClient } from "@tanstack/react-query"; function …

• S — Single Responsibility Principle

  … frontend example SRP applies to React components too. jsx // ❌ Fetching + state + formatting + rendering in one component function UserProfile …

• Frontend Security

  … everything you put in {} : <script becomes harmless text. jsx const comment = '<img src=x onerror="alert(1)" '; <p …

• Frontend Performance & Core Web Vitals

  … responsive. - Debounce expensive handlers (search as you type). jsx const [query, setQuery] = useState(""); const [isPending, startTransition] = useTransition(); function …

• JavaScript Essentials: Event Loop, Closures & this

  … 100); // 0, 1, 2 Stale closures in React jsx function Timer() { const [count, setCount] = useState(0); useEffect(() = { const …

• MVC, MVP & MVVM

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