#Front-end Job Interview Questions
This file contains a number of front-end interview questions that can be used when vetting potential candidates. It is by no means recommended to use every single question here on the same candidate (that would take hours). Choosing a few items from this list should help you vet the intended skills you require.
- Preliminary site Questions
- General Questions
- HTML Questions
- CSS Questions
- JS Questions
- Fun Questions
- Describe your preferred development environment. (Code editor / OS / web stack)
- Can you describe your workflow when you create a web page?
- What is a recent technical challenge you experienced and how did you solve it?
- Which version control systems are you familiar with?
- If you could master one technology this year, what would it be?
- Please describe your experience with web animations. And list animation methods you are familiar with.
- Do you have any examples of web animations, UI, code experiments that you've created?
- Please expand on your level of javascript expertise.
- Do you have experience with any javascript frameworks, if so which ones?
- Do you have any experience with integrating a front end with a REST api?
- What excites or interests you about coding?
- What UI, Security, Performance, SEO, Maintainability or Technology considerations do you make while building a web application or site?
- If you have 5 different stylesheets, how would you best integrate them into the site?
- Can you describe the difference between progressive enhancement and graceful degradation?
- How would you optimize a website's assets/resources?
- How many resources will a browser download from a given domain at a time?
- What are the exceptions?
- Name 3 ways to decrease page load (perceived or actual load time).
- If you jumped on a project and they used tabs and you used spaces, what would you do?
- Describe how you would create a simple slideshow page.
- What is Flash of Unstyled Content? How do you avoid FOUC?
- Explain some of the pros and cons for CSS animations versus JavaScript animations.
- What does CORS stand for and what issue does it address?
- What does a
doctypedo? - What's the difference between HTML and XHTML?
- What are
data-attributes good for? - Describe the difference between a
cookie,sessionStorageandlocalStorage. - 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?
- Have you used different HTML templating languages before?
- What is the difference between classes and ID's in CSS?
- Describe Floats and how they work.
- Describe z-index and how stacking context is formed.
- Explain CSS sprites, and how you would implement them on a page or site.
- What are your favourite image replacement techniques and which do you use when?
- How would you approach fixing browser-specific styling issues?
- 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?
- 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?
- Describe pseudo-elements and discuss what they are used for.
- What does
* { box-sizing: border-box; }do? What are its advantages? - What's the difference between inline and inline-block?
- What's the difference between a relative, fixed, absolute and statically positioned element?
- Have you played around with the new CSS Flexbox or Grid specs?
- How is responsive design different from adaptive design?
- Have you ever worked with retina graphics? If so, when and what techniques did you use?
- Explain event delegation
- Explain how
thisworks in JavaScript - Explain how prototypal inheritance works
- What do you think of AMD vs CommonJS?
- What's the difference between a variable that is:
null,undefinedorundeclared?- How would you go about checking for any of these states?
- What is a closure, and how/why would you use one?
- Difference between:
function Person(){},var person = Person(), andvar person = new Person()? - What's the difference between
.calland.apply? - Explain AJAX in as much detail as possible.
- Have you ever used JavaScript templating?
- If so, what libraries have you used?
- Describe event bubbling.
- What's the difference between an "attribute" and a "property"?
- Difference between document load event and document ready event?
- What is the difference between
==and===? - Explain the same-origin policy with regards to JavaScript.
- Make this work:
duplicate([1,2,3,4,5]); // [1,2,3,4,5,1,2,3,4,5]- What is
"use strict";? what are the advantages and disadvantages to using it? - Create a for loop that iterates up to
100while outputting "fizz" at multiples of3,"buzz"at multiples of5and "fizzbuzz" at multiples of3and5 - Why is it, in general, a good idea to leave the global scope of a website as-is and never touch it?
- 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 some of the advantages/disadvantages of writing JavaScript code in a language that compiles to JavaScript?
- What tools and techniques do you use debugging JavaScript code?
- What tools would you use to find a performance bug in your code?
- What are some ways you may improve your website's scrolling performance?
- Explain the difference between layout, painting and compositing.
- What's a cool project that you've recently worked on?
- What are some things you like about the developer tools you use?
- Do you have any pet projects? What kind?
- What's your favorite feature of Internet Explorer?
- How do you like your coffee?