Interview Q&A

Master technical and career interviews with structured answers—short definition, real examples, pitfalls, and how to answer in 60–90 seconds.

4608 total questions 4508 technical 100 career & HR 4272 from PDF library
Timed practice exams Career & HR Resume builder LinkedIn optimizer
All Career & HR Junior Mid Senior

Showing 2301–2325 of 4608

Career & HR topics

All career 100 AI Career (2026) 10 Career Growth 10 Freelancing 10 Interview Preparation 10 Job Change 10 LinkedIn & Personal Brand 10 Notice Period 10 Resume & ATS 10 Salary Negotiation 10 Work & Office 10

By tech stack

ADO.NET 105 AI Career (2026) 10 ASP.NET Core 261 ASP.NET Core MVC 56 ASP.NET Web API 106 Agile & Scrum 75 Angular 114 Azure DevOps 47 C# Coding Interview 142 C# Collections 108 C# MNC Coding Interview 9 C# OOP 157 Career Growth 10 DSA & Coding Interviews 44 Design Patterns & SOLID 104 Entity Framework Core 154 Freelancing 10 Gang of Four Patterns 372 Git & GitHub 193 High-Impact Interview Questions 16 Interview Preparation 10 JavaScript 286 Job Change 10 LINQ 221 LinkedIn & Personal Brand 10 Managerial Interview 63 Microservices 697 Microsoft Azure 297 Node.js 165 Notice Period 10 React.js 160 Resume & ATS 10 SQL & Databases 310 Salary Negotiation 10 Unit Testing 103 Work & Office 10

Popular tracks

Microservices with .NET 697 C# Programming Tutorial 519 Design Patterns in C# 476 Developer Essentials 347 Microsoft Azure Tutorial 344 SQL Server Tutorial 310 JavaScript Tutorial 286 ASP.NET Core Tutorial 261 LINQ Tutorial 221 Node.js Tutorial 165 React.js Tutorial 160 Entity Framework Core Tutorial 154
Junior PDF
What is prototype inheritance?

Short answer: In JavaScript, every object can inherit properties from another object called its prototype. This enables object reusability. Example: const animal = { eats: true }; Example code const dog = Object.create(a…

JavaScript Read answer
Mid PDF
What are functions in JavaScript?

Short answer: Functions are blocks of reusable code that perform a specific task. Example: function greet(name) { return `Hello, ${name}`; } Example code Functions are blocks of reusable code that perform a specific task…

JavaScript Read answer
Mid PDF
!important overrides all (use sparingly).?

Short answer: Example: p { color: black; } /* low */ #intro { color: blue; } /* higher */ <p id="intro" style="color:red;">text</p> <!-- highest --> Key Takeaway: Use balanced specif…

JavaScript Read answer
Junior PDF
What is the difference between @import and <link>?

Short answer: Follow me on LinkedIn: Aspect @import &lt;link&gt; Loaded Inside CSS Inside HTML &lt;head&gt; Performance Slower (sequential) Faster (parallel) Media Queries Can include Can include Recommended ❌ Avoid ✅ Pr…

JavaScript Read answer
Mid PDF
How do you use position: sticky?

Short answer: Makes an element toggle between relative and fixed based on scroll position. Example code header { position: sticky; top: 0; background: white; } Follow me on LinkedIn: Key Takeaway: sticky elements stay vi…

JavaScript Read answer
Junior PDF
What is the box model in CSS?

Short answer: Every HTML element is a box made of: Real-world example (ShopNest) ShopNest’s browser cart uses modern JavaScript: fetch APIs with async/await, modules, and clear error handling. Say this in the interview D…

JavaScript Read answer
Junior PDF
What is lazy loading in HTML5?

Short answer: Lazy loading defers loading of non-critical images or iframes until they are visible in the viewport — improving page speed. Example code &lt;img src=&quot;photo.jpg&quot; loading=&quot;lazy&quot; alt=&quot…

JavaScript Read answer
Mid PDF
How do you create a hyperlink in HTML?

Short answer: Use the &lt;a&gt; tag with the href attribute. Example code &lt;a href=&quot; target=&quot;_blank&quot;&gt;Visit Google&lt;/a&gt; Explanation: Follow me on LinkedIn: href specifies the link URL. target=&quo…

JavaScript Read answer
Junior PDF
What is the difference between var, let, and const?

Short answer: var: function-scoped, can be redeclared. let: block-scoped, cannot redeclare in the same scope. const: block-scoped, cannot be reassigned. Example: var x = 10; let y = 20; const z = 30; Example code var: fu…

JavaScript Read answer
Mid PDF
What are semantic HTML elements?

Short answer: Give examples. Semantic elements clearly describe their purpose in the document structure. Examples include: &lt;header&gt;, &lt;footer&gt;, &lt;article&gt;, &lt;nav&gt;, &lt;section&gt;. Example: &lt;artic…

JavaScript Read answer
Mid PDF
Explain the srcset and sizes attributes for <img>.

Short answer: They help browsers pick the best image for the user’s device and screen size. Follow me on LinkedIn: Example code &lt;img src=&quot;small.jpg&quot; srcset=&quot;medium.jpg 768w, large.jpg 1200w&quot; sizes=…

JavaScript Read answer
Mid PDF
What are breakpoints in Bootstrap?

Short answer: Breakpoints define responsive screen widths: Breakpoint Prefix Size Extra small none &lt;576px Small sm ≥576px Medium md ≥768px Large lg ≥992px Extra large xl ≥1200px XXL xxl ≥1400px Real-world example (Sho…

JavaScript Read answer
Mid PDF
What are web workers?

Short answer: Web Workers allow JavaScript to run code in background threads, keeping the UI responsive. Example code // main.js const worker = new Worker('worker.js'); worker.postMessage('Start'); // worker.js onmessage…

JavaScript Read answer
Mid PDF
What are ES6 modules?

Short answer: ES6 introduced modules for code reusability and organization. They use export and import keywords. Example code // math.js export function add(a, b) { return a + b; } // main.js import { add } from './math.…

JavaScript Read answer
Mid PDF
How do you handle browser compatibility issues in CSS?

Short answer: ✅ Common techniques: Use Autoprefixer for vendor prefixes. Use feature queries: @supports (display: grid) { .container { display: grid; } } Provide fallbacks for older browsers: background: #000; background…

JavaScript Read answer
Junior PDF
What is the difference between min-width and max-width?

Short answer: Property Description min-wid th Element won’t shrink below this width max-wid th Element won’t grow beyond this width Example code div { min-width: 200px; max-width: 600px; } Key Takeaway: Use both for resp…

JavaScript Read answer
Mid PDF
What are pseudo-classes and pseudo-elements?

Short answer: Pseudo-class: targets an element’s state. hover { color: red; } Pseudo-element: targets part of an element. p::first-line { font-weight: bold; } Follow me on LinkedIn: Key Takeaway: :hover changes behavior;…

JavaScript Read answer
Mid PDF
How do you make an HTML element draggable?

Short answer: Add the draggable=&quot;true&quot; attribute and use drag events in JavaScript. Example code &lt;p id=&quot;drag1&quot; draggable=&quot;true&quot; ondragstart=&quot;drag(event)&quot;&gt;Drag me!&lt;/p&gt; &…

JavaScript Read answer
Mid PDF
What are semantic HTML elements? Give examples.

Short answer: Semantic elements clearly describe their purpose in the document structure. Examples include: &lt;header&gt;, &lt;footer&gt;, &lt;article&gt;, &lt;nav&gt;, &lt;section&gt;. Example: &lt;article&gt; &lt;h2&g…

JavaScript Read answer
Junior PDF
What is hoisting?

Short answer: Hoisting is JavaScript’s behavior of moving variable and function declarations to the top of their scope. Example: console.log(a); // undefined var a = 5; Example code Hoisting is JavaScript’s behavior of m…

JavaScript Read answer
Mid PDF
Explain the difference between <script> and <noscript>.

Short answer: &lt;script&gt; runs JavaScript. &lt;noscript&gt; displays content when JavaScript is disabled or not supported. Example code &lt;script&gt; document.write(&quot;JavaScript is enabled!&quot;); Follow me on L…

JavaScript Read answer
Mid PDF
How do you make a responsive layout in Bootstrap?

Short answer: Use the grid system and responsive classes: &lt;div class=&quot;col-12 col-md-6 col-lg-4&quot;&gt;Responsive column&lt;/div&gt; Real-world example (ShopNest) ShopNest’s browser cart uses modern JavaScript:…

JavaScript Read answer
Junior PDF
What is the difference between shallow and deep equality?

Short answer: Shallow equality: Compares only top-level properties. Deep equality: Compares nested values recursively. Example code {a:1} === {a:1} // false (different refs) Use libraries like Lodash’s _.isEqual() for de…

JavaScript Read answer
Mid PDF
What are template literals?

Short answer: Template literals allow embedded expressions and multi-line strings using backticks (`). Example: let name = &quot;John&quot;; console.log(`Hello, ${name}!`); Example code Template literals allow embedded e…

JavaScript Read answer
Junior PDF
What is BEM (Block Element Modifier) methodology?

Short answer: BEM is a naming convention for writing scalable and reusable CSS. Structure: .block__element--modifier Example code &lt;div class=&quot;card card--featured&quot;&gt; &lt;h2 class=&quot;card__title&quot;&gt;…

JavaScript Read answer

JavaScript JavaScript Tutorial · JavaScript

Short answer: In JavaScript, every object can inherit properties from another object called its prototype. This enables object reusability. Example: const animal = { eats: true };

Example code

const dog = Object.create(animal); Follow me on LinkedIn: dog.barks = true; console.log(dog.eats); // true (inherited)

Real-world example (ShopNest)

Prefer arrow functions for React/event callbacks in ShopNest so this is not accidentally rebound.

Say this in the interview

  1. Define — one clear sentence (the short answer above).
  2. Example — relate it to a project like ShopNest or your real work.
  3. Trade-off — when you would not use it.
Permalink & share

JavaScript JavaScript Tutorial · JavaScript

Short answer: Functions are blocks of reusable code that perform a specific task. Example: function greet(name) { return `Hello, ${name}`; }

Example code

Functions are blocks of reusable code that perform a specific task. Example: function greet(name) { return `Hello, ${name}`;
}

Real-world example (ShopNest)

ShopNest’s browser cart uses modern JavaScript: fetch APIs with async/await, modules, and clear error handling.

Say this in the interview

  1. Define — one clear sentence (the short answer above).
  2. Example — relate it to a project like ShopNest or your real work.
  3. Trade-off — when you would not use it.
Permalink & share

JavaScript JavaScript Tutorial · JavaScript

Short answer: Example: p { color: black; } /* low */ #intro { color: blue; } /* higher */ <p id="intro" style="color:red;">text</p> <!-- highest --> Key Takeaway: Use balanced specificity; avoid overuse of !important.

Example code

p { color: black; } /* low */ #intro { color: blue; } /* higher */ <p id="intro" style="color:red;">text</p> <!-- highest --> Key Takeaway: Use balanced specificity; avoid overuse of !important.

Real-world example (ShopNest)

ShopNest’s browser cart uses modern JavaScript: fetch APIs with async/await, modules, and clear error handling.

Say this in the interview

  1. Define — one clear sentence (the short answer above).
  2. Example — relate it to a project like ShopNest or your real work.
  3. Trade-off — when you would not use it.
Permalink & share

JavaScript JavaScript Tutorial · JavaScript

Short answer: Follow me on LinkedIn: Aspect @import <link> Loaded Inside CSS Inside HTML <head> Performance Slower (sequential) Faster (parallel) Media Queries Can include Can include Recommended ❌ Avoid ✅ Preferred Key Takeaway: Use <link> — it loads faster and supports preloading and caching better.

Real-world example (ShopNest)

ShopNest’s browser cart uses modern JavaScript: fetch APIs with async/await, modules, and clear error handling.

Say this in the interview

  1. Define — one clear sentence (the short answer above).
  2. Example — relate it to a project like ShopNest or your real work.
  3. Trade-off — when you would not use it.
Permalink & share

JavaScript JavaScript Tutorial · JavaScript

Short answer: Makes an element toggle between relative and fixed based on scroll position.

Example code

header { position: sticky; top: 0; background: white; } Follow me on LinkedIn: Key Takeaway: sticky elements stay visible within their parent container while scrolling.

Real-world example (ShopNest)

ShopNest’s browser cart uses modern JavaScript: fetch APIs with async/await, modules, and clear error handling.

Say this in the interview

  1. Define — one clear sentence (the short answer above).
  2. Example — relate it to a project like ShopNest or your real work.
  3. Trade-off — when you would not use it.
Permalink & share

JavaScript JavaScript Tutorial · JavaScript

Short answer: Every HTML element is a box made of:

Real-world example (ShopNest)

ShopNest’s browser cart uses modern JavaScript: fetch APIs with async/await, modules, and clear error handling.

Say this in the interview

  1. Define — one clear sentence (the short answer above).
  2. Example — relate it to a project like ShopNest or your real work.
  3. Trade-off — when you would not use it.
Permalink & share

JavaScript JavaScript Tutorial · JavaScript

Short answer: Lazy loading defers loading of non-critical images or iframes until they are visible in the viewport — improving page speed.

Example code

<img src="photo.jpg" loading="lazy" alt="Nature view"> Key Takeaway: loading="lazy" helps reduce initial load time and saves bandwidth.

Real-world example (ShopNest)

ShopNest’s browser cart uses modern JavaScript: fetch APIs with async/await, modules, and clear error handling.

Say this in the interview

  1. Define — one clear sentence (the short answer above).
  2. Example — relate it to a project like ShopNest or your real work.
  3. Trade-off — when you would not use it.
Permalink & share

JavaScript JavaScript Tutorial · JavaScript

Short answer: Use the <a> tag with the href attribute.

Example code

<a href=" target="_blank">Visit Google</a> Explanation: Follow me on LinkedIn: href specifies the link URL. target="_blank" opens it in a new tab. Key Takeaway: Always add descriptive link text for accessibility.

Real-world example (ShopNest)

ShopNest’s browser cart uses modern JavaScript: fetch APIs with async/await, modules, and clear error handling.

Say this in the interview

  1. Define — one clear sentence (the short answer above).
  2. Example — relate it to a project like ShopNest or your real work.
  3. Trade-off — when you would not use it.
Permalink & share

JavaScript JavaScript Tutorial · JavaScript

Short answer: var: function-scoped, can be redeclared. let: block-scoped, cannot redeclare in the same scope. const: block-scoped, cannot be reassigned. Example: var x = 10; let y = 20; const z = 30;

Example code

var: function-scoped, can be redeclared. let: block-scoped, cannot redeclare in the same scope. const: block-scoped, cannot be reassigned. Example: var x = 10;
let y = 20;
const z = 30;

Real-world example (ShopNest)

In ShopNest’s cart UI, a click handler closes over productId. Use let in loops so each button keeps the correct id.

Say this in the interview

  1. Define — one clear sentence (the short answer above).
  2. Example — relate it to a project like ShopNest or your real work.
  3. Trade-off — when you would not use it.
Permalink & share

JavaScript JavaScript Tutorial · JavaScript

Short answer: Give examples. Semantic elements clearly describe their purpose in the document structure. Examples include: <header>, <footer>, <article>, <nav>, <section>. Example: <article> <h2>Breaking News</h2> <p>New tech trends are emerging every day.</p> </article> Key Takeaway: Semantic tags improve SEO and accessibility.

Real-world example (ShopNest)

ShopNest’s browser cart uses modern JavaScript: fetch APIs with async/await, modules, and clear error handling.

Say this in the interview

  1. Define — one clear sentence (the short answer above).
  2. Example — relate it to a project like ShopNest or your real work.
  3. Trade-off — when you would not use it.
Permalink & share

JavaScript JavaScript Tutorial · JavaScript

Short answer: They help browsers pick the best image for the user’s device and screen size. Follow me on LinkedIn:

Example code

<img src="small.jpg" srcset="medium.jpg 768w, large.jpg 1200w" sizes="(max-width: 768px) 100vw, 50vw" alt="Landscape"> srcset defines available image files and their widths. sizes tells the browser how much space the image will take on different screens. Key Takeaway: srcset + sizes = responsive images that load efficiently across devices.

Real-world example (ShopNest)

ShopNest’s browser cart uses modern JavaScript: fetch APIs with async/await, modules, and clear error handling.

Say this in the interview

  1. Define — one clear sentence (the short answer above).
  2. Example — relate it to a project like ShopNest or your real work.
  3. Trade-off — when you would not use it.
Permalink & share

JavaScript JavaScript Tutorial · JavaScript

Short answer: Breakpoints define responsive screen widths: Breakpoint Prefix Size Extra small none <576px Small sm ≥576px Medium md ≥768px Large lg ≥992px Extra large xl ≥1200px XXL xxl ≥1400px

Real-world example (ShopNest)

ShopNest’s browser cart uses modern JavaScript: fetch APIs with async/await, modules, and clear error handling.

Say this in the interview

  1. Define — one clear sentence (the short answer above).
  2. Example — relate it to a project like ShopNest or your real work.
  3. Trade-off — when you would not use it.
Permalink & share

JavaScript JavaScript Tutorial · JavaScript

Short answer: Web Workers allow JavaScript to run code in background threads, keeping the UI responsive.

Example code

// main.js const worker = new Worker('worker.js'); worker.postMessage('Start'); // worker.js onmessage = e => postMessage('Task done');

Real-world example (ShopNest)

ShopNest’s browser cart uses modern JavaScript: fetch APIs with async/await, modules, and clear error handling.

Say this in the interview

  1. Define — one clear sentence (the short answer above).
  2. Example — relate it to a project like ShopNest or your real work.
  3. Trade-off — when you would not use it.
Permalink & share

JavaScript JavaScript Tutorial · JavaScript

Short answer: ES6 introduced modules for code reusability and organization. They use export and import keywords.

Example code

// math.js export function add(a, b) { return a + b; } // main.js import { add } from './math.js';

Real-world example (ShopNest)

ShopNest’s browser cart uses modern JavaScript: fetch APIs with async/await, modules, and clear error handling.

Say this in the interview

  1. Define — one clear sentence (the short answer above).
  2. Example — relate it to a project like ShopNest or your real work.
  3. Trade-off — when you would not use it.
Permalink & share

JavaScript JavaScript Tutorial · JavaScript

Short answer: ✅ Common techniques: Use Autoprefixer for vendor prefixes. Use feature queries: @supports (display: grid) { .container { display: grid; } } Provide fallbacks for older browsers: background: #000; background: linear-gradient(to right, #000, #333); ● Test with tools like BrowserStack. Key Takeaway: Graceful degradation and progressive enhancement keep CSS cross-browser safe. Follow me on LinkedIn:

Real-world example (ShopNest)

ShopNest’s browser cart uses modern JavaScript: fetch APIs with async/await, modules, and clear error handling.

Say this in the interview

  1. Define — one clear sentence (the short answer above).
  2. Example — relate it to a project like ShopNest or your real work.
  3. Trade-off — when you would not use it.
Permalink & share

JavaScript JavaScript Tutorial · JavaScript

Short answer: Property Description min-wid th Element won’t shrink below this width max-wid th Element won’t grow beyond this width

Example code

div { min-width: 200px; max-width: 600px; } Key Takeaway: Use both for responsive, constrained resizing.

Real-world example (ShopNest)

ShopNest’s browser cart uses modern JavaScript: fetch APIs with async/await, modules, and clear error handling.

Say this in the interview

  1. Define — one clear sentence (the short answer above).
  2. Example — relate it to a project like ShopNest or your real work.
  3. Trade-off — when you would not use it.
Permalink & share

JavaScript JavaScript Tutorial · JavaScript

Short answer: Pseudo-class: targets an element’s state. hover { color: red; } Pseudo-element: targets part of an element. p::first-line { font-weight: bold; } Follow me on LinkedIn: Key Takeaway: :hover changes behavior; ::before and ::after insert content.

Real-world example (ShopNest)

ShopNest’s browser cart uses modern JavaScript: fetch APIs with async/await, modules, and clear error handling.

Say this in the interview

  1. Define — one clear sentence (the short answer above).
  2. Example — relate it to a project like ShopNest or your real work.
  3. Trade-off — when you would not use it.
Permalink & share

JavaScript JavaScript Tutorial · JavaScript

Short answer: Add the draggable="true" attribute and use drag events in JavaScript.

Example code

<p id="drag1" draggable="true" ondragstart="drag(event)">Drag me!</p> <script> function drag(e) { e.dataTransfer.setData("text", e.target.id); } </script> Key Takeaway: Use draggable="true" plus ondragstart and ondrop to enable drag-and-drop functionality.

Real-world example (ShopNest)

ShopNest’s browser cart uses modern JavaScript: fetch APIs with async/await, modules, and clear error handling.

Say this in the interview

  1. Define — one clear sentence (the short answer above).
  2. Example — relate it to a project like ShopNest or your real work.
  3. Trade-off — when you would not use it.
Permalink & share

JavaScript JavaScript Tutorial · JavaScript

Short answer: Semantic elements clearly describe their purpose in the document structure. Examples include: <header>, <footer>, <article>, <nav>, <section>. Example: <article> <h2>Breaking News</h2> <p>New tech trends are emerging every day.</p> </article> Key Takeaway: Semantic tags improve SEO and accessibility.

Real-world example (ShopNest)

ShopNest’s browser cart uses modern JavaScript: fetch APIs with async/await, modules, and clear error handling.

Say this in the interview

  1. Define — one clear sentence (the short answer above).
  2. Example — relate it to a project like ShopNest or your real work.
  3. Trade-off — when you would not use it.
Permalink & share

JavaScript JavaScript Tutorial · JavaScript

Short answer: Hoisting is JavaScript’s behavior of moving variable and function declarations to the top of their scope. Example: console.log(a); // undefined var a = 5;

Example code

Hoisting is JavaScript’s behavior of moving variable and function declarations to the top of their scope. Example: console.log(a); // undefined var a = 5;

Real-world example (ShopNest)

Prefer arrow functions for React/event callbacks in ShopNest so this is not accidentally rebound.

Say this in the interview

  1. Define — one clear sentence (the short answer above).
  2. Example — relate it to a project like ShopNest or your real work.
  3. Trade-off — when you would not use it.
Permalink & share

JavaScript JavaScript Tutorial · JavaScript

Short answer: <script> runs JavaScript. <noscript> displays content when JavaScript is disabled or not supported.

Example code

<script> document.write("JavaScript is enabled!"); Follow me on LinkedIn: </script> <noscript> <p>Please enable JavaScript to view this content.</p> </noscript> Key Takeaway: <noscript> provides graceful fallback content.

Real-world example (ShopNest)

ShopNest’s browser cart uses modern JavaScript: fetch APIs with async/await, modules, and clear error handling.

Say this in the interview

  1. Define — one clear sentence (the short answer above).
  2. Example — relate it to a project like ShopNest or your real work.
  3. Trade-off — when you would not use it.
Permalink & share

JavaScript JavaScript Tutorial · JavaScript

Short answer: Use the grid system and responsive classes: <div class="col-12 col-md-6 col-lg-4">Responsive column</div>

Real-world example (ShopNest)

ShopNest’s browser cart uses modern JavaScript: fetch APIs with async/await, modules, and clear error handling.

Say this in the interview

  1. Define — one clear sentence (the short answer above).
  2. Example — relate it to a project like ShopNest or your real work.
  3. Trade-off — when you would not use it.
Permalink & share

JavaScript JavaScript Tutorial · JavaScript

Short answer: Shallow equality: Compares only top-level properties. Deep equality: Compares nested values recursively.

Example code

{a:1} === {a:1} // false (different refs) Use libraries like Lodash’s _.isEqual() for deep comparison. Follow me on LinkedIn:

Real-world example (ShopNest)

ShopNest’s browser cart uses modern JavaScript: fetch APIs with async/await, modules, and clear error handling.

Say this in the interview

  1. Define — one clear sentence (the short answer above).
  2. Example — relate it to a project like ShopNest or your real work.
  3. Trade-off — when you would not use it.
Permalink & share

JavaScript JavaScript Tutorial · JavaScript

Short answer: Template literals allow embedded expressions and multi-line strings using backticks (`). Example: let name = "John"; console.log(`Hello, ${name}!`);

Example code

Template literals allow embedded expressions and multi-line strings using backticks (`). Example: let name = "John"; console.log(`Hello, ${name}!`);

Real-world example (ShopNest)

ShopNest’s browser cart uses modern JavaScript: fetch APIs with async/await, modules, and clear error handling.

Say this in the interview

  1. Define — one clear sentence (the short answer above).
  2. Example — relate it to a project like ShopNest or your real work.
  3. Trade-off — when you would not use it.
Permalink & share

JavaScript JavaScript Tutorial · JavaScript

Short answer: BEM is a naming convention for writing scalable and reusable CSS. Structure: .block__element--modifier

Example code

<div class="card card--featured"> <h2 class="card__title">Profile</h2> </div> Key Takeaway: BEM enforces clarity: Block = independent component Element = part of a block Modifier = variation/state

Real-world example (ShopNest)

ShopNest’s browser cart uses modern JavaScript: fetch APIs with async/await, modules, and clear error handling.

Say this in the interview

  1. Define — one clear sentence (the short answer above).
  2. Example — relate it to a project like ShopNest or your real work.
  3. Trade-off — when you would not use it.
Permalink & share
Toolliyo Assistant
Ask about tutorials, ebooks, training, pricing, mentor services, and support. I use public site content only—not admin or internal tools.

care@toolliyo.com

Need callback? Share your details