Frontend Developer Interview Questions
Frontend Developer Interview Questions
Prep for the interview and get the job you want
About the Book
Your next job interview is a crucial moment in your life, to land your dream job you must prepare for the most challenging questions you might have during the interview. This book is a collection of questions and answers that will help you get ready for that important moment.
More than 80 questions with answers splitted in 3 chapters covering:
- HTML
- CSS
- Javascript
Plus a Free Gift inside for you !!
Check out other books from the author:
Up to Speed with Javascript in 59 minutes
Learning Python Programming from Scratch
Backend Developer Interview Questions
Bundles that include this book
Table of Contents
- Other Books by Alejandro
- Your Free Gift
-
Introduction
- Who is this book for ?
- What this book covers ?
-
Chapter 1: HTML Interview Questions
- What does a DOCTYPE do?
- How do you serve a page with content in multiple languages?
- What kind of things must you be wary of when designing or developing for multilingual sites?
-
What are
data-
attributes good for? - Consider HTML5 as an open web platform. What are the building blocks of HTML5?
-
Describe the difference between a
cookie
,sessionStorage
andlocalStorage
. -
Describe the difference between
<script>
,<script async>
and<script defer>
. -
Why is it generally a good idea to position CSS
<link>
s between<head></head>
and JS<script>
s just before</body>
? Do you know any exceptions? - What is progressive rendering?
-
Why you would use a
srcset
attribute in an image tag? Explain the process the browser uses when evaluating the content of this attribute. - Have you used different HTML templating languages before?
-
Chapter 2: CSS Interview Questions
- What is CSS selector specificity and how does it work?
- What’s the difference between “resetting” and “normalizing” CSS? Which would you choose, and why?
-
Describe
float
s and how they work. -
Describe
z-index
and how stacking context is formed. - Describe Block Formatting Context (BFC) and how it works.
- What are the various clearing techniques and which is appropriate for what context?
- Explain CSS sprites, and how you would implement them on a page or site.
- How would you approach fixing browser-specific styling issues?
- How do you serve your pages for feature-constrained browsers? What techniques/processes do you use?
- What are the different ways to visually hide content (and make it available only for screen readers)?
- Have you ever used a grid system, and if so, what do you prefer?
- Have you used or implemented media queries or mobile-specific layouts/CSS?
- Are you familiar with styling SVG?
- Can you give an example of an @media property other than screen?
- What are some of the “gotchas” for writing efficient CSS?
- What are the advantages/disadvantages of using CSS preprocessors?
- Describe what you like and dislike about the CSS preprocessors you have used.
- How would you implement a web design comp that uses non-standard fonts?
- Explain how a browser determines what elements match a CSS selector.
- Describe pseudo-elements and discuss what they are used for.
- Explain your understanding of the box model and how you would tell the browser in CSS to render your layout in different box models.
-
What does
* { box-sizing: border-box; }
do? What are its advantages? -
What is the CSS
display
property and can you give a few examples of its use? -
What’s the difference between
inline
andinline-block
? -
What’s the difference between a
relative
,fixed
,absolute
andstatic
ally positioned element? - What existing CSS frameworks have you used locally, or in production? How would you change/improve them?
- Have you played around with the new CSS Flexbox or Grid specs?
- Can you explain the difference between coding a website to be responsive versus using a mobile-first strategy?
- How is responsive design different from adaptive design?
- Have you ever worked with retina graphics? If so, when and what techniques did you use?
-
Is there any reason you’d want to use
translate()
instead ofabsolute
positioning, or vice-versa? And why?
-
Chapter 3: Javascript Interview Questions
- Explain event delegation
-
Explain how
this
works in JavaScript - Explain how prototypal inheritance works
- What do you think of AMD vs CommonJS?
-
Explain why the following doesn’t work as an IIFE:
function foo(){ }();
. What needs to be changed to properly make it an IIFE? -
What’s the difference between a variable that is:
null
,undefined
or undeclared? How would you go about checking for any of these states? - What is a closure, and how/why would you use one?
-
Can you describe the main difference between a
.forEach
loop and a.map()
loop and why you would pick one versus the other? - What’s a typical use case for anonymous functions?
- How do you organize your code? (module pattern, classical inheritance?)
- What’s the difference between host objects and native objects?
-
Difference between:
function Person(){}
,var person = Person()
, andvar person = new Person()
? -
What’s the difference between
.call
and.apply
? -
Explain
Function.prototype.bind
. -
When would you use
document.write()
? - What’s the difference between feature detection, feature inference, and using the UA string?
- Explain Ajax in as much detail as possible.
- What are the advantages and disadvantages of using Ajax?
- Explain how JSONP works (and how it’s not really Ajax).
- Have you ever used JavaScript templating? If so, what libraries have you used?
- Explain “hoisting”.
- Describe event bubbling.
- What’s the difference between an “attribute” and a “property”?
- Why is extending built-in JavaScript objects not a good idea?
-
Difference between document
load
event and documentDOMContentLoaded
event? -
What is the difference between
==
and===
? - Explain the same-origin policy with regards to JavaScript.
- Make this work:
- Why is it called a Ternary expression, what does the word “Ternary” indicate?
-
What is
"use strict";
? What are the advantages and disadvantages to using it? -
Create a for loop that iterates up to
100
while outputting “fizz” at multiples of3
, “buzz” at multiples of5
and “fizzbuzz” at multiples of3
and5
. - Why is it, in general, a good idea to leave the global scope of a website as-is and never touch it?
-
Why would you use something like the
load
event? Does this event have disadvantages? Do you know any alternatives, and why would you use those? - Explain what a single page app is and how to make one SEO-friendly.
- What is the extent of your experience with Promises and/or their polyfills?
- What are the pros and cons of using Promises instead of callbacks?
- What are some of the advantages/disadvantages of writing JavaScript code in a language that compiles to JavaScript?
- What tools and techniques do you use for debugging JavaScript code?
- What language constructions do you use for iterating over object properties and array items?
- Explain the difference between mutable and immutable objects.
- How can you achieve immutability in your own code?
- Explain the difference between synchronous and asynchronous functions.
- What is event loop? What is the difference between call stack and task queue?
-
Explain the differences on the usage of
foo
betweenfunction foo() {}
andvar foo = function() {}
-
What are the differences between variables created using
let
,var
orconst
? - What are the differences between ES6 class and ES5 function constructors?
- Can you offer a use case for the new arrow ⇒ function syntax? How does this new syntax differ from other functions?
- What advantage is there for using the arrow syntax for a method in a constructor?
- What is the definition of a higher-order function?
- Can you give an example for destructuring an object or an array?
- ES6 Template Literals offer a lot of flexibility in generating strings, can you give an example?
- Can you give an example of a curry function and why this syntax offers an advantage?
- What are the benefits of using spread syntax and how is it different from rest syntax?
- How can you share code between files?
- Why you might want to create static class members?
- Keep developing your interviewing skills
- About the Author
The Leanpub 60 Day 100% Happiness Guarantee
Within 60 days of purchase you can get a 100% refund on any Leanpub purchase, in two clicks.
Now, this is technically risky for us, since you'll have the book or course files either way. But we're so confident in our products and services, and in our authors and readers, that we're happy to offer a full money back guarantee for everything we sell.
You can only find out how good something is by trying it, and because of our 100% money back guarantee there's literally no risk to do so!
So, there's no reason not to click the Add to Cart button, is there?
See full terms...
Earn $8 on a $10 Purchase, and $16 on a $20 Purchase
We pay 80% royalties on purchases of $7.99 or more, and 80% royalties minus a 50 cent flat fee on purchases between $0.99 and $7.98. You earn $8 on a $10 sale, and $16 on a $20 sale. So, if we sell 5000 non-refunded copies of your book for $20, you'll earn $80,000.
(Yes, some authors have already earned much more than that on Leanpub.)
In fact, authors have earnedover $14 millionwriting, publishing and selling on Leanpub.
Learn more about writing on Leanpub
Free Updates. DRM Free.
If you buy a Leanpub book, you get free updates for as long as the author updates the book! Many authors use Leanpub to publish their books in-progress, while they are writing them. All readers get free updates, regardless of when they bought the book or how much they paid (including free).
Most Leanpub books are available in PDF (for computers) and EPUB (for phones, tablets and Kindle). The formats that a book includes are shown at the top right corner of this page.
Finally, Leanpub books don't have any DRM copy-protection nonsense, so you can easily read them on any supported device.
Learn more about Leanpub's ebook formats and where to read them