HTML + CSS + JS Revision

Overview

This checklist covers essential web frontend foundations: semantic markup, modern responsive CSS layouts, and modern JavaScript (ES6+) core concepts and browser APIs.

Tip: Make sure you can construct semantic, responsive page layouts with Flexbox and CSS Grid without referencing external cheatsheets.

HTML5 Refresh

• Semantic tags — <header>, <nav>, <main>, <section>, <article>, <footer>
• Forms — <form>, all input types, validation attributes (required, pattern, min/max)
• Tables — <table>, <thead>, <tbody>, <th>, <td>
• Media — <img>, <video>, <audio>, <figure>, <figcaption>
• <meta> tags, SEO basics, <link>, <script> (defer/async)
• Accessibility — alt, aria-*, role, tabindex

CSS3 Refresh

• Selectors — element, class, id, attribute, pseudo-class (:hover, :nth-child, :focus), pseudo-element (::before, ::after)
• Specificity rules & cascade order
• Box model — margin, padding, border, box-sizing: border-box
• Display — block, inline, inline-block, none, flex, grid
• Positioning — static, relative, absolute, fixed, sticky
• Flexbox — justify-content, align-items, flex-wrap, gap, flex-grow/shrink
• CSS Grid — grid-template-columns/rows, grid-area, auto-fit, minmax, fr
• Responsive design — media queries, clamp(), viewport units (vw, vh, dvh)
• CSS variables (custom properties)
• Transitions & animations — transition, @keyframes, animation
• z-index, stacking context, overflow

JavaScript (ES6+) Refresh

• let, const, var — scoping & hoisting
• Data types, typeof, type coercion, truthy/falsy
• Functions — declaration, expression, arrow, IIFE
• Scope — block, function, lexical scope, closures
• this keyword — in different contexts
• Objects — creation, destructuring, spread/rest, computed properties
• Prototypes & prototype chain
• Arrays — map, filter, reduce, find, some, every, flat, flatMap
• DOM — querySelector, createElement, addEventListener, event delegation
• Event loop — call stack, task queue, microtask queue
• Async — callbacks → Promises → async/await
• fetch API, error handling with try/catch
• ES6 modules — import/export
• localStorage / sessionStorage / cookies
• Optional chaining (?.), nullish coalescing (??)
• Map, Set, WeakMap, WeakSet
• Debounce & throttle
• Destructuring, template literals, tagged templates