Frontend Interview Questions
Scenario-based questions that test how you think, not what you memorised. Every topic is graded beginner to advanced, so you can start where you are and work upward.
178 questions matched
Compare state-change interpolation with keyframe-driven playback, and learn which one each real interaction actually needs.
Learn the Block Element Modifier convention, why flat single-class selectors keep specificity constant, and where BEM still applies in a component-framework world.
Learn the three-column specificity calculation, where inline styles and !important sit in the cascade, and why specificity is only one tiebreaker among several.
Learn how flex-direction defines the two axes and why every alignment property in Flexbox is meaningless until you know which axis it targets.
Compare the two core Flexbox alignment properties by axis, by what they distribute, and by how their values differ.
Centre with Flexbox in two declarations, then compare Grid place-items and absolute positioning with transform on tradeoffs that actually matter.
See exactly how border-box redefines the width property, why it makes layouts composable, and where it can still bite you.
Understand the four layers every element renders as, and how the two box-sizing modes change what width means.
Learn where each lives in the box model, how their behaviour diverges, and the concrete cases where swapping them breaks a layout.
Compare the one-dimensional and two-dimensional layout models, then apply a concrete decision rule based on who controls the sizing.
Compare all five position values by whether they stay in flow, what they are offset from, and what each one is actually good for.
Compare absolute and relative CSS units by what they resolve against, and learn the accessibility and compounding consequences of each choice.
Compare min-width and max-width strategies by their base styles, override direction, and what each one does to specificity and performance.
One selects existing elements in a particular state, the other creates a sub-part that is not in the DOM. Learn the syntax, specificity, and limits of each.
Understand the anatomy of a React function component, how JSX compiles, and the rules that make a valid component.
Understand the key differences between functional and class components, why hooks changed everything, and why functional components are now the standard.
Understand the difference between props and state in React, when to use each, and how they interact to drive rendering.
Understand what JSX compiles to, why it exists, and the rules that govern how you write it correctly.
Understand React as a UI library, how its declarative model and virtual DOM work, and why it became the dominant choice for frontend development.
Understand the differences in scope, this binding, and syntax between arrow and traditional functions.
Stop scrolling random lists. Build real confidence.
Whether you are preparing for your first frontend role or a senior interview, the goal is the same: explain, implement, and optimise under questioning. Three habits make that happen faster.
- Read the walkthrough before the code, so the code confirms a model you already hold
- Say the answer out loud — the readiness checklist is the test, not the prose
- Work a category beginner to advanced rather than cherry-picking hard questions